diff options
Diffstat (limited to 'browser/base/content/newtab/newTab.css')
-rw-r--r-- | browser/base/content/newtab/newTab.css | 654 |
1 files changed, 0 insertions, 654 deletions
diff --git a/browser/base/content/newtab/newTab.css b/browser/base/content/newtab/newTab.css deleted file mode 100644 index 658ad2ed3..000000000 --- a/browser/base/content/newtab/newTab.css +++ /dev/null @@ -1,654 +0,0 @@ -/* 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/. */ - -html { - width: 100%; - height: 100%; -} - -body { - font: message-box; - width: 100%; - height: 100%; - padding: 0; - margin: 0; - background-color: #F9F9F9; - display: -moz-box; - position: relative; - -moz-box-flex: 1; - -moz-user-focus: normal; - -moz-box-orient: vertical; -} - -input { - font: message-box; - font-size: 16px; -} - -input[type=button] { - cursor: pointer; -} - -/* UNDO */ -#newtab-undo-container { - transition: opacity 100ms ease-out; - -moz-box-align: center; - -moz-box-pack: center; -} - -#newtab-undo-container[undo-disabled] { - opacity: 0; - pointer-events: none; -} - -/* CUSTOMIZE */ -#newtab-customize-button { - position: absolute; - top: 10px; - right: 20px; - z-index: 101; -} - -#newtab-customize-button:dir(rtl) { - left: 20px; - right: auto; -} - -/* MARGINS */ -#newtab-vertical-margin { - display: -moz-box; - position: relative; - -moz-box-flex: 1; - -moz-box-orient: vertical; -} - -#newtab-margin-undo-container { - display: -moz-box; - left: 6px; - position: absolute; - top: 6px; - z-index: 1; -} - -#newtab-margin-undo-container:dir(rtl) { - left: auto; - right: 6px; -} - -#newtab-undo-close-button:dir(rtl) { - float:left; -} - -#newtab-horizontal-margin { - display: -moz-box; - -moz-box-flex: 1; -} - -#newtab-margin-top, -#newtab-margin-bottom { - display: -moz-box; - position: relative; -} - -#newtab-margin-top { - -moz-box-flex: 1; -} - -#newtab-margin-bottom { - -moz-box-flex: 2; -} - -.newtab-side-margin { - min-width: 10px; - -moz-box-flex: 1; -} - -/* GRID */ -#newtab-grid { - -moz-box-flex: 5; - overflow: hidden; - text-align: center; - transition: 100ms ease-out; - transition-property: opacity; -} - -#newtab-grid[page-disabled] { - opacity: 0; -} - -#newtab-grid[locked], -#newtab-grid[page-disabled] { - pointer-events: none; -} - -body:not(.compact) #topsites-heading { - display: none; -} - -/* - * If you change the sizes here, make sure you - * change the preferences: - * toolkit.pageThumbs.minWidth - * toolkit.pageThumbs.minHeight - */ -/* CELLS */ -.newtab-cell { - display: -moz-box; - height: 210px; - margin: 20px 10px 35px; - width: 290px; -} - -body.compact .newtab-cell { - width: 110px; - height: 110px; - margin: 12px; -} - -/* SITES */ -.newtab-site { - position: relative; - -moz-box-flex: 1; - transition: 100ms ease-out; - transition-property: top, left, opacity; -} - -.newtab-site[frozen] { - position: absolute; - pointer-events: none; -} - -.newtab-site[dragged] { - transition-property: none; - z-index: 10; -} - -/* LINK + THUMBNAILS */ -.newtab-link, -.newtab-thumbnail { - position: absolute; - left: 0; - top: 0; - right: 0; - bottom: 0; -} - -/* TITLES */ -.newtab-sponsored, -.newtab-title, -.newtab-suggested { - overflow: hidden; - position: absolute; - right: 0; - text-align: center; -} - -.newtab-sponsored, -.newtab-title { - bottom: 0; - white-space: nowrap; - text-overflow: ellipsis; - vertical-align: middle; -} - -.newtab-suggested { - border: 1px solid transparent; - border-radius: 2px; - font-size: 12px; - height: 17px; - line-height: 17px; - margin-bottom: -1px; - padding: 2px 8px; - display: none; - margin-left: auto; - margin-right: auto; - left: 0; - top: 215px; - -moz-user-select: none; -} - -.newtab-suggested-bounds { - max-height: 34px; /* 34 / 17 = 2 lines maximum */ -} - -.newtab-title { - left: 0; - padding: 0 4px; -} - -.newtab-sponsored { - background-color: #FFFFFF; - border: 1px solid #E2E2E2; - border-radius: 3px; - color: #4A4A4A; - cursor: pointer; - display: none; - font-family: Arial; - font-size: 9px; - height: 17px; - left: 0; - line-height: 6px; - padding: 4px; - right: auto; - top: -15px; -} - -.newtab-site[suggested=true] > .newtab-sponsored { - background-color: #E2E2E2; - border: none; -} - -.newtab-site > .newtab-sponsored:-moz-any(:hover, [active]) { - background-color: #4A90E2; - border: 0; - color: white; -} - -.newtab-site > .newtab-sponsored[active] { - background-color: #000000; -} - -.newtab-sponsored:dir(rtl) { - right: 0; - left: auto; -} - -.newtab-site:-moz-any([type=enhanced], [type=sponsored], [suggested]) .newtab-sponsored { - display: block; -} - -.newtab-site[suggested] .newtab-suggested { - display: table; -} - -.sponsored-explain, -.sponsored-explain a, -.suggested-explain, -.suggested-explain a { - color: white; -} - -.sponsored-explain, -.suggested-explain { - background-color: rgba(51, 51, 51, 0.95); - bottom: 30px; - line-height: 20px; - padding: 15px 10px; - position: absolute; - text-align: start; -} - -.sponsored-explain input, -.suggested-explain input { - background-size: 18px; - height: 18px; - opacity: 1; - pointer-events: none; - position: static; - width: 18px; -} - -/* CONTROLS */ -.newtab-control { - position: absolute; - opacity: 0; - transition: opacity 100ms ease-out; -} - -.newtab-control:-moz-focusring, -.newtab-cell:not([ignorehover]) > .newtab-site:hover > .newtab-control { - opacity: 1; -} - -.newtab-control[dragged] { - opacity: 0 !important; -} - -@media (-moz-touch-enabled) { - .newtab-control { - opacity: 1; - } -} - -/* DRAG & DROP */ - -/* - * This is just a temporary drag element used for dataTransfer.setDragImage() - * so that we can use custom drag images and elements. It needs an opacity of - * 0.01 so that the core code detects that it's in fact a visible element. - */ -.newtab-drag { - width: 1px; - height: 1px; - background-color: #fff; - opacity: 0.01; -} - -/* SEARCH */ -#newtab-search-container { - display: -moz-box; - position: relative; - -moz-box-pack: center; - margin: 40px 0 15px; -} - -body.compact #newtab-search-container { - margin-top: 0; - margin-bottom: 80px; -} - -#newtab-search-container[page-disabled] { - opacity: 0; - pointer-events: none; -} - -#newtab-search-form { - display: -moz-box; - position: relative; - height: 36px; - -moz-box-flex: 1; - max-width: 600px; /* 2 * (290 cell width + 10 cell margin) */ -} - -#newtab-search-icon { - border: 1px transparent; - padding: 0; - margin: 0; - width: 36px; - height: 36px; - background: url("chrome://browser/skin/search-indicator-magnifying-glass.svg") center center no-repeat; - position: absolute; -} - -#newtab-search-text { - -moz-box-flex: 1; - padding-top: 6px; - padding-bottom: 6px; - padding-inline-start: 34px; - padding-inline-end: 8px; - background: hsla(0,0%,100%,.9) padding-box; - border: 1px solid; - border-spacing: 0; - border-radius: 2px 0 0 2px; - border-color: hsla(210,54%,20%,.15) hsla(210,54%,20%,.17) hsla(210,54%,20%,.2); - box-shadow: 0 1px 0 hsla(210,65%,9%,.02) inset, - 0 0 2px hsla(210,65%,9%,.1) inset, - 0 1px 0 hsla(0,0%,100%,.2); - color: inherit; - unicode-bidi: plaintext; -} - -#newtab-search-text:dir(rtl) { - border-radius: 0 2px 2px 0; -} - -#newtab-search-text[aria-expanded="true"] { - border-radius: 2px 0 0 0; -} - -#newtab-search-text[aria-expanded="true"]:dir(rtl) { - border-radius: 0 2px 0 0; -} - -#newtab-search-text[keepfocus], -#newtab-search-text:focus, -#newtab-search-text[autofocus] { - border-color: hsla(206,100%,60%,.6) hsla(206,76%,52%,.6) hsla(204,100%,40%,.6); -} - -#newtab-search-submit { - margin-inline-start: -1px; - color: transparent; - background: url("chrome://browser/skin/search-arrow-go.svg#search-arrow-go") center center no-repeat, linear-gradient(hsla(0,0%,100%,.8), hsla(0,0%,100%,.1)) padding-box; - padding: 0; - border: 1px solid; - border-color: hsla(210,54%,20%,.15) hsla(210,54%,20%,.17) hsla(210,54%,20%,.2); - border-radius: 0 2px 2px 0; - border-inline-start: 1px solid transparent; - box-shadow: 0 0 2px hsla(0,0%,100%,.5) inset, - 0 1px 0 hsla(0,0%,100%,.2); - cursor: pointer; - transition-property: background-color, border-color, box-shadow; - transition-duration: 150ms; - width: 50px; -} - -#newtab-search-submit:dir(rtl) { - border-radius: 2px 0 0 2px; - background-image: url("chrome://browser/skin/search-arrow-go.svg#search-arrow-go-rtl"), linear-gradient(hsla(0,0%,100%,.8), hsla(0,0%,100%,.1)); -} - -#newtab-search-text:focus + #newtab-search-submit, -#newtab-search-text + #newtab-search-submit:hover, -#newtab-search-text[autofocus] + #newtab-search-submit { - border-color: #59b5fc #45a3e7 #3294d5; -} - -#newtab-search-text:focus + #newtab-search-submit, -#newtab-search-text[keepfocus] + #newtab-search-submit, -#newtab-search-text[autofocus] + #newtab-search-submit { - background-image: url("chrome://browser/skin/search-arrow-go.svg#search-arrow-go-inverted"), linear-gradient(#4cb1ff, #1793e5); - box-shadow: 0 1px 0 hsla(0,0%,100%,.2) inset, - 0 0 0 1px hsla(0,0%,100%,.1) inset, - 0 1px 0 hsla(210,54%,20%,.03); -} - -#newtab-search-text + #newtab-search-submit:hover { - background-image: url("chrome://browser/skin/search-arrow-go.svg#search-arrow-go-inverted"), linear-gradient(#4cb1ff, #1793e5); - box-shadow: 0 1px 0 hsla(0,0%,100%,.2) inset, - 0 0 0 1px hsla(0,0%,100%,.1) inset, - 0 1px 0 hsla(210,54%,20%,.03), - 0 0 4px hsla(206,100%,20%,.2); -} - -#newtab-search-text + #newtab-search-submit:hover:active { - box-shadow: 0 1px 1px hsla(211,79%,6%,.1) inset, - 0 0 1px hsla(211,79%,6%,.2) inset; - transition-duration: 0ms; -} - -#newtab-search-text:focus + #newtab-search-submit:dir(rtl), -#newtab-search-text[keepfocus] + #newtab-search-submit:dir(rtl), -#newtab-search-text[autofocus] + #newtab-search-submit:dir(rtl), -#newtab-search-text + #newtab-search-submit:dir(rtl):hover { - background-image: url("chrome://browser/skin/search-arrow-go.svg#search-arrow-go-rtl-inverted"), linear-gradient(#4cb1ff, #1793e5); -} - -/* CUSTOMIZE */ -#newtab-customize-overlay { - opacity: 0; - display: none; - width: 100%; - height: 100%; - background: #F9F9F9; - z-index: 100; - position: fixed; - transition: opacity .07s linear; -} - -.newtab-customize-panel-container { - position: absolute; - margin-right: 40px; - right: 0; -} - -.newtab-customize-panel-container:dir(rtl) { - right: auto; - left: 0; -} - -#newtab-customize-panel { - z-index: 999; - margin-top: 55px; - min-width: 270px; - position: absolute; - top: 100%; - right: -25px; - filter: drop-shadow(0 0 1px rgba(0,0,0,0.4)) drop-shadow(0 3px 4px rgba(0,0,0,0.4)); - transition: all 200ms ease-in-out; - transform-origin: top right; - transform: translate(-30px, -20px) scale(0) translate(30px, 20px); -} - -#newtab-customize-panel:dir(rtl) { - transform-origin: 40px top 20px; -} - -#newtab-customize-panel:dir(rtl), -#newtab-customize-panel-anchor:dir(rtl) { - left: 15px; - right: auto; -} - -#newtab-customize-panel[open="true"] { - transform: translate(-30px, -20px) scale(1) translate(30px, 20px); -} - -#newtab-customize-panel-anchor { - width: 18px; - height: 18px; - background-color: white; - transform: rotate(45deg); - position: absolute; - top: -6px; - right: 15px; -} - -#newtab-customize-title { - color: #7A7A7A; - font-size: 14px; - background-color: #FFFFFF; - line-height: 25px; - padding: 15px; - font-weight: 600; - cursor: default; - border-radius: 5px 5px 0px 0px; - max-width: 300px; - overflow: hidden; - display: table-cell; - border-top: none; -} - -#newtab-customize-panel-inner-wrapper { - background-color: #FFFFFF; - border-radius: 6px; - overflow: hidden; -} - -#newtab-customize-title > label { - cursor: default; -} - -#newtab-customize-panel > .panel-arrowcontainer > .panel-arrowcontent { - padding: 0; -} - -.newtab-customize-panel-item { - line-height: 25px; - padding: 15px; - padding-inline-start: 40px; - font-size: 14px; - cursor: pointer; - max-width: 300px; -} - -.newtab-customize-panel-item:not(:first-child) { - border-top: 1px solid threedshadow; -} - -.newtab-customize-panel-subitem > label, -.newtab-customize-panel-item > label, -.newtab-customize-complex-option { - padding: 0; - margin: 0; - cursor: pointer; -} - -.newtab-customize-panel-item, -.newtab-customize-complex-option { - display: block; - text-align: start; - background-color: #F9F9F9; -} - -.newtab-customize-panel-item[selected]:-moz-locale-dir(rtl) { - background-position: right 15px center; -} - -.newtab-customize-complex-option:hover > .selectable:not([selected]):-moz-locale-dir(rtl), -.selectable:not([selected]):hover:-moz-locale-dir(rtl) { - background-position: right 15px center; -} - -.newtab-customize-panel-item:not([selected]), -.newtab-customize-panel-subitem:not([selected]){ - color: #7A7A7A; -} - -.newtab-customize-panel-item:not([selected]):hover { - color: #FFFFFF; - background-color: #4A90E2 -} - -.newtab-customize-complex-option:hover > .selectable:not([selected]), -.selectable:not([selected]):hover { - background: url("chrome://global/skin/menu/shared-menu-check-hover.svg") no-repeat #FFFFFF; - background-size: 16px 16px; - background-position: 15px 15px; - color: #171F26; -} - -.newtab-customize-complex-option:hover > .selectable:not([selected]) + .newtab-customize-panel-subitem { - background-color: #FFFFFF; -} - -.newtab-customize-panel-item[selected] { - background: url("chrome://global/skin/menu/shared-menu-check-active.svg") no-repeat transparent; - background-size: 16px 16px; - background-position: 15px 15px; - color: black; - font-weight: 600; -} - -.newtab-customize-panel-subitem > .checkbox { - width: 18px; - height: 18px; - background-color: #FFFFFF; - border: solid 1px threedshadow; -} - -.newtab-customize-panel-subitem[selected] > .checkbox { - background: url("chrome://global/skin/menu/shared-menu-check-black.svg") no-repeat #FFFFFF; - background-size: 9px 9px; - background-position: center; - color: #333333; -} - -.newtab-customize-panel-subitem { - font-size: 12px; - padding: 0px 15px 15px 15px; - padding-inline-start: 40px; - display: block; - max-width: 300px; -} - -.newtab-customize-panel-subitem > label { - padding: 0px 10px; - line-height: 20px; - vertical-align: middle; - max-width: 225px; -} - -.newtab-customize-panel-superitem { - line-height: 20px; - border-bottom: medium none !important; - padding: 15px 15px 10px 15px; - padding-inline-start: 40px; - border-top: 1px solid threedshadow; -} - -.contentSearchSuggestionTable { - font: message-box; - font-size: 16px; -} |