X-Git-Url: https://git-public.kairo.at/?p=themes.git;a=blobdiff_plain;f=LCARStrek%2Fbrowser%2Fnewtab%2FnewTab.css;h=1e42d934d7a2077d0ab9cb84150649b2c76a35d2;hp=2227367efa32098fd3612bef4e4749867e800656;hb=d4d77dc0d0de5595725731c8113e5937c9bc1fea;hpb=0d686391fa6b72dbbe596b569e595f729dced27c diff --git a/LCARStrek/browser/newtab/newTab.css b/LCARStrek/browser/newtab/newTab.css index 2227367e..1e42d934 100644 --- a/LCARStrek/browser/newtab/newTab.css +++ b/LCARStrek/browser/newtab/newTab.css @@ -1,148 +1,218 @@ -#scrollbox { - padding-bottom: 18px; +/* This Source Code Form is subject to the terms of the Mozilla Public + * 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/. */ + +:root { + -moz-appearance: none; + font-size: 75%; + background-color: transparent; + padding: 0; +} + +/* SCROLLBOX */ +#newtab-scrollbox:not([page-disabled]) { + color: #FF9F00; background-color: #000000; } -#body { - padding-top: 106px; - font-family: "Liberation Sans",Arial,Tahoma,Helvetica,sans-serif; +#newtab-scrollbox:not([page-disabled]) #newtab-margin-bottom { + background: inherit; +} + +/* UNDO */ +#newtab-undo-container { + padding: 4px 3px; + border: 1px solid; + border-color: #9C9CFF; + background-color: #000000; + color: #8050B0; } -.button { +#newtab-undo-label { + margin-top: 0; + margin-bottom: 0; +} + +.newtab-undo-button { + color: #3333FF; + cursor: pointer; padding: 0; - border: 0 none; + margin: 0 4px; + border: 0; + background: transparent; + text-decoration: none; + min-width: 0; +} + +.newtab-undo-button:hover { + text-decoration: underline; } -/* TOOLBAR */ -#toolbar { - top: 8px; - right: 8px; - width: 13px; - height: 30px; +.newtab-undo-button:-moz-focusring { + outline: 1px dotted; +} + +.newtab-undo-button > .button-box { padding: 0; - margin: 0; } -.toolbar-button { - background: transparent url("chrome://browser/skin/newtab/toolbar.png"); +#newtab-undo-close-button { + padding: 0; + border: none; + list-style-image: url("chrome://global/skin/icons/close.png"); + -moz-image-region: rect(0, 16px, 16px, 0); } -#toolbar-button-show { - width: 11px; - height: 11px; - background-position: -10px 0; +#newtab-undo-close-button:hover { + -moz-image-region: rect(0, 32px, 16px, 16px); } -#toolbar-button-show:hover { - background-position: -10px -12px; +#newtab-undo-close-button:-moz-focusring { + outline: 1px dotted; } -#toolbar-button-show:active { - background-position: -10px -24px; +/* CUSTOMIZE */ +#newtab-customize-button, +.newtab-customize { + background-color: transparent; + background-image: -moz-image-rect(url("chrome://browser/skin/newtab/controls.svg"), 0, 32, 32, 0); + background-size: 28px; + border: none; + border-radius: 3px; + height: 28px; + width: 28px; } -#toolbar-button-hide { - width: 10px; - height: 10px; +#newtab-customize-button:-moz-any(:hover, :active, [active]) { + background-image: -moz-image-rect(url("chrome://browser/skin/newtab/controls.svg"), 0, 64, 32, 32); + background-color: #FFCF00; } -#toolbar-button-hide:hover { - background-position: 0 -12px; +/* CELLS */ +.newtab-cell { + background-color: rgba(255,159,0,.2); + border: 1px solid; + border-color: #9C9CFF; + border-radius: 1px; } -#toolbar-button-hide:active { - background-position: 0 -24px; +.newtab-cell:empty { + outline: 2px dashed #A09090; + -moz-outline-radius: 2px; } -#toolbar-button-reset { - top: 17px; - width: 11px; - height: 12px; +/* SITES */ +.newtab-site { + border-radius: inherit; + text-decoration: none; + transition-property: top, left, opacity, box-shadow, background-color; } -#toolbar-button-reset { - background-position: -21px 0; +.newtab-cell:not([ignorehover]) > .newtab-site:hover, +.newtab-site[dragged] { + box-shadow: 0 0 10px rgba(0,132,132,.3); } -#toolbar-button-reset:hover { - background-position: -21px -12px; +.newtab-site[dragged] { + transition-property: box-shadow, background-color; + background-color: #002121; } -#toolbar-button-reset:active { - background-position: -21px -24px; +/* LINKS */ +.newtab-link { + border-radius: 3px; } -/* GRID */ -#grid { - padding: 1px; - margin: 0 auto; +/* THUMBNAILS */ +.newtab-thumbnail { + background-origin: padding-box; + background-clip: padding-box; + background-repeat: no-repeat; + background-size: cover; + transition: opacity 100ms ease-out; } -/* CELLS */ -.cell { - outline: 1px dashed #9C9CFF; - outline-offset: -1px; +.newtab-site:hover .newtab-thumbnail.enhanced-content { + opacity: 0; } -/* SITES */ -.site { - background-color: #402800; - -moz-transition: 200ms ease-out; - -moz-transition-property: top, left, box-shadow, opacity; +.newtab-site[type=affiliate] .newtab-thumbnail, +.newtab-site[type=enhanced] .newtab-thumbnail, +.newtab-site[type=organic] .newtab-thumbnail, +.newtab-site[type=sponsored] .newtab-thumbnail { + background-position: center center; + background-size: auto; } -.site[dragged] { - -moz-transition-property: box-shadow; +/* TITLES */ +.newtab-sponsored, +.newtab-title { + padding: 0 8px; + background-color: rgba(255,159,0,.8); + color: #000000; + line-height: 24px; + bottom: 0 !important; } -.site[ontop] { - box-shadow: 0 1px 4px #008484; - outline: none; +.newtab-site[type=sponsored] .newtab-title { + -moz-padding-end: 24px; } -/* SITE TITLE */ -.site-title { - height: 2.4em; - width: 189px; - padding: 0 6px; - background-color: rgba(0,0,0,0.5); - border: solid transparent; - border-width: 6px 0; - color: #FFCF00; - text-decoration: none; - line-height: 1.2em; - font-weight: 700; +.newtab-site:hover .newtab-title { + background-color: #FFCF00; } -/* SITE STRIP */ -.site-strip { - padding: 4px 3px; - background-color: rgba(0,0,0,0.5); +.newtab-site[pinned] .newtab-title { + padding: 0 15px; } -.strip-button { - width: 17px; +.newtab-site[pinned] .newtab-title::before { + background-image: -moz-image-rect(url("chrome://browser/skin/newtab/controls.svg"), 7, 278, 28, 266); + background-size: 10px; + content: ""; height: 17px; - background: transparent url("chrome://browser/skin/newtab/strip.png"); + left: 0; + position: absolute; + width: 10px; +} + +.newtab-site[pinned] .newtab-title:-moz-locale-dir(rtl)::before { + left: auto; + right: 0; +} + +/* CONTROLS */ +.newtab-control { + background-color: transparent; + background-size: 24px; + border: none; + height: 24px; + width: 24px; +} + +.newtab-control-pin, +.newtab-site[pinned] .newtab-control-pin:hover:active { + background-image: -moz-image-rect(url("chrome://browser/skin/newtab/controls.svg"), 0, 96, 32, 64); } -.strip-button-pin:hover { - background-position: 0 -17px; +.newtab-control-pin:hover, +.newtab-site[pinned] .newtab-control-pin:hover { + background-image: -moz-image-rect(url("chrome://browser/skin/newtab/controls.svg"), 0, 128, 32, 96); } -.strip-button-pin:active, -.site[pinned] .strip-button-pin { - background-position: 0 -34px; +.newtab-control-pin:hover:active, +.newtab-site[pinned] .newtab-control-pin { + background-image: -moz-image-rect(url("chrome://browser/skin/newtab/controls.svg"), 0, 160, 32, 128); } -.strip-button-block { - background-position: -17px 0; +.newtab-control-block { + background-image: -moz-image-rect(url("chrome://browser/skin/newtab/controls.svg"), 0, 192, 32, 160); } -.strip-button-block:hover { - background-position: -17px -17px; +.newtab-control-block:hover { + background-image: -moz-image-rect(url("chrome://browser/skin/newtab/controls.svg"), 0, 224, 32, 192); } -.strip-button-block:active { - background-position: -17px -34px; +.newtab-control-block:hover:active { + background-image: -moz-image-rect(url("chrome://browser/skin/newtab/controls.svg"), 0, 256, 32, 224); }