1+ /* Copyright 2013 The Chromium Authors. All rights reserved.
2+ * Use of this source code is governed by a BSD-style license that can be
3+ * found in the LICENSE file. */
4+
5+ html , body {
6+ padding : 0 ;
7+ margin : 0 ;
8+ width : 100% ;
9+ height : 100% ;
10+ }
11+
12+ .icon {
13+ -webkit-user-select : none;
14+ user-select : none;
15+ display : inline-block;
16+ }
17+
18+ .icon-offline {
19+ content : -webkit-image-set ( url (assets/default_100_percent/100-error-offline.png) 1x , url (assets/default_200_percent/200-error-offline.png) 2x );
20+ position : relative;
21+ }
22+
23+ .hidden {
24+ display : none;
25+ }
26+
27+
28+ /* Offline page */
29+
30+ .offline .interstitial-wrapper {
31+ color : # 2b2b2b ;
32+ font-size : 1em ;
33+ line-height : 1.55 ;
34+ margin : 0 auto;
35+ max-width : 600px ;
36+ padding-top : 100px ;
37+ width : 100% ;
38+ }
39+
40+ .offline .runner-container {
41+ height : 150px ;
42+ max-width : 600px ;
43+ overflow : hidden;
44+ position : absolute;
45+ top : 35px ;
46+ width : 44px ;
47+ }
48+
49+ .offline .runner-canvas {
50+ height : 150px ;
51+ max-width : 600px ;
52+ opacity : 1 ;
53+ overflow : hidden;
54+ position : absolute;
55+ top : 0 ;
56+ z-index : 2 ;
57+ }
58+
59+ .offline .controller {
60+ background : rgba (247 , 247 , 247 , .1 );
61+ height : 100vh ;
62+ left : 0 ;
63+ position : absolute;
64+ top : 0 ;
65+ width : 100vw ;
66+ z-index : 1 ;
67+ }
68+
69+ # offline-resources {
70+ display : none;
71+ }
72+
73+ @media (max-width : 420px ) {
74+ .suggested-left > # control-buttons , .suggested-right > # control-buttons {
75+ float : none;
76+ }
77+ .snackbar {
78+ left : 0 ;
79+ bottom : 0 ;
80+ width : 100% ;
81+ border-radius : 0 ;
82+ }
83+ }
84+
85+ @media (max-height : 350px ) {
86+ h1 {
87+ margin : 0 0 15px ;
88+ }
89+ .icon-offline {
90+ margin : 0 0 10px ;
91+ }
92+ .interstitial-wrapper {
93+ margin-top : 5% ;
94+ }
95+ .nav-wrapper {
96+ margin-top : 30px ;
97+ }
98+ }
99+
100+ @media (min-width : 600px ) and (max-width : 736px ) and (orientation : landscape) {
101+ .offline .interstitial-wrapper {
102+ margin-left : 0 ;
103+ margin-right : 0 ;
104+ }
105+ }
106+
107+ @media (min-width : 420px ) and (max-width : 736px ) and (min-height : 240px ) and (max-height : 420px ) and (orientation : landscape) {
108+ .interstitial-wrapper {
109+ margin-bottom : 100px ;
110+ }
111+ }
112+
113+ @media (min-height : 240px ) and (orientation : landscape) {
114+ .offline .interstitial-wrapper {
115+ margin-bottom : 90px ;
116+ }
117+ .icon-offline {
118+ margin-bottom : 20px ;
119+ }
120+ }
121+
122+ @media (max-height : 320px ) and (orientation : landscape) {
123+ .icon-offline {
124+ margin-bottom : 0 ;
125+ }
126+ .offline .runner-container {
127+ top : 10px ;
128+ }
129+ }
130+
131+ @media (max-width : 240px ) {
132+ .interstitial-wrapper {
133+ overflow : inherit;
134+ padding : 0 8px ;
135+ }
136+ }
0 commit comments