diff options
author | Jérémy Benoist <j0k3r@users.noreply.github.com> | 2017-10-23 11:09:17 +0200 |
---|---|---|
committer | GitHub <noreply@github.com> | 2017-10-23 11:09:17 +0200 |
commit | 1953a872932a63792293b4aec087880265ba89f7 (patch) | |
tree | fd16599e737fcdaf193c933ef3ec4a4ee248b117 /app/Resources/static/themes/baggy/css/media_queries.scss | |
parent | d83d25dadec2c38460a32d96f5d2903426fec9d3 (diff) | |
parent | 702f2d67d60ca963492b90dad74cb5f8dcc84e51 (diff) | |
download | wallabag-1953a872932a63792293b4aec087880265ba89f7.tar.gz wallabag-1953a872932a63792293b4aec087880265ba89f7.tar.zst wallabag-1953a872932a63792293b4aec087880265ba89f7.zip |
Merge pull request #3011 from wallabag/2.3
wallabag 2.3.0
Diffstat (limited to 'app/Resources/static/themes/baggy/css/media_queries.scss')
-rwxr-xr-x | app/Resources/static/themes/baggy/css/media_queries.scss | 172 |
1 files changed, 172 insertions, 0 deletions
diff --git a/app/Resources/static/themes/baggy/css/media_queries.scss b/app/Resources/static/themes/baggy/css/media_queries.scss new file mode 100755 index 00000000..c33db0b3 --- /dev/null +++ b/app/Resources/static/themes/baggy/css/media_queries.scss | |||
@@ -0,0 +1,172 @@ | |||
1 | |||
2 | @media screen and (max-width: 1050px) { | ||
3 | .entry { | ||
4 | width: 49%; | ||
5 | } | ||
6 | |||
7 | .entry:nth-child(3n+1) { | ||
8 | margin-left: 1.5%; | ||
9 | } | ||
10 | |||
11 | .entry:nth-child(2n+1) { | ||
12 | margin-left: 0; | ||
13 | } | ||
14 | } | ||
15 | |||
16 | @media screen and (max-width: 900px) { | ||
17 | #article { | ||
18 | width: 80%; | ||
19 | } | ||
20 | |||
21 | .topPosF { | ||
22 | right: 2.5em; | ||
23 | } | ||
24 | } | ||
25 | |||
26 | @media screen and (max-width: 700px) { | ||
27 | .entry { | ||
28 | width: 100%; | ||
29 | margin-left: 0; | ||
30 | } | ||
31 | |||
32 | #display-mode { | ||
33 | display: none; | ||
34 | } | ||
35 | } | ||
36 | |||
37 | @media screen and (max-height: 770px) { | ||
38 | .menu.users, | ||
39 | .menu.internal, | ||
40 | .menu.developer { | ||
41 | display: none; | ||
42 | } | ||
43 | } | ||
44 | |||
45 | @media screen and (max-width: 500px) { | ||
46 | .entry { | ||
47 | width: 100%; | ||
48 | margin-left: 0; | ||
49 | } | ||
50 | |||
51 | body > header { | ||
52 | background-color: #333; | ||
53 | position: fixed; | ||
54 | top: 0; | ||
55 | width: 100%; | ||
56 | height: 3em; | ||
57 | z-index: 11; | ||
58 | } | ||
59 | |||
60 | #links li:last-child { | ||
61 | position: static; | ||
62 | width: auto; | ||
63 | } | ||
64 | |||
65 | #links li:last-child a::before { | ||
66 | content: none; | ||
67 | } | ||
68 | |||
69 | .logo { | ||
70 | width: 1.25em; | ||
71 | height: 1.25em; | ||
72 | left: 0; | ||
73 | top: 0; | ||
74 | } | ||
75 | |||
76 | .login > header { | ||
77 | position: static; | ||
78 | } | ||
79 | |||
80 | .login form { | ||
81 | width: 100%; | ||
82 | position: static; | ||
83 | margin-left: 0; | ||
84 | } | ||
85 | |||
86 | .login .logo { | ||
87 | height: auto; | ||
88 | top: 0.5em; | ||
89 | width: 75px; | ||
90 | margin-left: -37.5px; | ||
91 | } | ||
92 | |||
93 | .desktopHide { | ||
94 | display: block; | ||
95 | position: fixed; | ||
96 | z-index: 20; | ||
97 | top: 0; | ||
98 | right: 0; | ||
99 | border: 0; | ||
100 | width: 2.5em; | ||
101 | height: 2.5em; | ||
102 | cursor: pointer; | ||
103 | background-color: #999; | ||
104 | font-size: 1.2em; | ||
105 | } | ||
106 | |||
107 | .desktopHide:hover, | ||
108 | .desktopHide:focus { | ||
109 | background-color: #fff; | ||
110 | } | ||
111 | |||
112 | #links { | ||
113 | display: none; | ||
114 | width: 100%; | ||
115 | height: auto; | ||
116 | padding-top: 3em; | ||
117 | } | ||
118 | |||
119 | #links.menu--open { | ||
120 | display: block; | ||
121 | } | ||
122 | |||
123 | footer { | ||
124 | position: static; | ||
125 | margin-right: 3em; | ||
126 | } | ||
127 | |||
128 | #main { | ||
129 | margin-left: 1.5em; | ||
130 | padding-right: 1.5em; | ||
131 | position: static; | ||
132 | margin-top: 3em; | ||
133 | } | ||
134 | |||
135 | .card-entry-labels { | ||
136 | display: none; | ||
137 | } | ||
138 | |||
139 | #article_toolbar .topPosF { | ||
140 | display: none; | ||
141 | } | ||
142 | |||
143 | #article { | ||
144 | width: 100%; | ||
145 | } | ||
146 | |||
147 | #article h1 { | ||
148 | font-size: 1.5em; | ||
149 | } | ||
150 | |||
151 | #article_toolbar a { | ||
152 | padding: 0.3em 0.4em 0.2em; | ||
153 | } | ||
154 | |||
155 | #display-mode { | ||
156 | display: none; | ||
157 | } | ||
158 | |||
159 | .popup-form, | ||
160 | #bagit-form, | ||
161 | #search-form { | ||
162 | left: 0; | ||
163 | width: 100%; | ||
164 | border-left: none; | ||
165 | } | ||
166 | |||
167 | .popup-form form, | ||
168 | #bagit-form form, | ||
169 | #search-form form { | ||
170 | width: 100%; | ||
171 | } | ||
172 | } | ||