sjs/samhuri.net
1
0
Fork 0
mirror of https://github.com/samsonjs/samhuri.net.git synced 2026-04-27 14:57:40 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions

fix mobile blog style

Browse source
This commit is contained in:
Sami Samhuri 2011-11-27 20:11:45 -08:00
parent 9c4b0d7d09
commit c67c9ba682
5 changed files with 28 additions and 28 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

11
assets/blog.css
View file

@ -18,7 +18,7 @@ h1 { margin: 0
.hidden { display: none } .hidden { display: none }
#index { width: 80% #index { width: 80%
; min-width: 200px ; min-width: 300px
; max-width: 800px ; max-width: 800px
; border: solid 1px #999 ; border: solid 1px #999
; -moz-border-radius: 10px ; -moz-border-radius: 10px
@ -37,7 +37,7 @@ h1 { margin: 0
article { width: 80% article { width: 80%
; min-width: 400px ; min-width: 400px
; max-width: 680px ; max-width: 1000px
; margin: 2em auto 1em ; margin: 2em auto 1em
; font-size: 1.2em ; font-size: 1.2em
; line-height: 1.4em ; line-height: 1.4em
@ -55,12 +55,12 @@ article h1 { text-align: left
article h1 a { color: #222 article h1 a { color: #222
; text-decoration: underline ; text-decoration: underline
; border-bottom: none ; border-bottom: none
; text-shadow: #999 1px 1px 5px ; text-shadow: #ccc 1px 1px 5px
; -webkit-transition: text-shadow 0.4s ease-in ; -webkit-transition: text-shadow 0.4s ease-in
} }
article h1 a:hover { text-shadow: #990 1px 1px 8px article h1 a:hover { text-shadow: #cc0 1px 1px 8px
; color: #222 ; color: #000
} }
article h2 { font-size: 1.8em article h2 { font-size: 1.8em
@ -90,6 +90,7 @@ time { color: #444
#prev { float: left } #prev { float: left }
#next { float: right } #next { float: right }
#around br { clear: both }
.sep { text-align: center .sep { text-align: center
; font-size: 2em ; font-size: 2em

31
assets/mobile.css
View file

@ -15,8 +15,6 @@
} }
ul.nav li:after { content: '' } ul.nav li:after { content: '' }
#browse { display: none }
} }
/* phones */ /* phones */
@ -26,7 +24,7 @@
/* common */ /* common */
h1 { font-size: 2em h1 { font-size: 2em
; margin-top: 1em ; margin-top: 0
} }
h2 { font-size: 1em } h2 { font-size: 1em }
@ -46,13 +44,10 @@
footer { font-size: 1em } footer { font-size: 1em }
#blog > header > h1 { margin-top: 0 }
#blog img { max-width: 100% } #blog img { max-width: 100% }
nav#index { width: 90% nav#index { width: 90%
; min-width: auto ; min-width: 310px
; max-width: auto
; margin: 0.3em auto ; margin: 0.3em auto
; padding-bottom: 0.3em ; padding-bottom: 0.3em
} }
@ -64,12 +59,13 @@
nav#index li { list-style-type: disc } nav#index li { list-style-type: disc }
nav#index li > span.date { display: none } nav#index li > span.date { display: none }
#blog article h1 { font-size: 1.2em } #blog article h1 { font-size: 1.6em
; margin-top: 0
}
article { width: 95% article { min-width: 310px
; padding-left: 10px ; margin: 0
; margin: 0 auto ; padding: 1em 0.4em
; padding: 0 0 0 10px
; font-size: 0.8em ; font-size: 0.8em
} }
@ -79,11 +75,10 @@
.sep { font-size: 1em } .sep { font-size: 1em }
#around { width: 100% #around { min-width: 310px
; min-width: auto ; margin: 0
; max-width: auto
; margin: 0 auto
; padding: 0 0.2em ; padding: 0 0.2em
; font-size: 0.8em
} }
#prev, #next { padding: 0.3em 0 #prev, #next { padding: 0.3em 0
@ -122,6 +117,10 @@
#stats { font-size: 0.8em } #stats { font-size: 0.8em }
footer { margin: 0
; padding: 0.5em 0
}
} }
/* landscape */ /* landscape */

2
index.html
View file

@ -5,7 +5,7 @@
<meta name="viewport" content="width=device-width"> <meta name="viewport" content="width=device-width">
<title>samhuri.net</title> <title>samhuri.net</title>
<link rel="icon" type="image/gif" href="assets/s.gif"> <link rel="icon" type="image/gif" href="assets/s.gif">
<link rel="stylesheet" href="assets/style.css"> <link rel="stylesheet" href="assets/style.min.css">
<!-- minifying CSS breaks the @media queries for iPhone and iPad, hrmph --> <!-- minifying CSS breaks the @media queries for iPhone and iPad, hrmph -->
<link rel="stylesheet" media="screen" href="assets/mobile.min.css"> <link rel="stylesheet" media="screen" href="assets/mobile.min.css">
<!--[if lt IE 7]> <!--[if lt IE 7]>

6
templates/blog/index.html
View file

@ -23,12 +23,12 @@
{{{article}}} {{{article}}}
<div id="around"> <div id="around">
{{#previous}} {{#previous}}
<a id="prev" href="{{url}}">&larr; {{title}}</a> <a id="prev" href="{{filename}}">&larr; {{title}}</a>
{{/previous}} {{/previous}}
{{#next}} {{#next}}
<a id="next" href="{{url}}">{{title}} &rarr;</a> <a id="next" href="{{filename}}">{{title}} &rarr;</a>
{{/next}} {{/next}}
<br style="clear:both"> <br>
</div> </div>
{{#comments}} {{#comments}}
<p id="need-js" align="center"><strong>(discussion requires JavaScript)</strong></p> <p id="need-js" align="center"><strong>(discussion requires JavaScript)</strong></p>

6
templates/blog/post.html
View file

@ -16,12 +16,12 @@
{{{article}}} {{{article}}}
<div id="around"> <div id="around">
{{#previous}} {{#previous}}
<a id="prev" href="{{url}}">&larr; {{title}}</a> <a id="prev" href="{{filename}}">&larr; {{title}}</a>
{{/previous}} {{/previous}}
{{#next}} {{#next}}
<a id="next" href="{{url}}">{{title}} &rarr;</a> <a id="next" href="{{filename}}">{{title}} &rarr;</a>
{{/next}} {{/next}}
<br style="clear:both"> <br>
</div> </div>
{{#comments}} {{#comments}}
<p id="need-js" align="center"><strong>(discussion requires JavaScript)</strong></p> <p id="need-js" align="center"><strong>(discussion requires JavaScript)</strong></p>