From: Harris Lapiroff Date: Mon, 25 Apr 2011 21:05:45 +0000 (-0400) Subject: Initial page stylings. X-Git-Url: http://git.ithinksw.org/philo.git/commitdiff_plain/78e68053e3f159e7e9882bc178b7392f1c3a8222 Initial page stylings. --- 78e68053e3f159e7e9882bc178b7392f1c3a8222 diff --git a/index.html b/index.html new file mode 100644 index 0000000..6997540 --- /dev/null +++ b/index.html @@ -0,0 +1,25 @@ + + + + + Philo + + + +

Philo

+ +

+ Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum. +

+ + +

+ + \ No newline at end of file diff --git a/static/config.rb b/static/config.rb new file mode 100644 index 0000000..9035954 --- /dev/null +++ b/static/config.rb @@ -0,0 +1,11 @@ +# Require any additional compass plugins here. +# Set this to the root of your project when deployed: +http_path = "" +css_dir = "css" +sass_dir = "scss" +images_dir = "img" +javascripts_dir = "js" +output_style = :nested +environment = :production +# To enable relative paths to assets via compass helper functions. Uncomment: +relative_assets = true \ No newline at end of file diff --git a/static/css/screen.css b/static/css/screen.css new file mode 100644 index 0000000..6eb28d0 --- /dev/null +++ b/static/css/screen.css @@ -0,0 +1,110 @@ +html, body, div, span, applet, object, iframe, +h1, h2, h3, h4, h5, h6, p, blockquote, pre, +a, abbr, acronym, address, big, cite, code, +del, dfn, em, img, ins, kbd, q, s, samp, +small, strike, strong, sub, sup, tt, var, +b, u, i, center, +dl, dt, dd, ol, ul, li, +fieldset, form, label, legend, +table, caption, tbody, tfoot, thead, tr, th, td, +article, aside, canvas, details, embed, +figure, figcaption, footer, header, hgroup, +menu, nav, output, ruby, section, summary, +time, mark, audio, video { + margin: 0; + padding: 0; + border: 0; + font-size: 100%; + font: inherit; + vertical-align: baseline; } + +body { + line-height: 1; } + +ol, ul { + list-style: none; } + +table { + border-collapse: collapse; + border-spacing: 0; } + +caption, th, td { + text-align: left; + font-weight: normal; + vertical-align: middle; } + +q, blockquote { + quotes: none; } + q:before, q:after, blockquote:before, blockquote:after { + content: ""; + content: none; } + +a img { + border: none; } + +article, aside, details, figcaption, figure, +footer, header, hgroup, menu, nav, section { + display: block; } + +article, aside, details, figcaption, figure, +footer, header, hgroup, menu, nav, section { + display: block; } + +blockquote, q { + quotes: none; } + blockquote:before, blockquote:after, q:before, q:after { + content: ""; + content: none; } + +html { + background: #2a486d; + height: 100%; } + +body { + background: url('../img/bg.png?1303763277'), -webkit-gradient(radial, 50% 50%, 0, 50% 50%, 900, color-stop(0%, rgba(0, 0, 0, 0)), color-stop(88.889%, rgba(0, 0, 0, 0.5)), color-stop(100%, rgba(0, 0, 0, 0.9))); + background: url('../img/bg.png?1303763277'), -webkit-radial-gradient(rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.5) 800px, rgba(0, 0, 0, 0.9) 900px); + background: url('../img/bg.png?1303763277'), -moz-radial-gradient(rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.5) 800px, rgba(0, 0, 0, 0.9) 900px); + background: url('../img/bg.png?1303763277'), -o-radial-gradient(rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.5) 800px, rgba(0, 0, 0, 0.9) 900px); + background: url('../img/bg.png?1303763277'), radial-gradient(rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.5) 800px, rgba(0, 0, 0, 0.9) 900px); + padding: 1px; + margin: -1px; + min-height: 100%; + font-family: Helvetica, Arial, sans-serif; + font-size: 13px; + line-height: 15px; } + +#container { + width: 920px; + margin: 40px auto; } + +#nameplate { + color: #FFF; + font-size: 80px; + line-height: 80px; + text-align: center; + text-shadow: 1px 1px 0 rgba(0, 0, 0, 0.6); } + +#content { + background: white; + -moz-border-radius: 4px; + -webkit-border-radius: 4px; + -o-border-radius: 4px; + -ms-border-radius: 4px; + -khtml-border-radius: 4px; + border-radius: 4px; + -moz-box-shadow: rgba(0, 0, 0, 0.35) 0 0 36px, rgba(0, 0, 0, 0.1) 0 10px 10px inset; + -webkit-box-shadow: rgba(0, 0, 0, 0.35) 0 0 36px, rgba(0, 0, 0, 0.1) 0 10px 10px inset; + -o-box-shadow: rgba(0, 0, 0, 0.35) 0 0 36px, rgba(0, 0, 0, 0.1) 0 10px 10px inset; + box-shadow: rgba(0, 0, 0, 0.35) 0 0 36px, rgba(0, 0, 0, 0.1) 0 10px 10px inset; + border: 1px solid white; + padding: 19px; + margin-top: 20px; } + +#pagefooter { + font-size: 12px; + color: #8faed4; + text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.5); + width: 600px; + margin: 20px auto; } + #pagefooter p { + margin-bottom: 15px; } diff --git a/static/img/bg.png b/static/img/bg.png new file mode 100644 index 0000000..01d78c1 Binary files /dev/null and b/static/img/bg.png differ diff --git a/static/scss/_reset.scss b/static/scss/_reset.scss new file mode 100644 index 0000000..bfe9f86 --- /dev/null +++ b/static/scss/_reset.scss @@ -0,0 +1,3 @@ +@import "compass/reset"; +@include reset-html5; +blockquote, q{ @include reset-quotation; } \ No newline at end of file diff --git a/static/scss/_var.scss b/static/scss/_var.scss new file mode 100644 index 0000000..c12069c --- /dev/null +++ b/static/scss/_var.scss @@ -0,0 +1,8 @@ +$bgcolor: #2A486D; +$bgcolor1: adjust-hue(lighten($bgcolor, 20%), 20deg); +$bgcolor2: darken($bgcolor, 20%); +$contentwidth: 900px; +$contentpadding: 19px; +$contentborderwidth: 1px; +$containerwidth: $contentwidth+$contentpadding+$contentborderwidth; +$contentbg: #FFF; \ No newline at end of file diff --git a/static/scss/screen.scss b/static/scss/screen.scss new file mode 100644 index 0000000..bfabe3d --- /dev/null +++ b/static/scss/screen.scss @@ -0,0 +1,56 @@ +@import "reset", + "var", + "compass/css3/images", + "compass/css3/border-radius", + "compass/css3/box-shadow"; + +html{ + background: $bgcolor; + height:100%; +} + +body{ + @include background( + image-url("bg.png"), + radial-gradient(rgba(0,0,0,0), rgba(0,0,0,.5) 800px, rgba(0,0,0,.9) 900px) + ); + padding:1px; + margin:-1px; + min-height:100%; + font-family:Helvetica, Arial, sans-serif; + font-size:13px; + line-height:15px; +} + +#container{ + width: $containerwidth; + margin:40px auto; +} + +#nameplate{ + color:#FFF; + font-size:80px; + line-height:80px; + text-align:center; + text-shadow:1px 1px 0 rgba(0,0,0,.6); +} + +#content{ + background:$contentbg; + @include border-radius(4px); + @include box-shadow(rgba(0,0,0,.35) 0 0 36px, rgba(0,0,0,.1) 0 10px 10px inset); + border:$contentborderwidth solid $contentbg; + padding:$contentpadding; + margin-top:20px; +} + +#pagefooter{ + font-size:12px; + color: lighten($bgcolor, 40%); + text-shadow:0 -1px 0 rgba(0,0,0,.5); + width:600px; + margin:20px auto; + p{ + margin-bottom:15px; + } +} \ No newline at end of file