mirror of
https://github.com/jgthms/bulma.git
synced 2024-11-28 12:24:23 +00:00
118 lines
2.0 KiB
SCSS
118 lines
2.0 KiB
SCSS
$bd-sponsor-padding: $block-spacing;
|
|
$bd-sponsor-width: 12rem;
|
|
|
|
.bd-sponsors {
|
|
--bd-sponsors-spacing: #{$block-spacing};
|
|
padding: var(--bd-sponsors-spacing);
|
|
}
|
|
|
|
.bd-sponsors-body {
|
|
// display: grid;
|
|
// grid-gap: var(--bd-index-gap);
|
|
}
|
|
|
|
@include mobile {
|
|
.bd-sponsors {
|
|
grid-gap: var(--bd-sponsors-spacing);
|
|
}
|
|
}
|
|
|
|
.bd-partner-sponsors {
|
|
--sponsor-width: #{$bd-sponsor-width - 1rem};
|
|
display: grid;
|
|
grid-gap: 0;
|
|
grid-template-columns: repeat(auto-fill, minmax(var(--sponsor-width), 1fr));
|
|
margin-left: -$block-spacing;
|
|
margin-right: -$block-spacing;
|
|
overflow: hidden;
|
|
}
|
|
|
|
.bd-partner-sponsor {
|
|
@extend %center;
|
|
@extend %link-before-background;
|
|
|
|
padding: $bd-sponsor-padding ($bd-sponsor-padding / 2);
|
|
|
|
strong,
|
|
img {
|
|
position: relative;
|
|
}
|
|
|
|
img {
|
|
border-radius: 0.5em;
|
|
max-height: 3rem;
|
|
width: auto;
|
|
}
|
|
}
|
|
|
|
@include touch {
|
|
.bd-sponsors {
|
|
padding: var(--bd-index-vertical);
|
|
}
|
|
}
|
|
|
|
@include desktop {
|
|
.bd-sponsors {
|
|
// padding-bottom: var(--bd-index-vertical);
|
|
// padding-top: var(--bd-index-vertical);
|
|
}
|
|
|
|
.bd-sponsors-body {
|
|
align-items: center;
|
|
grid-gap: 0;
|
|
grid-template-columns:
|
|
var(--bd-index-gap) 1fr calc(
|
|
calc(var(--container-width) - var(--bd-index-gap)) / 2
|
|
)
|
|
var(--bd-index-gap) calc(
|
|
calc(var(--container-width) - var(--bd-index-gap)) / 2
|
|
)
|
|
1fr var(--bd-index-gap);
|
|
}
|
|
|
|
.bd-sponsors-content {
|
|
align-items: flex-start;
|
|
display: flex;
|
|
font-size: 1.125rem;
|
|
grid-column: 3 / span 1;
|
|
max-width: none;
|
|
|
|
.content {
|
|
margin-left: 1.5rem;
|
|
margin-right: 1.5rem;
|
|
}
|
|
|
|
.button {
|
|
flex-shrink: 0;
|
|
}
|
|
}
|
|
|
|
.bd-sponsors-list {
|
|
grid-column: 4 / span 4;
|
|
}
|
|
}
|
|
|
|
@include widescreen {
|
|
.bd-sponsors {
|
|
--bd-sponsors-spacing: 6rem;
|
|
}
|
|
|
|
.bd-sponsors-content {
|
|
font-size: 1.25rem;
|
|
}
|
|
|
|
.bd-partner-sponsors {
|
|
--sponsor-width: #{$bd-sponsor-width};
|
|
}
|
|
}
|
|
|
|
@include fullhd {
|
|
// .bd-sponsors {
|
|
// --bd-sponsors-spacing: 9rem;
|
|
// }
|
|
|
|
.bd-sponsors-content {
|
|
font-size: 1.5rem;
|
|
}
|
|
}
|