X-Git-Url: https://git-public.kairo.at/?p=themes.git;a=blobdiff_plain;f=LCARStrek%2Fglobal%2Fin-content%2Finfo-pages.css;h=6d665f6aadd9fa4e1c13ea0c0b76f9404406bb61;hp=902b1f87f5460e9b17aba0d0c56b77f20db7bf3f;hb=d8502c35cba9a5fb5819046b73193d4954e04cad;hpb=ed351b9114c8a9d94d604e671f92cc19a2900b68 diff --git a/LCARStrek/global/in-content/info-pages.css b/LCARStrek/global/in-content/info-pages.css index 902b1f87..6d665f6a 100644 --- a/LCARStrek/global/in-content/info-pages.css +++ b/LCARStrek/global/in-content/info-pages.css @@ -3,23 +3,26 @@ * file, You can obtain one at http://mozilla.org/MPL/2.0/. */ @import url("chrome://global/skin/in-content/common.css"); + +:root { + --in-content-container-min-width: 13em; + --in-content-container-max-width: 52em; +} + /* Body and container */ body { display: flex; flex-direction: column; box-sizing: border-box; min-height: 100vh; - padding-top: 0; - padding-bottom: 0; - -moz-padding-start: calc(48px + 4.6em); - -moz-padding-end: 48px; + padding: 40px 48px; align-items: center; justify-content: center; } .container { - min-width: 13em; - max-width: 52em; + min-width: var(--in-content-container-min-width); + max-width: var(--in-content-container-max-width); } .container.restore-chosen { @@ -31,34 +34,30 @@ body { /* Typography */ .title { - background-image: url("chrome://browser/skin/aboutNetError_info.svg"); + background-image: url("chrome://global/skin/icons/info.svg"); background-position: left 0; background-repeat: no-repeat; background-size: 1.6em; - -moz-margin-start: -2.3em; - -moz-padding-start: 2.3em; - font-size: 2.5em; + margin-inline-start: -2.3em; + padding-inline-start: 2.3em; + font-size: 2.2em; } -.title:-moz-dir(rtl) { +.title:moz-locale-dir(rtl), +.title:dir(rtl) { background-position: right 0; } .title-text { - border-bottom: 1px solid #A09090; font-size: inherit; padding-bottom: 0.4em; } -@media (max-width: 675px) { - body { - padding: 0 48px; - } - +@media (max-width: 970px) { .title { background-image: none !important; - -moz-padding-start: 0; - -moz-margin-start: 0; + padding-inline-start: 0; + margin-inline-start: 0; } .title-text { @@ -69,7 +68,7 @@ body { ul, ol { margin: 0; padding: 0; - -moz-margin-start: 1em; + margin-inline-start: 1em; } ul > li, ol > li { @@ -80,17 +79,33 @@ ul { list-style: disc; } +dt { + font-weight: bold; +} + +ul.columns { + column-count: 2; + column-gap: 5em; +} + +@media (max-width: 35em) { + ul.columns { + column-count: 1; + } +} + /* Buttons */ .button-container { margin-top: 1.2em; } -.button-container > button { - min-width: 150px; +button { + padding: 0 1.5em; +/* border-radius: 0;*/ } .button-container > button:first-child { - -moz-margin-start: 0; + margin-inline-start: 0; } /* Trees */