diff options
Diffstat (limited to 'src/Wallabag/CoreBundle/Resources/views/themes/material/public/css/main.css')
-rwxr-xr-x | src/Wallabag/CoreBundle/Resources/views/themes/material/public/css/main.css | 194 |
1 files changed, 194 insertions, 0 deletions
diff --git a/src/Wallabag/CoreBundle/Resources/views/themes/material/public/css/main.css b/src/Wallabag/CoreBundle/Resources/views/themes/material/public/css/main.css new file mode 100755 index 00000000..08002713 --- /dev/null +++ b/src/Wallabag/CoreBundle/Resources/views/themes/material/public/css/main.css | |||
@@ -0,0 +1,194 @@ | |||
1 | /* ========================================================================== | ||
2 | Sommaire | ||
3 | |||
4 | 0 = Common | ||
5 | 1 = Nav | ||
6 | 2 = Side-nav | ||
7 | |||
8 | 2 = Layout | ||
9 | 3 = Pictos | ||
10 | 4 = Messages | ||
11 | 5 = Article | ||
12 | |||
13 | 6 = Media queries | ||
14 | |||
15 | ========================================================================== */ | ||
16 | |||
17 | |||
18 | /* ========================================================================== | ||
19 | 0 = Common | ||
20 | ========================================================================== */ | ||
21 | |||
22 | body { | ||
23 | display: flex; | ||
24 | min-height: 100vh; | ||
25 | flex-direction: column; | ||
26 | background: #f0f0f0; | ||
27 | } | ||
28 | |||
29 | .border-bottom { | ||
30 | border-bottom: 1px solid #DDD; | ||
31 | } | ||
32 | |||
33 | nav, main, footer { | ||
34 | padding-left: 240px; | ||
35 | } | ||
36 | |||
37 | #main { | ||
38 | flex: 1 0 auto; | ||
39 | } | ||
40 | |||
41 | .results { | ||
42 | height: 1em; | ||
43 | line-height: 30px; | ||
44 | } | ||
45 | |||
46 | .results .nb-results, .results .pagination { | ||
47 | margin: 15px; | ||
48 | margin-bottom: 0; | ||
49 | } | ||
50 | |||
51 | .page-footer .footer-copyright p { | ||
52 | display: inline; | ||
53 | } | ||
54 | |||
55 | .hidden { | ||
56 | display: none; | ||
57 | } | ||
58 | |||
59 | /* ========================================================================== | ||
60 | 1 = Nav | ||
61 | ========================================================================== */ | ||
62 | |||
63 | .nav-wrapper .button-collapse { | ||
64 | padding: 0px 15px; | ||
65 | } | ||
66 | |||
67 | .nav-input { | ||
68 | display: none; | ||
69 | } | ||
70 | |||
71 | .nav-panels { | ||
72 | overflov: hidden; | ||
73 | } | ||
74 | |||
75 | .nav-panel-buttom li { | ||
76 | max-height: 64px; | ||
77 | } | ||
78 | |||
79 | .nav-panel-buttom { | ||
80 | float: right; | ||
81 | } | ||
82 | |||
83 | /* ========================================================================== | ||
84 | 2 = Side-nav | ||
85 | ========================================================================== */ | ||
86 | |||
87 | .side-nav.fixed a { | ||
88 | font-size: 13px; | ||
89 | line-height: 44px; | ||
90 | height: 44px; | ||
91 | } | ||
92 | |||
93 | .bold > a { | ||
94 | font-weight: bold; | ||
95 | } | ||
96 | |||
97 | .side-nav > li.logo { | ||
98 | line-height: 0; | ||
99 | text-align: center; | ||
100 | } | ||
101 | |||
102 | #main .logo a { | ||
103 | height: 100pt; | ||
104 | } | ||
105 | |||
106 | #main .logo img { | ||
107 | height: 100pt; | ||
108 | width: 100pt; | ||
109 | } | ||
110 | |||
111 | .side-nav li { | ||
112 | padding: 0px; | ||
113 | } | ||
114 | |||
115 | .side-nav a { | ||
116 | margin: 0px 1rem; | ||
117 | } | ||
118 | |||
119 | /* ========================================================================== | ||
120 | 3 = Cards | ||
121 | ========================================================================== */ | ||
122 | |||
123 | main #content { | ||
124 | padding: 0px 0.5rem; | ||
125 | } | ||
126 | |||
127 | main ul.row { | ||
128 | padding: 0px 0.75rem; | ||
129 | } | ||
130 | |||
131 | main .card .card-content { | ||
132 | min-height: 23em; | ||
133 | } | ||
134 | |||
135 | .card .card-content .card-title { | ||
136 | line-height: 32px; | ||
137 | } | ||
138 | |||
139 | .card .card-content .estimatedTime { | ||
140 | margin-bottom: 10px; | ||
141 | } | ||
142 | |||
143 | .card .card-action .original { | ||
144 | line-height: 24px; | ||
145 | } | ||
146 | |||
147 | .card .card-action ul.links { | ||
148 | margin: 0; | ||
149 | font-size: 24px; | ||
150 | line-height: 24px; | ||
151 | } | ||
152 | |||
153 | .card .card-action ul.links a { | ||
154 | margin-right: 0; | ||
155 | margin-left: 15px; | ||
156 | } | ||
157 | |||
158 | /* ========================================================================== | ||
159 | 4 = Article | ||
160 | ========================================================================== */ | ||
161 | |||
162 | #article { | ||
163 | font-size: 20px; | ||
164 | margin: 0px auto; | ||
165 | max-width: 30em; | ||
166 | } | ||
167 | |||
168 | .reader-mode { | ||
169 | width: 95px !important; | ||
170 | transition: width 0.2s ease; | ||
171 | } | ||
172 | |||
173 | .reader-mode:hover { | ||
174 | width: 240px !important; | ||
175 | } | ||
176 | |||
177 | .reader-mode span { | ||
178 | opacity: 0; | ||
179 | transition: opacity 0.2s ease; | ||
180 | } | ||
181 | |||
182 | .reader-mode:hover span { | ||
183 | opacity: 1; | ||
184 | } | ||
185 | |||
186 | /* ========================================================================== | ||
187 | 6 = Media queries | ||
188 | ========================================================================== */ | ||
189 | |||
190 | @media only screen and (max-width : 992px) { | ||
191 | header, main, footer { | ||
192 | padding-left: 0; | ||
193 | } | ||
194 | } | ||