X-Git-Url: https://git-public.kairo.at/?p=themes.git;a=blobdiff_plain;f=LCARStrek%2Fbrowser%2Fpreferences%2Fin-content%2Fpreferences.css;h=14169fc57402e3150ebe15d538203c6cc8169c45;hp=948d9a7ba63a8ed7641102950d4a1c2d9cb5e59a;hb=13875a54c4ffb8d452d1dc3745fdbab3f906da8f;hpb=368d0b7ff30fae6bb74e895e6fb8d1a182a1cb1c diff --git a/LCARStrek/browser/preferences/in-content/preferences.css b/LCARStrek/browser/preferences/in-content/preferences.css index 948d9a7b..14169fc5 100644 --- a/LCARStrek/browser/preferences/in-content/preferences.css +++ b/LCARStrek/browser/preferences/in-content/preferences.css @@ -2,7 +2,7 @@ - License, v. 2.0. If a copy of the MPL was not distributed with this file, - You can obtain one at http://mozilla.org/MPL/2.0/. */ -/* === BEGIN shared/in-content/preferences.css === */ +/* === BEGIN shared/incontentprefs/preferences.inc.css === */ @namespace html "http://www.w3.org/1999/xhtml"; @@ -28,7 +28,6 @@ max-width: 800px; font: 11px "Liberation Sans",Arial,Tahoma,Helvetica,sans-serif; font-size: 1.25rem; - line-height: 22px; color: #FF9F00; } @@ -45,122 +44,93 @@ treecol { /* Category List */ #categories { - background-color: #A09090; - padding-top: 4em; - margin: 0; - border-radius: 1em 0 0 0; - border: none; -} - -.category { - background-color: #000000; - color: #FFCF00; - -moz-border-end-width: 0; - -moz-padding-start: 15px; - -moz-padding-end: 21px; - min-height: 40px; - transition: background-color 150ms; -} - -.category:hover { - background-color: #FFCF00; - color: #000000; -} - -.category[selected] { - background-color: #008484; - color: #000000; -} - -#categories[keyboard-navigation="true"]:-moz-focusring > .category[current] { - border-top: 1px dotted #000000; - border-bottom: 1px dotted #000000; + max-height: 100vh; } -.category-name { - line-height: 22px; - font-size: 1.25rem; - padding-bottom: 2px; - -moz-padding-start: 9px; - margin: 0; +#categories > scrollbox { + overflow-x: hidden !important; } -.category-icon { - width: 24px; - height: 24px; - list-style-image: url("chrome://browser/skin/preferences/in-content/icons.png"); +/** + * We want the last category to always have non-0 getBoundingClientRect().bottom + * so we can use the value to figure out the max-height of the list in + * preferences.js, so use collapse instead of display: none; if it's hidden + */ +#categories > .category[hidden="true"] { + display: -moz-box; + visibility: collapse; } #category-general > .category-icon { - -moz-image-region: rect(0, 24px, 24px, 0); + list-style-image: url("chrome://browser/skin/preferences/in-content/icons.svg#general"); } #category-general:hover > .category-icon, #category-general[selected] > .category-icon { - -moz-image-region: rect(24px, 24px, 48px, 0); + list-style-image: url("chrome://browser/skin/preferences/in-content/icons.svg#general-active"); } #category-search > .category-icon { - -moz-image-region: rect(0, 192px, 24px, 168px); + list-style-image: url("chrome://browser/skin/preferences/in-content/icons.svg#search"); } #category-search:hover > .category-icon, #category-search[selected] > .category-icon { - -moz-image-region: rect(24px, 192px, 48px, 168px); + list-style-image: url("chrome://browser/skin/preferences/in-content/icons.svg#search-active"); } #category-content > .category-icon { - -moz-image-region: rect(0, 48px, 24px, 24px) + list-style-image: url("chrome://browser/skin/preferences/in-content/icons.svg#content"); } #category-content:hover > .category-icon, #category-content[selected] > .category-icon { - -moz-image-region: rect(24px, 48px, 48px, 24px); + list-style-image: url("chrome://browser/skin/preferences/in-content/icons.svg#content-active"); } #category-application > .category-icon { - -moz-image-region: rect(0, 72px, 24px, 48px) + list-style-image: url("chrome://browser/skin/preferences/in-content/icons.svg#applications"); } #category-application:hover > .category-icon, #category-application[selected] > .category-icon { - -moz-image-region: rect(24px, 72px, 48px, 48px); + list-style-image: url("chrome://browser/skin/preferences/in-content/icons.svg#applications-active"); } #category-privacy > .category-icon { - -moz-image-region: rect(0, 96px, 24px, 72px) + list-style-image: url("chrome://browser/skin/preferences/in-content/icons.svg#privacy"); } #category-privacy:hover > .category-icon, #category-privacy[selected] > .category-icon { - -moz-image-region: rect(24px, 96px, 48px, 72px); + list-style-image: url("chrome://browser/skin/preferences/in-content/icons.svg#privacy-active"); } #category-security > .category-icon { - -moz-image-region: rect(0, 120px, 24px, 96px) + list-style-image: url("chrome://browser/skin/preferences/in-content/icons.svg#security"); } #category-security:hover > .category-icon, #category-security[selected] > .category-icon { - -moz-image-region: rect(24px, 120px, 48px, 96px); + list-style-image: url("chrome://browser/skin/preferences/in-content/icons.svg#security-active"); } #category-sync > .category-icon { - -moz-image-region: rect(0, 144px, 24px, 120px); + list-style-image: url("chrome://browser/skin/preferences/in-content/icons.svg#sync"); } #category-sync:hover > .category-icon, #category-sync[selected] > .category-icon { - -moz-image-region: rect(24px, 144px, 48px, 120px); + list-style-image: url("chrome://browser/skin/preferences/in-content/icons.svg#sync-active"); } #category-advanced > .category-icon { - -moz-image-region: rect(0, 168px, 24px, 144px) + list-style-image: url("chrome://browser/skin/preferences/in-content/icons.svg#advanced"); } #category-advanced:hover > .category-icon, #category-advanced[selected] > .category-icon { - -moz-image-region: rect(24px, 168px, 48px, 144px); + list-style-image: url("chrome://browser/skin/preferences/in-content/icons.svg#advanced-active"); } @media (max-width: 800px) { @@ -183,6 +153,43 @@ treecol { /* General Pane */ +#startupTable { + border-collapse: collapse; +} + +#startupTable > tr > td { + padding: 0; /* remove the padding from html.css */ +} + +#startupTable > tr:not(:first-child) > td { + padding-top: 0.5em; /* add a spacing between the rows */ +} + +#startupTable > tr > .label-cell { + text-align: end; + width: 0; /* make the column as small as possible */ +} + +#startupTable > tr > .label-cell > label { + white-space: nowrap; +} + +#startupTable > tr > .content-cell > menulist, +#startupTable > tr > .content-cell > textbox { + width: calc(100% - 8px); + margin-left: 4px; + margin-right: 4px; +} + +#startupTable > tr > .homepage-buttons { + display: flex; + flex-wrap: wrap; +} + +#startupTable > tr > .homepage-buttons > .content-cell-item { + flex-grow: 1; +} + #useFirefoxSync { font-size: 90%; -moz-margin-end: 8px !important; @@ -203,6 +210,11 @@ treecol { margin-right: 4px !important; } +#defaultFontSizeLabel { + /* !important needed to override common !important rule */ + -moz-margin-start: 4px !important; +} + /* Applications Pane Styles */ #applicationsContent { @@ -243,6 +255,19 @@ treecol { -moz-margin-end: 8px !important; } +/* Collapse the non-active vboxes in decks to use only the height the + active vbox needs */ +#historyPane:not([selectedIndex="1"]) > #historyDontRememberPane, +#historyPane:not([selectedIndex="2"]) > #historyCustomPane, +#weavePrefsDeck:not([selectedIndex="1"]) > #hasAccount, +#weavePrefsDeck:not([selectedIndex="2"]) > #needsUpdate, +#weavePrefsDeck:not([selectedIndex="3"]) > #noFxaAccount, +#weavePrefsDeck:not([selectedIndex="4"]) > #hasFxaAccount, +#fxaLoginStatus:not([selectedIndex="1"]) > #fxaLoginUnverified, +#fxaLoginStatus:not([selectedIndex="2"]) > #fxaLoginRejected { + visibility: collapse; +} + /* XXX This style is for bug 740213 and should be removed once that bug has a solution. */ description > html|a { @@ -260,8 +285,8 @@ description > html|a { #weavePrefsDeck > vbox > description, #weavePrefsDeck > vbox > #pairDevice > label, #weavePrefsDeck > #needsUpdate > hbox > #loginError, -#weavePrefsDeck > #hasFxaAccount > hbox:not(#tosPP-normal) > label, -#weavePrefsDeck > #hasFxaAccount > hbox:not(#tosPP-small) > label { +#weavePrefsDeck > #hasFxaAccount > vbox > label, +#weavePrefsDeck > #hasFxaAccount > hbox:not(#tosPP-normal) > label { /* no margin-start for elements at the begin of a line */ -moz-margin-start: 0; } @@ -274,13 +299,12 @@ description > html|a { /* -moz-margin-end: 4px; / add the 4px end-margin of other elements */ } -#encryptionPanel { - margin-top: 15px; -} - #telemetryLearnMore, #FHRLearnMore, #crashReporterLearnMore { + /* provide some margin between the links and the label text */ + /* !important is needed to override the rules defined in common.css */ + -moz-margin-start: 20px !important; /* center the links */ margin-top: 8px; margin-bottom: 8px; @@ -298,6 +322,10 @@ description > html|a { } } +#showUpdateHistory { + -moz-margin-start: 0; +} + /** * Dialog */ @@ -336,15 +364,17 @@ description > html|a { #dialogTitle { text-align: center; + -moz-user-select: none; } .close-icon { background-color: transparent !important; border: none; box-shadow: none; - height: 18px; padding: 0; - min-width: 18px; + height: auto; + min-height: 16px; + min-width: 0; } #dialogBox > .groupbox-title > caption { @@ -365,10 +395,26 @@ description > html|a { width: 66ch; } +.largeDialogContainer.doScroll { + overflow-y: auto; + -moz-box-flex: 1; +} + /** * End Dialog */ +/** + * Font dialog menulist fixes + */ + +#defaultFontType, +#serif, +#sans-serif, +#monospace { + min-width: 30ch; +} + /** * Sync migration */ @@ -391,96 +437,243 @@ description > html|a { to { opacity: 1; } } -/* === END shared/in-content/preferences.css === */ +/** + * Sync + */ -caption { +#fxaProfileImage { + max-width: 60px; + border-radius: 50%; + list-style-image: url(chrome://browser/skin/fxa/default-avatar.png); + margin-inline-end: 15px; } -.indent-small { - -moz-margin-start: 10px; +#fxaProfileImage.actionable { + cursor: pointer; } -@media (min-resolution: 2dppx) { - checkbox:hover::before, - checkbox[checked]::before { - } +#fxaProfileImage.actionable:hover { +} - checkbox[checked]::before { - } +#fxaProfileImage.actionable:hover:active { +} - .category-icon { - list-style-image: url("chrome://browser/skin/preferences/in-content/icons@2x.png"); - } +#noFxaAccount { + /* Overriding the margins from the base preferences.css theme file. + These overrides can be simplified by fixing bug 1027174 */ + margin: 0; + padding-top: 15px; +} - #category-general > .category-icon { - -moz-image-region: rect(0, 48px, 48px, 0); - } +#fxaContentWrapper { + -moz-box-flex: 1; +} - #category-general:hover > .category-icon, - #category-general[selected] > .category-icon { - -moz-image-region: rect(48px, 48px, 96px, 0); - } +#noFxaGroup { + -moz-box-flex: 1; + margin: 0; +} - #category-search > .category-icon { - -moz-image-region: rect(0, 384px, 48px, 336px); - } +#fxaContentWrapper { + padding-right: 15px; +} - #category-search:hover > .category-icon, - #category-search[selected] > .category-icon { - -moz-image-region: rect(48, 384px, 96px, 336px); - } +#noFxaGroup > vbox, +#fxaGroup { + -moz-box-align: start; +} - #category-content > .category-icon { - -moz-image-region: rect(0, 96px, 48px, 48px); - } +#syncStatusMessage { + visibility: collapse; + opacity: 0; + transition: opacity 1s linear; + padding: 14px 8px 14px 14px; + border-radius: 2px; +} - #category-content:hover > .category-icon, - #category-content[selected] > .category-icon { - -moz-image-region: rect(48px, 96px, 96px, 48px); - } +#syncStatusMessage[message-type] { + visibility: visible; + opacity: 1; +} - #category-application > .category-icon { - -moz-image-region: rect(0, 144px, 48px, 96px); - } +#syncStatusMessage[message-type="verify-success"] { + background-color: #008484; +} - #category-application:hover > .category-icon, - #category-application[selected] > .category-icon { - -moz-image-region: rect(48px, 144px, 96px, 96px); - } +#syncStatusMessage[message-type="verify-error"] { + background-color: #FF0000; +} - #category-privacy > .category-icon { - -moz-image-region: rect(0, 192px, 48px, 144px); - } +#syncStatusMessage[message-type="migration"] { + background-color: #FF9F00; +} - #category-privacy:hover > .category-icon, - #category-privacy[selected] > .category-icon { - -moz-image-region: rect(48px, 192px, 96px, 144px); - } +#syncStatusMessageWrapper { + -moz-box-flex: 1; + padding-right: 5px; +} - #category-security > .category-icon { - -moz-image-region: rect(0, 240px, 48px, 192px); - } +#syncStatusMessageTitle, #syncStatusMessageDescription { + color: #9C9CFF; +} - #category-security:hover > .category-icon, - #category-security[selected] > .category-icon { - -moz-image-region: rect(48px, 240px, 96px, 192px); - } +#syncStatusMessage[message-type="migration"] #syncStatusMessageTitle { + display: none; +} - #category-sync > .category-icon { - -moz-image-region: rect(0, 288px, 48px, 240px); - } +#syncStatusMessageTitle { + font-weight: bold !important; + font-size: 16px; + line-height: 157%; + margin: 0 0 20px; +} + +#syncStatusMessageDescription { + font-size: 14px; + line-height: 158%; + margin: 0 !important; +} + +#syncStatusMessageClose { + margin: 0px; +} + +#fxaSyncEngines > vbox:first-child { + margin-right: 80px; +} + +#fxaSyncComputerName { + margin-inline-start: 0px; + -moz-box-flex: 1; +} + +#tosPP-small-ToS { + margin-bottom: 14px; +} + +#noFxaCaption { + font-weight: bold; + margin-bottom: 11px; +} + +.fxaSyncIllustration { + margin-top: 35px; +} + +#syncOptions caption { + margin-bottom: 11px; +} + +#fxaDeviceName { + margin-bottom: 27.5px; +} + +#noFxaDescription { + margin-bottom: 20px !important; +} + +.separator { + border-bottom: 1px solid var(--in-content-header-border-color); +} + +.fxaAccountBox { + border: 1px solid #A09090; + border-radius: 5px; + padding: 14px 20px 14px 14px; +} + +#signedOutAccountBoxTitle { + font-weight: bold; +} + +.fxaAccountBoxButtons { + margin-bottom: 0 !important; + margin-top: 11px; +} + +.fxaAccountBoxButtons > * { + -moz-box-flex: 1; +} + +.fxaAccountBoxButtons > button { + text-align: center; + padding-left: 11px; + padding-right: 11px; + margin: 0; + min-width: 0; +} + +.fxaAccountBoxButtons > button:first-child { + margin-right: 14px !important; +} + +.fxaSyncIllustration { + width: 231px; + list-style-image: url(chrome://browser/skin/fxa/sync-illustration.png) +} + +#fxaEmailAddress1, +#fxaEmailAddress2, +#fxaEmailAddress3 { + word-break: break-all; +} + +.fxaFirefoxLogo { + list-style-image: url(chrome://browser/skin/fxa/logo.png); + max-width: 64px; + margin-inline-end: 14px; +} + +.fxaMobilePromo { + margin-bottom: 31px; +} + +#fxaLoginRejectedWarning { + list-style-image: url(chrome://browser/skin/warning.svg); + filter: drop-shadow(0 1px 0 hsla(206, 50%, 10%, .15)); + margin: 4px 8px 0px 0px; +} - #category-sync:hover > .category-icon, - #category-sync[selected] > .category-icon { - -moz-image-region: rect(48px, 288px, 96px, 240px); +#syncOptions { + margin-bottom: 27.5px; +} + +.androidLink, +.iOSLink { + margin: 0; +} + +#tosPP-small { + margin-top: 20px; + margin-bottom: 20px; +} + +@media (min-resolution: 1.1dppx) { + .fxaSyncIllustration { + list-style-image: url(chrome://browser/skin/fxa/sync-illustration@2x.png) + } + .fxaFirefoxLogo { + list-style-image: url(chrome://browser/skin/fxa/logo@2x.png); + } + #fxaProfileImage { + list-style-image: url(chrome://browser/skin/fxa/default-avatar@2x.png); } +} + +/* === END shared/incontentprefs/preferences.inc.css === */ - #category-advanced > .category-icon { - -moz-image-region: rect(0, 336px, 48px, 288px); +caption { +} + +.indent-small { + -moz-margin-start: 10px; +} + +@media (min-resolution: 2dppx) { + checkbox:hover::before, + checkbox[checked]::before { } - #category-advanced:hover > .category-icon, - #category-advanced[selected] > .category-icon { - -moz-image-region: rect(48px, 336px, 96px, 288px); + checkbox[checked]::before { } }