Browse Source

Merge pull request #10 from EitZei/master

Convert rem's to em's in breakpoints
Steve Francia 9 years ago
parent
commit
1a7140a4d7
2 changed files with 11 additions and 11 deletions
  1. 8
    8
      static/css/hyde.css
  2. 3
    3
      static/css/poole.css

+ 8
- 8
static/css/hyde.css View File

34
 html {
34
 html {
35
   font-family: "PT Sans", Helvetica, Arial, sans-serif;
35
   font-family: "PT Sans", Helvetica, Arial, sans-serif;
36
 }
36
 }
37
-@media (min-width: 48rem) {
37
+@media (min-width: 48em) {
38
   html {
38
   html {
39
     font-size: 16px;
39
     font-size: 16px;
40
   }
40
   }
41
 }
41
 }
42
-@media (min-width: 58rem) {
42
+@media (min-width: 58em) {
43
   html {
43
   html {
44
     font-size: 20px;
44
     font-size: 20px;
45
   }
45
   }
59
   color: rgba(255,255,255,.5);
59
   color: rgba(255,255,255,.5);
60
   background-color: #202020;
60
   background-color: #202020;
61
 }
61
 }
62
-@media (min-width: 48rem) {
62
+@media (min-width: 48em) {
63
   .sidebar {
63
   .sidebar {
64
     position: fixed;
64
     position: fixed;
65
     top: 0;
65
     top: 0;
105
  * contents to the bottom of the sidebar in tablets and up.
105
  * contents to the bottom of the sidebar in tablets and up.
106
  */
106
  */
107
 
107
 
108
-@media (min-width: 48rem) {
108
+@media (min-width: 48em) {
109
   .sidebar-sticky {
109
   .sidebar-sticky {
110
     position: absolute;
110
     position: absolute;
111
     right:  1rem;
111
     right:  1rem;
126
   padding-bottom: 4rem;
126
   padding-bottom: 4rem;
127
 }
127
 }
128
 
128
 
129
-@media (min-width: 48rem) {
129
+@media (min-width: 48em) {
130
   .content {
130
   .content {
131
     max-width: 38rem;
131
     max-width: 38rem;
132
     margin-left: 20rem;
132
     margin-left: 20rem;
134
   }
134
   }
135
 }
135
 }
136
 
136
 
137
-@media (min-width: 64rem) {
137
+@media (min-width: 64em) {
138
   .content {
138
   .content {
139
     margin-left: 22rem;
139
     margin-left: 22rem;
140
     margin-right: 4rem;
140
     margin-right: 4rem;
148
  * Flip the orientation of the page by placing the `.sidebar` on the right.
148
  * Flip the orientation of the page by placing the `.sidebar` on the right.
149
  */
149
  */
150
 
150
 
151
-@media (min-width: 48rem) {
151
+@media (min-width: 48em) {
152
   .layout-reverse .sidebar {
152
   .layout-reverse .sidebar {
153
     left: auto;
153
     left: auto;
154
     right: 0;
154
     right: 0;
159
   }
159
   }
160
 }
160
 }
161
 
161
 
162
-@media (min-width: 64rem) {
162
+@media (min-width: 64em) {
163
   .layout-reverse .content {
163
   .layout-reverse .content {
164
     margin-left: 4rem;
164
     margin-left: 4rem;
165
     margin-right: 22rem;
165
     margin-right: 22rem;

+ 3
- 3
static/css/poole.css View File

52
   font-size: 16px;
52
   font-size: 16px;
53
   line-height: 1.5;
53
   line-height: 1.5;
54
 }
54
 }
55
-@media (min-width: 38rem) {
55
+@media (min-width: 38em) {
56
   html {
56
   html {
57
     font-size: 20px;
57
     font-size: 20px;
58
   }
58
   }
193
 blockquote p:last-child {
193
 blockquote p:last-child {
194
   margin-bottom: 0;
194
   margin-bottom: 0;
195
 }
195
 }
196
-@media (min-width: 30rem) {
196
+@media (min-width: 30em) {
197
   blockquote {
197
   blockquote {
198
     padding-right: 5rem;
198
     padding-right: 5rem;
199
     padding-left: 1.25rem;
199
     padding-left: 1.25rem;
382
   background-color: #f5f5f5;
382
   background-color: #f5f5f5;
383
 }
383
 }
384
 
384
 
385
-@media (min-width: 30rem) {
385
+@media (min-width: 30em) {
386
   .pagination {
386
   .pagination {
387
     margin: 3rem 0;
387
     margin: 3rem 0;
388
   }
388
   }