X-Git-Url: https://git-public.kairo.at/?p=themes.git;a=blobdiff_plain;f=LCARStrek%2Fbrowser%2Fpreferences%2Fin-content%2Fpreferences.css;h=2b6abadf83199529cee87c6971823ab5393f572c;hp=948d9a7ba63a8ed7641102950d4a1c2d9cb5e59a;hb=1b1f3d099d79ff3f7e081b2702a1076c6cd627c4;hpb=368d0b7ff30fae6bb74e895e6fb8d1a182a1cb1c diff --git a/LCARStrek/browser/preferences/in-content/preferences.css b/LCARStrek/browser/preferences/in-content/preferences.css index 948d9a7b..2b6abadf 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; } @@ -41,139 +40,131 @@ treecol { /* override the * rule */ -moz-user-select: none; } - -/* Category List */ - -#categories { - background-color: #A09090; - padding-top: 4em; - margin: 0; - border-radius: 1em 0 0 0; - border: none; +/* +#engineList treechildren::-moz-tree-image(engineShown, checked), +#blocklistsTree treechildren::-moz-tree-image(selectionCol, checked) { + list-style-image: url("chrome://global/skin/in-content/check.svg#check"); + width: 21px; + height: 21px; } -.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; +#engineList treechildren::-moz-tree-image(engineShown, checked, selected), +#blocklistsTree treechildren::-moz-tree-image(selectionCol, checked, selected) { + list-style-image: url("chrome://global/skin/in-content/check.svg#check-inverted"); } -.category:hover { - background-color: #FFCF00; - color: #000000; +#engineList treechildren::-moz-tree-row, +#blocklistsTree treechildren::-moz-tree-row { + min-height: 36px; } - -.category[selected] { - background-color: #008484; - color: #000000; +*/ +#selectionCol { + min-width: 26px; } -#categories[keyboard-navigation="true"]:-moz-focusring > .category[current] { - border-top: 1px dotted #000000; - border-bottom: 1px dotted #000000; +.learnMore { + margin-inline-start: 10px; + font-weight: normal; + white-space: nowrap; } -.category-name { - line-height: 22px; - font-size: 1.25rem; - padding-bottom: 2px; - -moz-padding-start: 9px; - margin: 0; +.accessory-button { + min-width: 145px; } -.category-icon { - width: 24px; - height: 24px; - list-style-image: url("chrome://browser/skin/preferences/in-content/icons.png"); -} - -#category-general > .category-icon { - -moz-image-region: rect(0, 24px, 24px, 0); -} +/* Category List */ -#category-general:hover > .category-icon, -#category-general[selected] > .category-icon { - -moz-image-region: rect(24px, 24px, 48px, 0); +#categories { + max-height: 100vh; } -#category-search > .category-icon { - -moz-image-region: rect(0, 192px, 24px, 168px); +#categories > scrollbox { + overflow-x: hidden !important; } -#category-search:hover > .category-icon, -#category-search[selected] > .category-icon { - -moz-image-region: rect(24px, 192px, 48px, 168px); +/** + * 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-content > .category-icon { - -moz-image-region: rect(0, 48px, 24px, 24px) +#category-general > .category-icon { + list-style-image: url("chrome://browser/skin/preferences/in-content/icons.svg#general"); } -#category-content:hover > .category-icon, -#category-content[selected] > .category-icon { - -moz-image-region: rect(24px, 48px, 48px, 24px); +#category-general:hover > .category-icon, +#category-general[selected] > .category-icon { + list-style-image: url("chrome://browser/skin/preferences/in-content/icons.svg#general-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#content"); } #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#content-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#security"); } #category-privacy:hover > .category-icon, #category-privacy[selected] > .category-icon { - -moz-image-region: rect(24px, 96px, 48px, 72px); -} - -#category-security > .category-icon { - -moz-image-region: rect(0, 120px, 24px, 96px) -} - -#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"); +} + +#category-search-results > .category-icon { + list-style-image: url("chrome://browser/skin/preferences/in-content/icons.svg#searchResults"); +} + +#category-search-results > .category-icon { + list-style-image: url("chrome://browser/skin/preferences/in-content/icons.svg#searchResults-active"); } @media (max-width: 800px) { .category-name { display: none; } + .help-button { + font-size: 0 !important; + } } + /* header */ -#header-advanced { - border-bottom: none; - padding-bottom: 0; +.header { + display: flex; + align-items: center; + justify-content: space-between; +} + +.header[hidden=true] { + display: none; } .indent { @@ -183,9 +174,46 @@ 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; + margin-inline-end: 8px !important; } #getStarted { @@ -196,21 +224,20 @@ treecol { font-weight: bold; } -/* Content pane */ -#playDRMContentLink { - /* Line up with the buttons in the other grid bits: */ - margin-left: 4px !important; - margin-right: 4px !important; +#browserHomePage:-moz-locale-dir(rtl) input { + unicode-bidi: plaintext; + direction: rtl; } -/* Applications Pane Styles */ - -#applicationsContent { - padding: 15px 0; +#defaultFontSizeLabel { + /* !important needed to override common !important rule */ + margin-inline-start: 4px !important; } +/* Applications Pane Styles */ + #filter { - -moz-margin-start: 0; + margin-inline-start: 0; } #handlersView { @@ -222,13 +249,13 @@ treecol { } .typeIcon { - -moz-margin-start: 10px !important; - -moz-margin-end: 9px !important; + margin-inline-start: 10px !important; + margin-inline-end: 9px !important; } .actionIcon { - -moz-margin-start: 11px !important; - -moz-margin-end: 8px !important; + margin-inline-start: 11px !important; + margin-inline-end: 8px !important; } .actionsMenu { @@ -236,11 +263,49 @@ treecol { } .actionsMenu > menupopup > menuitem { - -moz-padding-start: 10px !important; + padding-inline-start: 10px !important; } .actionsMenu > menupopup > menuitem > .menu-iconic-left { - -moz-margin-end: 8px !important; + margin-inline-end: 8px !important; +} + +/* Privacy pane */ + +.doNotTrackLearnMore { + margin-inline-start: calc(1em + 30px); + margin-bottom: 1em; + font-weight: normal; +} + +.doNotTrackLearnMore > label { + font-size: 1em !important; + margin-left: 0; +} + +/* This learn-more link is inserted at the end of a + xul:description element so it should behave like normal text. */ +#trackingProtectionLearnMore { + white-space: normal; + margin-inline-start: 0; +} + +#trackingProtectionAdvancedSettings { + margin-inline-start: 15px; +} + +#crashReporterGroup { + margin-top: 0; +} + +/* 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"]) > #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 @@ -250,9 +315,7 @@ description > html|a { } #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; } #weavePrefsDeck > vbox > label, @@ -260,10 +323,10 @@ 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 { - /* no margin-start for elements at the begin of a line */ - -moz-margin-start: 0; +#weavePrefsDeck > #hasFxaAccount > vbox > label, +#weavePrefsDeck > #hasFxaAccount > hbox:not(#tosPP-normal) > label { + /* no margin-inline-start for elements at the begin of a line */ + margin-inline-start: 0; } #advancedPrefs { @@ -271,31 +334,25 @@ description > html|a { } #tabsElement { -/* -moz-margin-end: 4px; / add the 4px end-margin of other elements */ +/* margin-inline-end: 4px; / add the 4px end-margin of other elements */ } -#encryptionPanel { - margin-top: 15px; +.indent { + /* !important needed to override margin-inline-start:0 !important; rule + define in common.css for labels - but not in LCARStrek*/ + margin-inline-start: 33px /*!important*/; } - -#telemetryLearnMore, -#FHRLearnMore, -#crashReporterLearnMore { - /* center the links */ - margin-top: 8px; - margin-bottom: 8px; + +.text-link { + margin-bottom: 0; } -#trackingProtectionImage { - width: 16px; - height: 16px; - list-style-image: url("chrome://browser/skin/bad-content-blocked-16.png"); +#showUpdateHistory { + margin-inline-start: 0; } -@media (min-resolution: 2dppx) { - #trackingProtectionImage { - list-style-image: url("chrome://browser/skin/bad-content-blocked-16@2x.png"); - } +#fxaProfileImage { + -moz-user-focus: normal; } /** @@ -328,23 +385,25 @@ description > html|a { } #dialogBox > .groupbox-title { - -moz-margin-start: 0; - -moz-margin-end: 0; + margin-inline-start: 0; + margin-inline-end: 0; /* padding: 3.5px 0; background-color: #F1F1F1; */ } #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 { @@ -361,126 +420,326 @@ description > html|a { #dialogFrame { -moz-box-flex: 1; /* Default dialog dimensions */ - height: 20em; width: 66ch; } +.largeDialogContainer.doScroll { + overflow-y: auto; + -moz-box-flex: 1; +} + /** * End Dialog */ /** - * Sync migration + * Font dialog menulist fixes */ -#sync-migrate-upgrade-description { - /* description elts need a min-width to wrap correctly - bug 630864? */ - min-width: 100px + +#defaultFontType, +#serif, +#sans-serif, +#monospace { + min-width: 30ch; } -#sync-migration { - border: 1px solid #9C9CFF; - background-color: #000000; - color: #A09090; - text-shadow: none; - margin: 5px 0 0 0; - animation: fadein 3000ms; +/** + * Sync + */ + +#fxaProfileImage { + max-width: 60px; + border-radius: 50%; + list-style-image: url(chrome://browser/skin/fxa/default-avatar.svg); + margin-inline-end: 15px; + image-rendering: -moz-crisp-edges; } -@keyframes fadein { - from { opacity: 0; } - to { opacity: 1; } +#fxaLoginStatus[hasName] #fxaProfileImage { + max-width: 80px; } -/* === END shared/in-content/preferences.css === */ +#fxaProfileImage.actionable { + cursor: pointer; +} -caption { +#fxaProfileImage.actionable:hover { + box-shadow: 0px 0px 0px 1px #FFCF00; } -.indent-small { - -moz-margin-start: 10px; +#fxaProfileImage.actionable:hover:active { + box-shadow: 0px 0px 0px 1px #FF9F00; } -@media (min-resolution: 2dppx) { - checkbox:hover::before, - checkbox[checked]::before { - } +#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; +} - checkbox[checked]::before { - } +#fxaContentWrapper { + -moz-box-flex: 1; +} - .category-icon { - list-style-image: url("chrome://browser/skin/preferences/in-content/icons@2x.png"); - } +#noFxaGroup { + -moz-box-flex: 1; + margin: 0; +} - #category-general > .category-icon { - -moz-image-region: rect(0, 48px, 48px, 0); - } +#fxaContentWrapper { + padding-right: 15px; +} - #category-general:hover > .category-icon, - #category-general[selected] > .category-icon { - -moz-image-region: rect(48px, 48px, 96px, 0); - } +#noFxaGroup > vbox, +#fxaGroup { + -moz-box-align: start; +} - #category-search > .category-icon { - -moz-image-region: rect(0, 384px, 48px, 336px); - } +#fxaSyncEngines > vbox:first-child { + margin-right: 80px; +} - #category-search:hover > .category-icon, - #category-search[selected] > .category-icon { - -moz-image-region: rect(48, 384px, 96px, 336px); - } +#fxaSyncComputerName { + margin-inline-start: 0px; + -moz-box-flex: 1; +} - #category-content > .category-icon { - -moz-image-region: rect(0, 96px, 48px, 48px); - } +#tosPP-small-ToS { + margin-bottom: 1em; +} - #category-content:hover > .category-icon, - #category-content[selected] > .category-icon { - -moz-image-region: rect(48px, 96px, 96px, 48px); - } +#fxaLoginRejectedWarning { + list-style-image: url("chrome://browser/skin/warning.svg"); + margin: 4px 8px 0px 0px; +} - #category-application > .category-icon { - -moz-image-region: rect(0, 144px, 48px, 96px); - } +#noFxaCaption { + font-weight: bold; + margin-bottom: 11px; +} - #category-application:hover > .category-icon, - #category-application[selected] > .category-icon { - -moz-image-region: rect(48px, 144px, 96px, 96px); - } +#verifiedManage:visited { + color: var(--in-content-link-color); +} - #category-privacy > .category-icon { - -moz-image-region: rect(0, 192px, 48px, 144px); - } +.fxaSyncIllustration { + margin-top: 35px; + width: 231px; + -moz-context-properties: fill; + fill: #9C9CFF; +} - #category-privacy:hover > .category-icon, - #category-privacy[selected] > .category-icon { - -moz-image-region: rect(48px, 192px, 96px, 144px); - } +#syncOptions caption { + margin-bottom: 11px; +} - #category-security > .category-icon { - -moz-image-region: rect(0, 240px, 48px, 192px); - } +#fxaSyncComputerName { + margin-left: 0px; +} - #category-security:hover > .category-icon, - #category-security[selected] > .category-icon { - -moz-image-region: rect(48px, 240px, 96px, 192px); - } +#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; + display: flex; + align-items: center; +} + +.fxaAccountBoxButtons > * { + -moz-box-flex: 1; +} - #category-sync > .category-icon { - -moz-image-region: rect(0, 288px, 48px, 240px); +.fxaAccountBoxButtons > button { + text-align: center; + padding-left: 11px; + padding-right: 11px; + margin: 0; + min-width: 0; +} + +.fxaAccountBoxButtons > button:first-child { + margin-inline-end: 14px !important; +} + +#fxaLoginStatus[hasName] #fxaEmailAddress1 { + font-size: 1.1rem; +} + +#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: 20px; + margin-top: 25px; +} + +#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; +} + +#syncOptions { + margin-bottom: 27.5px; +} + +.androidLink { + background-image: url("chrome://browser/skin/fxa/android.png"); +} + +.iOSLink { + background-image: url("chrome://browser/skin/fxa/ios.png"); +} + +.androidLink, +.iOSLink { + margin: 0 0 0 2px; + padding-left: 28px; + padding-top: 6px; + height: 28px; + background-repeat: no-repeat; + background-size: 24px 28px; +} + +#tosPP-small { + margin-top: 20px; + margin-bottom: 20px; +} + +@media (min-resolution: 1.1dppx) { + .androidLink { + background-image: url("chrome://browser/skin/fxa/android@2x.png"); + } + .iOSLink { + background-image: url("chrome://browser/skin/fxa/ios@2x.png"); + } + .fxaFirefoxLogo { + list-style-image: url(chrome://browser/skin/fxa/logo@2x.png); } +} + +#updateDeck > hbox > label { + margin-inline-end: 5px ! important; +} + +.update-throbber { + width: 16px; + min-height: 16px; + margin-inline-end: 3px; + list-style-image: url("chrome://global/skin/icons/loading.png"); +} - #category-sync:hover > .category-icon, - #category-sync[selected] > .category-icon { - -moz-image-region: rect(48px, 288px, 96px, 240px); +@media (min-resolution: 1.1dppx) { + .update-throbber { + list-style-image: url("chrome://global/skin/icons/loading@2x.png"); } +} + +.help-button { + position: fixed; + left: 3px; + /* Needs to have enough gap from the bottom to not + get behind the status panel (bug 1357841). */ + bottom: 2rem; + font-size: 13px; + line-height: 13px; + height: 14px; + background-position: 5px; + padding-inline-start: 25px; + white-space: nowrap; + background-color: var(--in-content-category-background); + width: auto; + padding-inline-end: 10px; + border: 3px solid black; + border-radius: 0 300px 300px 0; +} + +.help-button:-moz-locale-dir(rtl) { + left: auto; + right: 0; + background-position: right 15px top 0; +} + +.help-button:link, +.help-button:visited { + color: var(--in-content-category-text); + text-decoration: none; +} + +.help-button:hover { + background-image: url("chrome://global/skin/in-content/help-glyph.svg#help-inverted"); + color: var(--in-content-category-text-selected); + background-color: var(--in-content-category-background-hover); + border-color: var(--in-content-category-background-hover); +} +.help-button { + position: fixed; + left: 0; + + /* Needs to have enough gap from the bottom to not + get behind the status panel (bug 1357841). */ + bottom: 2rem; + font-size: 13px; + line-height: 13px; + height: 14px; + background-position: 15px; + padding-inline-start: 35px; + white-space: nowrap; +} + +.help-button:-moz-locale-dir(rtl) { + left: auto; + right: 0; + background-position: right 15px top 0; +} - #category-advanced > .category-icon { - -moz-image-region: rect(0, 336px, 48px, 288px); +.help-button:link, +.help-button:visited { + color: var(--in-content-category-text); + text-decoration: none; +} + +/* === END shared/incontentprefs/preferences.inc.css === */ + +caption { +} + +.indent-small { + margin-inline-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 { } }