lib/generators/pakyow/app/templates/public/pakyow-css/style.css in pakyow-0.8.0 vs lib/generators/pakyow/app/templates/public/pakyow-css/style.css in pakyow-0.9.0

- old
+ new

@@ -1,217 +1,191 @@ -@import url("reset.css"); +html { + font-size: 62.5%; + line-height: 62.5%; } body { - background:#fff; + background: #fff; + color: #333; + font-family: "Helvetica Neue", Helvetica, sans-serif; + font-size: 13px; + font-size: 1.3rem; } - color:#333; - font:13px "Helvetica Neue", Helvetica, sans-serif; -} - code { - font:0.9em Menlo, monospace; -} + font-family: Menlo, monospace; + font-size: 9px; + font-size: 0.9rem; } h1, h2, h3, h4 { - font-weight:bold; -} + font-weight: bold; } h1 { - font-size:2.4em; - line-height:2em; -} + font-size: 32px; + font-size: 3.2rem; + line-height: 20px; + line-height: 2rem; } h2 { - font-size:1.8em; - line-height:2em; -} + font-size: 24px; + font-size: 2.4rem; + line-height: 20px; + line-height: 2rem; } h3 { - font-size:1.4em; - line-height:2em; -} + font-size: 18px; + font-size: 1.8rem; + line-height: 20px; + line-height: 2rem; } h4 { - font-size:1.1em; - line-height:1.5em; -} + font-size: 15px; + font-size: 1.5rem; + line-height: 15px; + line-height: 1.5rem; } h5 { - font-size:1em; - line-height:1.5em; -} + font-size: 13px; + font-size: 1.3rem; + line-height: 15px; + line-height: 1.5rem; } hr { - border:0; - height:1px; - background:#DEDEDE; - margin-top:30px; -} + border: 0; + height: 1px; + background: #DEDEDE; + margin-top: 30px; } p { - font-size:1em; - line-height:1.4em; - margin: 0 0 9px; -} + font-size: 13px; + font-size: 1.3rem; + line-height: 18px; + line-height: 1.8rem; + margin: 0 0 9px; } strong { - font-weight:bold; -} + font-weight: bold; } em { - font-style:italic; -} + font-style: italic; } a { - color:#206cb1; - text-decoration:none; -} + color: #206cb1; + text-decoration: none; } + a:hover { + text-decoration: underline; + color: #185286; } -a:hover { - text-decoration:underline; - color:#185286; -} - ul, ol { - margin: 0 0 9px 25px; -} + margin: 0 0 9px 25px; } ul ul, ol ol { - margin-bottom:0; -} + margin-bottom: 0; } ul { - list-style:disc; -} + list-style: disc; } -ul li { -} - ol { - list-style:decimal; -} + list-style: decimal; } li { - line-height:1.6em; -} + font-size: 13px; + font-size: 1.3rem; + line-height: 16px; + line-height: 1.6rem; } /***************************** Utility Classes *****************************/ - .secondary { - font-size:1.1em; - color:#777; -} + font-size: 11px; + font-size: 1.1rem; + color: #777; } .underline { - border-bottom:1px solid #ccc; - padding-bottom:5px; -} + border-bottom: 1px solid #ccc; + padding-bottom: 5px; } /***************************** Forms *****************************/ - label { - display:block; - font-weight:bold; - line-height:1em; -} + display: block; + font-weight: bold; } + label.inline { + display: inline; } -label.inline { - display:inline; -} - fieldset { - margin-bottom:20px; -} + margin-bottom: 20px; } + fieldset ul { + margin-left: 0; + list-style: none; } + fieldset ul li { + margin-bottom: 10px; } + fieldset ul li label { + padding-bottom: 5px; } -fieldset > ul { - margin-left:0; - list-style:none; -} - -fieldset > ul > li { - margin-bottom:10px; -} - -fieldset > ul > li > label { - padding-bottom:5px; -} - input, textarea, select { - outline:none; -} + outline: none; } input, textarea { - padding:3px; - font-size:0.9em; -} + padding: 3px; + font-size: 13px; + font-size: 1.3rem; } input[type='text'], input[type='password'], textarea { border-radius: 2px; - border:1px solid #ccc; - padding:5px; -} + border: 1px solid #ccc; + padding: 5px; } + input[type='text']:focus, input[type='password']:focus, textarea:focus { + border-color: #8dabd4; } -input[type='text']:focus, input[type='password']:focus, textarea:focus { - border-color:#8dabd4; -} - input[type='submit'], input[type='button'], button, .button { - font:0.9em "Helvetica Neue", Helvetica, sans-serif; - color:#000; + font-family: "Helvetica Neue", Helvetica, sans-serif; + font-size: 13px; + font-size: 1.3rem; + color: #000; + cursor: pointer; + border-radius: 2px; + border: 1px solid #adadad; + padding: 6px 5px 5px; + background: #ffffff; + /* Old browsers */ + background: -moz-linear-gradient(top, white 0%, #f3f3f3 100%); + /* FF3.6+ */ + background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, white), color-stop(100%, #f3f3f3)); + /* Chrome,Safari4+ */ + background: -webkit-linear-gradient(top, white 0%, #f3f3f3 100%); + /* Chrome10+,Safari5.1+ */ + background: -o-linear-gradient(top, white 0%, #f3f3f3 100%); + /* Opera 11.10+ */ + background: -ms-linear-gradient(top, white 0%, #f3f3f3 100%); + /* IE10+ */ + background: linear-gradient(top, white 0%, #f3f3f3 100%); + /* W3C */ + filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff', endColorstr='#f3f3f3',GradientType=0 ); + /* IE6-9 */ } + input[type='submit']:hover, input[type='button']:hover, button:hover, .button:hover { + text-decoration: none; + background: -webkit-linear-gradient(top, white 0%, #f6f6f6 100%); + /* Chrome10+,Safari5.1+ */ + border-color: #ccc; + color: #777; } - cursor:pointer; - - border-radius:2px; - border:1px solid #adadad; - padding:6px 5px 5px; - - background: #ffffff; /* Old browsers */ - background: -moz-linear-gradient(top, #ffffff 0%, #f3f3f3 100%); /* FF3.6+ */ - background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#ffffff), color-stop(100%,#f3f3f3)); /* Chrome,Safari4+ */ - background: -webkit-linear-gradient(top, #ffffff 0%,#f3f3f3 100%); /* Chrome10+,Safari5.1+ */ - background: -o-linear-gradient(top, #ffffff 0%,#f3f3f3 100%); /* Opera 11.10+ */ - background: -ms-linear-gradient(top, #ffffff 0%,#f3f3f3 100%); /* IE10+ */ - background: linear-gradient(top, #ffffff 0%,#f3f3f3 100%); /* W3C */ - filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#f3f3f3',GradientType=0 ); /* IE6-9 */ -} - -input[type='submit']:hover, input[type='button']:hover, button:hover, .button:hover { - text-decoration:none; - background: -webkit-linear-gradient(top, #ffffff 0%,#f6f6f6 100%); /* Chrome10+,Safari5.1+ */ - border-color:#ccc; - color:#777; -} - input.error { - background:#FEFBFB; - border-color:#FBA8A4; -} + background: #FEFBFB; + border-color: #FBA8A4; } + input.error:focus { + border-color: #F4635D; } -input.error:focus { - border-color:#F4635D; -} - /***************************** Composable Styles *****************************/ - ul.horizontal, ol.horizontal { margin: 0; - display: inline; -} + display: inline; } + ul.horizontal li, ol.horizontal li { + display: inline; } -ul.horizontal li, ol.horizontal li { - display: inline; -} - ul.plain, ol.plain { margin: 5px; - padding: 0; -} - -ul.plain li, ol.plain li { - list-style: none; -} + padding: 0; } + ul.plain li, ol.plain li { + list-style: none; }