second part of syncing LCARStrek with Firefox 39 windows theme changes
[themes.git] / LCARStrek / browser / newtab / newTab.css
CommitLineData
fff8097b
RK
1/* This Source Code Form is subject to the terms of the Mozilla Public
2 * License, v. 2.0. If a copy of the MPL was not distributed with this
3 * file, You can obtain one at http://mozilla.org/MPL/2.0/. */
4
8d7ef0d9
RK
5:root {
6 -moz-appearance: none;
56ab361a 7 font-size: 75%;
8d7ef0d9 8 background-color: transparent;
0d686391 9 padding: 0;
0d686391
RK
10}
11
8d7ef0d9 12/* SCROLLBOX */
2b5a5147 13#newtab-scrollbox:not([page-disabled]) {
3a0880a9 14 color: #FF9F00;
8d7ef0d9 15 background-color: #000000;
0d686391
RK
16}
17
2b5a5147
RK
18#newtab-scrollbox:not([page-disabled]) #newtab-margin-bottom {
19 background: inherit;
20}
21
56ab361a
RK
22/* UNDO */
23#newtab-undo-container {
24 padding: 4px 3px;
25 border: 1px solid;
26 border-color: #9C9CFF;
27 background-color: #000000;
28 color: #8050B0;
29}
30
31#newtab-undo-label {
32 margin-top: 0;
33 margin-bottom: 0;
34}
35
36.newtab-undo-button {
37 color: #3333FF;
38 cursor: pointer;
39 padding: 0;
40 margin: 0 4px;
41 border: 0;
42 background: transparent;
43 text-decoration: none;
44 min-width: 0;
45}
46
47.newtab-undo-button:hover {
48 text-decoration: underline;
49}
50
51.newtab-undo-button:-moz-focusring {
52 outline: 1px dotted;
53}
54
55.newtab-undo-button > .button-box {
56 padding: 0;
57}
58
59#newtab-undo-close-button {
60 padding: 0;
61 border: none;
62 list-style-image: url("chrome://global/skin/icons/close.png");
63 -moz-image-region: rect(0, 16px, 16px, 0);
56ab361a
RK
64}
65
66#newtab-undo-close-button:hover {
67 -moz-image-region: rect(0, 32px, 16px, 16px);
68}
69
56ab361a
RK
70#newtab-undo-close-button:-moz-focusring {
71 outline: 1px dotted;
72}
73
2b5a5147
RK
74/* CUSTOMIZE */
75#newtab-customize-button,
76.newtab-customize {
77 background-color: transparent;
78 background-image: -moz-image-rect(url("chrome://browser/skin/newtab/controls.svg"), 0, 32, 32, 0);
79 background-size: 28px;
80 border: none;
81 border-radius: 3px;
82 height: 28px;
83 width: 28px;
84}
85
86#newtab-customize-button:-moz-any(:hover, :active, [active]) {
87 background-image: -moz-image-rect(url("chrome://browser/skin/newtab/controls.svg"), 0, 64, 32, 32);
88 background-color: #FFCF00;
89}
90
8d7ef0d9
RK
91/* CELLS */
92.newtab-cell {
8d7ef0d9
RK
93 background-color: rgba(255,159,0,.2);
94 border: 1px solid;
95 border-color: #9C9CFF;
96 border-radius: 1px;
0d686391
RK
97}
98
8d7ef0d9 99.newtab-cell:empty {
2b5a5147
RK
100 outline: 2px dashed #A09090;
101 -moz-outline-radius: 2px;
0d686391
RK
102}
103
8d7ef0d9
RK
104/* SITES */
105.newtab-site {
d4d77dc0 106 border-radius: inherit;
8d7ef0d9 107 text-decoration: none;
71a617ff 108 transition-property: top, left, opacity, box-shadow, background-color;
0d686391
RK
109}
110
fff8097b 111.newtab-cell:not([ignorehover]) > .newtab-site:hover,
8d7ef0d9
RK
112.newtab-site[dragged] {
113 box-shadow: 0 0 10px rgba(0,132,132,.3);
0d686391
RK
114}
115
8d7ef0d9 116.newtab-site[dragged] {
71a617ff 117 transition-property: box-shadow, background-color;
8d7ef0d9 118 background-color: #002121;
0d686391
RK
119}
120
2b5a5147
RK
121/* LINKS */
122.newtab-link {
123 border-radius: 3px;
124}
125
8d7ef0d9
RK
126/* THUMBNAILS */
127.newtab-thumbnail {
128 background-origin: padding-box;
129 background-clip: padding-box;
130 background-repeat: no-repeat;
131 background-size: cover;
2b5a5147
RK
132 transition: opacity 100ms ease-out;
133}
134
0ef54c72 135.newtab-cell:not([ignorehover]) .newtab-site:hover .newtab-thumbnail.enhanced-content {
2b5a5147 136 opacity: 0;
0d686391
RK
137}
138
fff8097b 139.newtab-site[type=affiliate] .newtab-thumbnail,
2b5a5147 140.newtab-site[type=enhanced] .newtab-thumbnail,
fff8097b
RK
141.newtab-site[type=organic] .newtab-thumbnail,
142.newtab-site[type=sponsored] .newtab-thumbnail {
143 background-position: center center;
144 background-size: auto;
145}
146
8d7ef0d9 147/* TITLES */
58036cb8 148/*#newtab-intro-what,*/
2b5a5147 149.newtab-sponsored,
0ef54c72
RK
150.newtab-title,
151.newtab-suggested {
8d7ef0d9
RK
152 padding: 0 8px;
153 background-color: rgba(255,159,0,.8);
154 color: #000000;
8d7ef0d9 155 line-height: 24px;
fff8097b
RK
156 bottom: 0 !important;
157}
158
0ef54c72
RK
159.newtab-suggested {
160 background-color: #9C9CFF;
161}
162
163.newtab-suggested:hover {
164 background-color: #FFCF00;
165 border: 1px solid #9C9CFF;
166}
167
168.newtab-suggested[active] {
169 background-color: #FF9F00;
170 border: 0;
171}
05148fed 172
2b5a5147
RK
173.newtab-site:hover .newtab-title {
174 background-color: #FFCF00;
0d686391
RK
175}
176
2b5a5147
RK
177.newtab-site[pinned] .newtab-title {
178 padding: 0 15px;
0d686391
RK
179}
180
2b5a5147
RK
181.newtab-site[pinned] .newtab-title::before {
182 background-image: -moz-image-rect(url("chrome://browser/skin/newtab/controls.svg"), 7, 278, 28, 266);
183 background-size: 10px;
184 content: "";
185 height: 17px;
482e8162
RK
186 left: 5px;
187 top: 5px;
2b5a5147
RK
188 position: absolute;
189 width: 10px;
0d686391
RK
190}
191
2b5a5147
RK
192.newtab-site[pinned] .newtab-title:-moz-locale-dir(rtl)::before {
193 left: auto;
194 right: 0;
0d686391
RK
195}
196
2b5a5147
RK
197/* CONTROLS */
198.newtab-control {
199 background-color: transparent;
200 background-size: 24px;
201 border: none;
202 height: 24px;
203 width: 24px;
0d686391
RK
204}
205
2b5a5147
RK
206.newtab-control-pin,
207.newtab-site[pinned] .newtab-control-pin:hover:active {
208 background-image: -moz-image-rect(url("chrome://browser/skin/newtab/controls.svg"), 0, 96, 32, 64);
0d686391
RK
209}
210
2b5a5147
RK
211.newtab-control-pin:hover,
212.newtab-site[pinned] .newtab-control-pin:hover {
213 background-image: -moz-image-rect(url("chrome://browser/skin/newtab/controls.svg"), 0, 128, 32, 96);
0d686391
RK
214}
215
2b5a5147
RK
216.newtab-control-pin:hover:active,
217.newtab-site[pinned] .newtab-control-pin {
218 background-image: -moz-image-rect(url("chrome://browser/skin/newtab/controls.svg"), 0, 160, 32, 128);
0d686391 219}
fff8097b 220
2b5a5147
RK
221.newtab-control-block {
222 background-image: -moz-image-rect(url("chrome://browser/skin/newtab/controls.svg"), 0, 192, 32, 160);
fff8097b
RK
223}
224
2b5a5147
RK
225.newtab-control-block:hover {
226 background-image: -moz-image-rect(url("chrome://browser/skin/newtab/controls.svg"), 0, 224, 32, 192);
fff8097b
RK
227}
228
2b5a5147
RK
229.newtab-control-block:hover:active {
230 background-image: -moz-image-rect(url("chrome://browser/skin/newtab/controls.svg"), 0, 256, 32, 224);
fff8097b 231}