2 次程式碼提交

作者 SHA1 備註 提交日期
  FlorianEisenmenger 4da4b7bf05 fix fullwidth 1 周之前
  FlorianEisenmenger f74c15b78b fix width 1 周之前
共有 2 個檔案被更改,包括 2 行新增99 行删除
統一視圖
  1. +1
    -1
      gfi-ihk-2024/stories/sections/card-slider/card-slider.scss
  2. +1
    -98
      gfi-ihk-2024/stories/sections/teasers/teasers.scss

+ 1
- 1
gfi-ihk-2024/stories/sections/card-slider/card-slider.scss 查看文件

@@ -204,7 +204,7 @@
padding-right: var(--container-padding); padding-right: var(--container-padding);
} }
.card-slider-container { .card-slider-container {
max-width: none;
max-width: 1340px;
} }
.like-h2 { .like-h2 {
max-width: none; max-width: none;


+ 1
- 98
gfi-ihk-2024/stories/sections/teasers/teasers.scss 查看文件

@@ -1,7 +1,7 @@
@import '../../_global/styles/mixins'; @import '../../_global/styles/mixins';
@import '../../_global/styles/vars'; @import '../../_global/styles/vars';


.teasers {
.teasers:not([data-items="1"]) {
position: relative; position: relative;
display: block; display: block;


@@ -240,103 +240,6 @@
} }
} }


@media(min-width: 568px) {
&[data-items="1"] {
.kicker:first-child {
min-width: 100%;
}

.teaser {
&:not(.fullwidth) {
display: flex;
flex-direction: row;
align-items: flex-start;
flex-wrap: wrap;
}
&.fullwidth {
.kicker:first-child {
max-width: calc(50% - var(--col-padding));
min-width: calc(50% - var(--col-padding));
}

//.image-box {
// margin-top: -29px;
//}
}
}

.text-box {
min-width: 100%;
}

.image-box {
max-width: calc(50% - 20px);
min-width: calc(50% - 20px);
flex: 1 1 100%;
margin-right: 40px;

~ .kicker {
position: absolute;
left: 50%;
margin-left: 20px;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
max-width: calc(50% - 20px);

~ .text-box {
padding-top: 10px;
min-width: calc(50% - 20px);
max-width: calc(50% - 20px);
}
}
}
}
}

@media(min-width: 1000px) {
&[data-items="1"] {
.teaser:has(.image-box) {
display: grid !important;
grid-template-columns: 1fr 1fr !important;
align-items: start;
gap: 0 40px;
.kicker {
grid-column: 2;
grid-row: 1;
}
.title {
margin-top: 0 !important;
}
.image-box {
grid-column: 1;
grid-row: 1 / span 999;
width: 100% !important;
max-width: none;
margin-top: 0 !important;
//max-width: calc(50% - 20px);
//min-width: calc(50% - 20px);

~ .kicker {
//max-width: calc(50% - 20px);
//margin-left: 20px;
}

~ .text-box {
grid-column: 2;
grid-row: 2;
//max-width: calc(50% - 20px);
//min-width: calc(50% - 20px);
}
~ .reading-time {
grid-column: 2;
grid-row: 3;
}
}
}
}
}

div.teaser { div.teaser {
height: 100%; height: 100%;
display: flex; display: flex;


Loading…
取消
儲存