diff --git a/docs/_includes/index/sponsor.html b/docs/_includes/index/sponsor.html index 7bf9daa3..b357216c 100644 --- a/docs/_includes/index/sponsor.html +++ b/docs/_includes/index/sponsor.html @@ -1,44 +1,51 @@ -
-
-
-

Sponsors

-
- - themeisle logo - - - {% - include elements/responsive-image.html - path="sponsors/chainaxe" - extension="png" - alt="chainaxe logo" - width="99" - height="70" - %} - - - {% - include elements/responsive-image.html - path="sponsors/keycdn" - extension="png" - alt="keycdn logo" - width="200" - height="58" - %} - - - {% - include elements/responsive-image.html - path="sponsors/tooltwist" - extension="png" - alt="tooltwist logo" - width="200" - height="64" - %} - +
+
+
+
+

Sponsors

+
+ + themeisle logo + + + {% + include elements/responsive-image.html + path="sponsors/chainaxe" + extension="png" + alt="chainaxe logo" + width="85" + height="60" + %} + + + {% + include elements/responsive-image.html + path="sponsors/keycdn" + extension="png" + alt="keycdn logo" + width="150" + height="43.5" + %} + + + {% + include elements/responsive-image.html + path="sponsors/tooltwist" + extension="png" + alt="tooltwist logo" + width="160" + height="51" + %} + +
+
+ +
+

Ads via Carbon

+
+ {% include elements/carbon.html %} +
+
-
- {% include elements/carbon.html %} -
diff --git a/docs/_sass/global.sass b/docs/_sass/global.sass index 762c9dd5..af545e69 100644 --- a/docs/_sass/global.sass +++ b/docs/_sass/global.sass @@ -4,7 +4,6 @@ svg $carbon-spacing: 1rem $carbon-shadow-size: 0.75rem -$carbon-height: 100px $carbon-image-height: 100px $carbon-image-width: 130px $carbon-poweredby-height: 20px diff --git a/docs/_sass/index.sass b/docs/_sass/index.sass index 985b9868..090c5bee 100644 --- a/docs/_sass/index.sass +++ b/docs/_sass/index.sass @@ -1,6 +1,6 @@ .bd-focus margin: 6rem auto 0 - max-width: 1080px + max-width: $intro-width .bd-focus-item .subtitle @@ -174,12 +174,6 @@ &:hover opacity: 1 -.intro-partners - margin-top: 6rem - -.intro-carbon - margin-top: 0.5rem - +mobile .intro-buttons .button diff --git a/docs/_sass/sponsors.sass b/docs/_sass/sponsors.sass index c13295ac..2d5ab668 100644 --- a/docs/_sass/sponsors.sass +++ b/docs/_sass/sponsors.sass @@ -8,28 +8,44 @@ margin-right: 3rem width: 150px -.bd-sponsor - margin-left: auto - margin-right: auto - text-align: center - -.bd-sponsor-title - font-size: $size-small - margin-bottom: 1em - opacity: 0.5 - -.bd-sponsor-list +.bd-partner-sponsors align-items: center display: flex flex-wrap: wrap - justify-content: center + justify-content: space-between + margin-bottom: -1rem a align-items: center display: flex justify-content: center - margin: 1rem - width: 160px - img - max-height: 60px - width: auto + margin: 0 1rem 1rem 0 + min-height: $carbon-height +.bd-partners + background-color: $white-bis + .container + max-width: $intro-width + #carbonads + .carbon-text + padding-bottom: 0 + .carbon-poweredby + display: none + +.bd-partner-title + color: $grey-light + font-size: 0.875rem + margin-bottom: 1rem + ++tablet + .bd-partners-list + align-items: flex-start + display: flex + .bd-partner + &.bd-is-sponsor + flex-grow: 1 + flex-shrink: 1 + &.bd-is-carbon + flex-grow: 0 + flex-shrink: 0 + margin-left: ($main-spacing * 2) + width: $carbon-width diff --git a/docs/bulma-docs.sass b/docs/bulma-docs.sass index 830f2da2..1f615134 100644 --- a/docs/bulma-docs.sass +++ b/docs/bulma-docs.sass @@ -13,7 +13,9 @@ $star: #FFD257 $rss: #f26522 $carbon-width: 300px +$carbon-height: 100px $main-spacing: 3rem +$intro-width: 1130px =selection($current-selector: false) @if $current-selector diff --git a/docs/css/bulma-docs.css b/docs/css/bulma-docs.css index cc554e99..8c66779b 100644 --- a/docs/css/bulma-docs.css +++ b/docs/css/bulma-docs.css @@ -10091,7 +10091,7 @@ svg { .bd-focus { margin: 6rem auto 0; - max-width: 1080px; + max-width: 1130px; } .bd-focus-item .subtitle { @@ -10324,14 +10324,6 @@ svg { opacity: 1; } -.intro-partners { - margin-top: 6rem; -} - -.intro-carbon { - margin-top: 0.5rem; -} - @media screen and (max-width: 768px) { .intro-buttons .button { display: flex; @@ -12164,36 +12156,59 @@ html.route-index .hero.is-primary a.column:hover .title strong { width: 150px; } -.bd-sponsor { - margin-left: auto; - margin-right: auto; - text-align: center; -} - -.bd-sponsor-title { - font-size: 0.75rem; - margin-bottom: 1em; - opacity: 0.5; -} - -.bd-sponsor-list { +.bd-partner-sponsors { align-items: center; display: flex; flex-wrap: wrap; - justify-content: center; + justify-content: space-between; + margin-bottom: -1rem; } -.bd-sponsor-list a { +.bd-partner-sponsors a { align-items: center; display: flex; justify-content: center; - margin: 1rem; - width: 160px; + margin: 0 1rem 1rem 0; + min-height: 100px; } -.bd-sponsor-list a img { - max-height: 60px; - width: auto; +.bd-partners { + background-color: #fafafa; +} + +.bd-partners .container { + max-width: 1130px; +} + +.bd-partners #carbonads .carbon-text { + padding-bottom: 0; +} + +.bd-partners #carbonads .carbon-poweredby { + display: none; +} + +.bd-partner-title { + color: #b5b5b5; + font-size: 0.875rem; + margin-bottom: 1rem; +} + +@media screen and (min-width: 769px), print { + .bd-partners-list { + align-items: flex-start; + display: flex; + } + .bd-partner.bd-is-sponsor { + flex-grow: 1; + flex-shrink: 1; + } + .bd-partner.bd-is-carbon { + flex-grow: 0; + flex-shrink: 0; + margin-left: 6rem; + width: 300px; + } } @keyframes fadeIn { diff --git a/docs/index.html b/docs/index.html index 0b965faf..271e0532 100644 --- a/docs/index.html +++ b/docs/index.html @@ -6,8 +6,9 @@ fixed_navbar: true {% include global/navbar.html id="Index" %} {% include index/intro.html %} -{% include index/tws.html %} +{% include index/sponsor.html %} {% include index/columns.html %} +{% include index/tws.html %} {% include index/level.html %} {% include index/media-object.html %}