| OLD | NEW |
| 1 /* Apps */ | 1 /* Apps */ |
| 2 | 2 |
| 3 #apps-content { | 3 #apps-content { |
| 4 position: relative; | 4 position: relative; |
| 5 max-width: 780px; /* (124 + margin * 2) * 6 */ | 5 max-width: 780px; /* (124 + margin * 2) * 6 */ |
| 6 } | 6 } |
| 7 | 7 |
| 8 html.apps-promo-visible #apps-content { | 8 html.apps-promo-visible #apps-content { |
| 9 max-width: 650px; /* (124 + margin * 2) * 5 */ | 9 max-width: 650px; /* (124 + margin * 2) * 5 */ |
| 10 } | 10 } |
| (...skipping 124 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
| 135 | 135 |
| 136 menu > button.default { | 136 menu > button.default { |
| 137 font-weight: bold; | 137 font-weight: bold; |
| 138 } | 138 } |
| 139 | 139 |
| 140 #apps-promo { | 140 #apps-promo { |
| 141 display: none; | 141 display: none; |
| 142 } | 142 } |
| 143 | 143 |
| 144 html.apps-promo-visible #apps-promo { | 144 html.apps-promo-visible #apps-promo { |
| 145 display: block; | 145 background: url('chrome://theme/IDR_WEBSTORE_ICON') no-repeat; |
| 146 height: 125px; |
| 147 -webkit-padding-start: 125px; |
| 148 display: table-cell; |
| 149 vertical-align: text-bottom; |
| 146 } | 150 } |
| 147 | 151 |
| 148 #apps-promo > h3 { | 152 #apps-promo-heading { |
| 149 font-size: 16px; | 153 font-size: 115%; |
| 150 margin-top: 1em; | 154 font-weight: bold; |
| 151 margin-bottom: 0.25em; | 155 margin-bottom: 5px; |
| 152 } | 156 -webkit-margin-start: 3px; |
| 153 | |
| 154 #apps-promo-text1 { | |
| 155 margin-top: 0; | |
| 156 } | 157 } |
| 157 | 158 |
| 158 #apps-promo-hide { | 159 #apps-promo-hide { |
| 159 float: right; | |
| 160 -webkit-appearance: none; | 160 -webkit-appearance: none; |
| 161 -webkit-transition: opacity .15s; | 161 -webkit-transition: opacity .15s; |
| 162 background-color: transparent; | 162 background-color: transparent; |
| 163 border: 0; | 163 border: 0; |
| 164 cursor: pointer; | 164 cursor: pointer; |
| 165 font-family: inherit; | 165 font-family: inherit; |
| 166 font-size: 90%; | 166 font-size: 90%; |
| 167 text-decoration: underline; | 167 text-decoration: underline; |
| 168 margin-top: 2px; |
| 168 } | 169 } |
| 169 | 170 |
| 170 html[dir=rtl] #apps-promo-hide { | 171 html[dir=rtl] #apps-promo-hide { |
| 171 float: left; | 172 float: left; |
| 172 } | 173 } |
| 173 | 174 |
| 174 html.apps-promo-visible .app.web-store-entry { | |
| 175 position: absolute; | |
| 176 left: 100%; | |
| 177 top: 0; | |
| 178 -webkit-margin-start: 22px; | |
| 179 } | |
| 180 | |
| 181 html.apps-promo-visible[dir=rtl] .app.web-store-entry { | |
| 182 right: 100%; | |
| 183 } | |
| 184 | |
| 185 html.apps-promo-visible .app.web-store-entry a { | |
| 186 font-weight: bold; | |
| 187 } | |
| 188 | |
| 189 /* | 175 /* |
| 190 We position the web store entry all by its lonesome in the top of the rightmost | 176 We position the web store entry all by its lonesome in the top of the rightmost |
| 191 column when there is at least one full row of apps. Note that this is similar, | 177 column when there is at least one full row of apps. Note that this is similar, |
| 192 but different than its position during promo (html.apps-promo-visible), so we | 178 but different than its position during promo (html.apps-promo-visible), so we |
| 193 never set .loner while the promo is running. | 179 never set .loner while the promo is running. |
| 194 */ | 180 */ |
| 195 .app.web-store-entry.loner { | 181 .app.web-store-entry.loner { |
| 196 position: absolute; | 182 position: absolute; |
| 197 left: 100%; | 183 left: 100%; |
| 198 top: 0; | 184 top: 0; |
| 199 } | 185 } |
| 200 | 186 |
| 201 html[dir=rtl] .app.web-store-entry.loner { | 187 html[dir=rtl] .app.web-store-entry.loner { |
| 202 right: 100%; | 188 right: 100%; |
| 203 } | 189 } |
| 190 |
| 191 /* g-button CSS styles (see go/buttons) */ |
| 192 @media screen, projection { |
| 193 g-button-basic * { |
| 194 margin: 0; |
| 195 padding: 0; |
| 196 } |
| 197 |
| 198 .g-button-basic { |
| 199 direction: ltr; |
| 200 line-height: 1.2; |
| 201 width: 20em; |
| 202 max-width: 795px; |
| 203 background-color: #cadef4; |
| 204 border: 1px solid #ccc; |
| 205 padding: 15px; |
| 206 text-align: center; |
| 207 overflow: visible; |
| 208 } |
| 209 |
| 210 .g-button-basic div { |
| 211 font-size: 1.3em; |
| 212 background: url('g-button-chocobo-basic-1.png') no-repeat; |
| 213 background-color: #5679a5; |
| 214 } |
| 215 |
| 216 .g-button-basic div span span a { |
| 217 display: block; |
| 218 color: #fff!important; |
| 219 background: url('g-button-chocobo-basic-2.png') no-repeat right bottom; |
| 220 padding: 8px 18px 13px 13px; |
| 221 text-decoration: none; |
| 222 font-weight: bold; |
| 223 } |
| 224 |
| 225 .g-button-basic div span { |
| 226 display: block; |
| 227 background: url('g-button-chocobo-basic-1.png') no-repeat right -400px; |
| 228 height: 1%; |
| 229 } |
| 230 |
| 231 .g-button-basic p { |
| 232 text-align: center; |
| 233 margin: 10px 0 0; |
| 234 } |
| 235 |
| 236 .g-button-basic { |
| 237 padding: 0; |
| 238 background: none; |
| 239 border: 0; |
| 240 } |
| 241 |
| 242 .g-button-basic div span span { |
| 243 background: url('g-button-chocobo-basic-1.png') no-repeat left bottom; |
| 244 } |
| 245 } |
| OLD | NEW |