diff options
Diffstat (limited to 'static/css/spc')
| -rw-r--r-- | static/css/spc/base.css | 733 | ||||
| -rw-r--r-- | static/css/spc/halloween.css | 248 | ||||
| -rw-r--r-- | static/css/spc/layout.css | 28 | ||||
| -rw-r--r-- | static/css/spc/material.css | 453 | ||||
| -rw-r--r-- | static/css/spc/material_normal.css | 493 | ||||
| -rw-r--r-- | static/css/spc/navidad.css | 180 | ||||
| -rw-r--r-- | static/css/spc/skeleton.css | 588 | ||||
| -rw-r--r-- | static/css/spc/valentin.css | 192 | ||||
| -rw-r--r-- | static/css/spc/valentin2.css | 194 |
9 files changed, 2194 insertions, 915 deletions
diff --git a/static/css/spc/base.css b/static/css/spc/base.css index bb30a24..5b908a4 100644 --- a/static/css/spc/base.css +++ b/static/css/spc/base.css @@ -7,7 +7,6 @@ * 6/20/2012 */ - /* Table of Content ================================================== #Reset & Basics @@ -21,249 +20,565 @@ #Forms #Misc */ - /* #Reset & Basics (Inspired by E. Meyers) ================================================== */ - 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; } - article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section { - display: block; } - body { - line-height: 1; } - ol, ul { - list-style: none; } - blockquote, q { - quotes: none; } - blockquote:before, blockquote:after, - q:before, q:after { - content: ''; - content: none; } - table { - border-collapse: collapse; - border-spacing: 0; } - +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; +} +article, +aside, +details, +figcaption, +figure, +footer, +header, +hgroup, +menu, +nav, +section { + display: block; +} +body { + line-height: 1; +} +ol, +ul { + list-style: none; +} +blockquote, +q { + quotes: none; +} +blockquote:before, +blockquote:after, +q:before, +q:after { + content: ""; + content: none; +} +table { + border-collapse: collapse; + border-spacing: 0; +} /* #Basic Styles ================================================== */ - body { - background: #fff; - font: 14px/21px "HelveticaNeue", "Helvetica Neue", Helvetica, Arial, sans-serif; - color: #444; - -webkit-font-smoothing: antialiased; /* Fix for webkit rendering */ - -webkit-text-size-adjust: 100%; - } - +body { + background: #fff; + font: 14px/21px "HelveticaNeue", "Helvetica Neue", Helvetica, Arial, + sans-serif; + color: #444; + -webkit-font-smoothing: antialiased; /* Fix for webkit rendering */ + -webkit-text-size-adjust: 100%; +} /* #Typography ================================================== */ - h1, h2, h3, h4, h5, h6 { - color: #181818; - font-family: "Georgia", "Times New Roman", serif; - font-weight: normal; } - h1 a, h2 a, h3 a, h4 a, h5 a, h6 a { font-weight: inherit; } - h1 { font-size: 46px; line-height: 50px; margin-bottom: 14px;} - h2 { font-size: 35px; line-height: 40px; margin-bottom: 10px; } - h3 { font-size: 28px; line-height: 34px; margin-bottom: 8px; } - h4 { font-size: 21px; line-height: 30px; margin-bottom: 4px; } - h5 { font-size: 17px; line-height: 24px; } - h6 { font-size: 14px; line-height: 21px; } - .subheader { color: #777; } +h1, +h2, +h3, +h4, +h5, +h6 { + color: #181818; + font-family: "Georgia", "Times New Roman", serif; + font-weight: normal; +} +h1 a, +h2 a, +h3 a, +h4 a, +h5 a, +h6 a { + font-weight: inherit; +} +h1 { + font-size: 46px; + line-height: 50px; + margin-bottom: 14px; +} +h2 { + font-size: 35px; + line-height: 40px; + margin-bottom: 10px; +} +h3 { + font-size: 28px; + line-height: 34px; + margin-bottom: 8px; +} +h4 { + font-size: 21px; + line-height: 30px; + margin-bottom: 4px; +} +h5 { + font-size: 17px; + line-height: 24px; +} +h6 { + font-size: 14px; + line-height: 21px; +} +.subheader { + color: #777; +} - p { margin: 0 0 20px 0; } - p img { margin: 0; } - p.lead { font-size: 21px; line-height: 27px; color: #777; } +p { + margin: 0 0 20px 0; +} +p img { + margin: 0; +} +p.lead { + font-size: 21px; + line-height: 27px; + color: #777; +} - em { font-style: italic; } - strong { font-weight: bold; color: #333; } - small { font-size: 60%; } +em { + font-style: italic; +} +strong { + font-weight: bold; + color: #333; +} +small { + font-size: 60%; +} /* Blockquotes */ - blockquote, blockquote p { font-size: 17px; line-height: 24px; color: #777; font-style: italic; } - blockquote { margin: 0 0 20px; padding: 9px 20px 0 19px; border-left: 1px solid #ddd; } - blockquote cite { display: block; font-size: 12px; color: #555; } - blockquote cite:before { content: "\2014 \0020"; } - blockquote cite a, blockquote cite a:visited, blockquote cite a:visited { color: #555; } - - hr { border: solid #ccc; border-width: 1px 0 0; clear: both; margin: 30px 0 30px; height: 0; } +blockquote, +blockquote p { + font-size: 17px; + line-height: 24px; + color: #777; + font-style: italic; +} +blockquote { + margin: 0 0 20px; + padding: 9px 20px 0 19px; + border-left: 1px solid #ddd; +} +blockquote cite { + display: block; + font-size: 12px; + color: #555; +} +blockquote cite:before { + content: "\2014 \0020"; +} +blockquote cite a, +blockquote cite a:visited, +blockquote cite a:visited { + color: #555; +} +hr { + border: solid #ccc; + border-width: 1px 0 0; + clear: both; + margin: 30px 0 30px; + height: 0; +} /* #Links ================================================== */ - a, a:visited { color: #333; text-decoration: underline; outline: 0; } - a:hover, a:focus { color: #000; } - p a, p a:visited { line-height: inherit; } - +a, +a:visited { + color: #333; + text-decoration: underline; + outline: 0; +} +a:hover, +a:focus { + color: #000; +} +p a, +p a:visited { + line-height: inherit; +} /* #Lists ================================================== */ - ul, ol { margin-bottom: 20px; } - ul { list-style: none outside; } - ol { list-style: decimal; } - ol, ul.square, ul.circle, ul.disc { margin-left: 30px; } - ul.square { list-style: square outside; } - ul.circle { list-style: circle outside; } - ul.disc { list-style: disc outside; } - ul ul, ul ol, - ol ol, ol ul { margin: 4px 0 5px 30px; font-size: 90%; } - ul ul li, ul ol li, - ol ol li, ol ul li { margin-bottom: 6px; } - li { line-height: 18px; margin-bottom: 12px; } - ul.large li { line-height: 21px; } - li p { line-height: 21px; } +ul, +ol { + margin-bottom: 20px; +} +ul { + list-style: none outside; +} +ol { + list-style: decimal; +} +ol, +ul.square, +ul.circle, +ul.disc { + margin-left: 30px; +} +ul.square { + list-style: square outside; +} +ul.circle { + list-style: circle outside; +} +ul.disc { + list-style: disc outside; +} +ul ul, +ul ol, +ol ol, +ol ul { + margin: 4px 0 5px 30px; + font-size: 90%; +} +ul ul li, +ul ol li, +ol ol li, +ol ul li { + margin-bottom: 6px; +} +li { + line-height: 18px; + margin-bottom: 12px; +} +ul.large li { + line-height: 21px; +} +li p { + line-height: 21px; +} /* #Images ================================================== */ - img.scale-with-grid { - max-width: 100%; - height: auto; } - +img.scale-with-grid { + max-width: 100%; + height: auto; +} /* #Buttons ================================================== */ - .button, - button, - input[type="submit"], - input[type="reset"], - input[type="button"] { - background: #eee; /* Old browsers */ - background: #eee -moz-linear-gradient(top, rgba(255,255,255,.2) 0%, rgba(0,0,0,.2) 100%); /* FF3.6+ */ - background: #eee -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(255,255,255,.2)), color-stop(100%,rgba(0,0,0,.2))); /* Chrome,Safari4+ */ - background: #eee -webkit-linear-gradient(top, rgba(255,255,255,.2) 0%,rgba(0,0,0,.2) 100%); /* Chrome10+,Safari5.1+ */ - background: #eee -o-linear-gradient(top, rgba(255,255,255,.2) 0%,rgba(0,0,0,.2) 100%); /* Opera11.10+ */ - background: #eee -ms-linear-gradient(top, rgba(255,255,255,.2) 0%,rgba(0,0,0,.2) 100%); /* IE10+ */ - background: #eee linear-gradient(top, rgba(255,255,255,.2) 0%,rgba(0,0,0,.2) 100%); /* W3C */ - border: 1px solid #aaa; - border-top: 1px solid #ccc; - border-left: 1px solid #ccc; - -moz-border-radius: 3px; - -webkit-border-radius: 3px; - border-radius: 3px; - color: #444; - display: inline-block; - font-size: 11px; - font-weight: bold; - text-decoration: none; - text-shadow: 0 1px rgba(255, 255, 255, .75); - cursor: pointer; - margin-bottom: 20px; - line-height: normal; - padding: 8px 10px; - font-family: "HelveticaNeue", "Helvetica Neue", Helvetica, Arial, sans-serif; } - - .button:hover, - button:hover, - input[type="submit"]:hover, - input[type="reset"]:hover, - input[type="button"]:hover { - color: #222; - background: #ddd; /* Old browsers */ - background: #ddd -moz-linear-gradient(top, rgba(255,255,255,.3) 0%, rgba(0,0,0,.3) 100%); /* FF3.6+ */ - background: #ddd -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(255,255,255,.3)), color-stop(100%,rgba(0,0,0,.3))); /* Chrome,Safari4+ */ - background: #ddd -webkit-linear-gradient(top, rgba(255,255,255,.3) 0%,rgba(0,0,0,.3) 100%); /* Chrome10+,Safari5.1+ */ - background: #ddd -o-linear-gradient(top, rgba(255,255,255,.3) 0%,rgba(0,0,0,.3) 100%); /* Opera11.10+ */ - background: #ddd -ms-linear-gradient(top, rgba(255,255,255,.3) 0%,rgba(0,0,0,.3) 100%); /* IE10+ */ - background: #ddd linear-gradient(top, rgba(255,255,255,.3) 0%,rgba(0,0,0,.3) 100%); /* W3C */ - border: 1px solid #888; - border-top: 1px solid #aaa; - border-left: 1px solid #aaa; } +.button, +button, +input[type="submit"], +input[type="reset"], +input[type="button"] { + background: #eee; /* Old browsers */ + background: #eee -moz-linear-gradient(top, rgba(255, 255, 255, 0.2) 0%, rgba( + 0, + 0, + 0, + 0.2 + ) + 100%); /* FF3.6+ */ + background: #eee -webkit-gradient(linear, left top, left bottom, color-stop(0%, rgba(255, 255, 255, 0.2)), color-stop(100%, rgba(0, 0, 0, 0.2))); /* Chrome,Safari4+ */ + background: #eee -webkit-linear-gradient(top, rgba(255, 255, 255, 0.2) 0%, rgba( + 0, + 0, + 0, + 0.2 + ) + 100%); /* Chrome10+,Safari5.1+ */ + background: #eee -o-linear-gradient(top, rgba(255, 255, 255, 0.2) 0%, rgba( + 0, + 0, + 0, + 0.2 + ) + 100%); /* Opera11.10+ */ + background: #eee -ms-linear-gradient(top, rgba(255, 255, 255, 0.2) 0%, rgba( + 0, + 0, + 0, + 0.2 + ) + 100%); /* IE10+ */ + background: #eee + linear-gradient(top, rgba(255, 255, 255, 0.2) 0%, rgba(0, 0, 0, 0.2) 100%); /* W3C */ + border: 1px solid #aaa; + border-top: 1px solid #ccc; + border-left: 1px solid #ccc; + -moz-border-radius: 3px; + -webkit-border-radius: 3px; + border-radius: 3px; + color: #444; + display: inline-block; + font-size: 11px; + font-weight: bold; + text-decoration: none; + text-shadow: 0 1px rgba(255, 255, 255, 0.75); + cursor: pointer; + margin-bottom: 20px; + line-height: normal; + padding: 8px 10px; + font-family: "HelveticaNeue", "Helvetica Neue", Helvetica, Arial, sans-serif; +} - .button:active, - button:active, - input[type="submit"]:active, - input[type="reset"]:active, - input[type="button"]:active { - border: 1px solid #666; - background: #ccc; /* Old browsers */ - background: #ccc -moz-linear-gradient(top, rgba(255,255,255,.35) 0%, rgba(10,10,10,.4) 100%); /* FF3.6+ */ - background: #ccc -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(255,255,255,.35)), color-stop(100%,rgba(10,10,10,.4))); /* Chrome,Safari4+ */ - background: #ccc -webkit-linear-gradient(top, rgba(255,255,255,.35) 0%,rgba(10,10,10,.4) 100%); /* Chrome10+,Safari5.1+ */ - background: #ccc -o-linear-gradient(top, rgba(255,255,255,.35) 0%,rgba(10,10,10,.4) 100%); /* Opera11.10+ */ - background: #ccc -ms-linear-gradient(top, rgba(255,255,255,.35) 0%,rgba(10,10,10,.4) 100%); /* IE10+ */ - background: #ccc linear-gradient(top, rgba(255,255,255,.35) 0%,rgba(10,10,10,.4) 100%); /* W3C */ } +.button:hover, +button:hover, +input[type="submit"]:hover, +input[type="reset"]:hover, +input[type="button"]:hover { + color: #222; + background: #ddd; /* Old browsers */ + background: #ddd -moz-linear-gradient(top, rgba(255, 255, 255, 0.3) 0%, rgba( + 0, + 0, + 0, + 0.3 + ) + 100%); /* FF3.6+ */ + background: #ddd -webkit-gradient(linear, left top, left bottom, color-stop(0%, rgba(255, 255, 255, 0.3)), color-stop(100%, rgba(0, 0, 0, 0.3))); /* Chrome,Safari4+ */ + background: #ddd -webkit-linear-gradient(top, rgba(255, 255, 255, 0.3) 0%, rgba( + 0, + 0, + 0, + 0.3 + ) + 100%); /* Chrome10+,Safari5.1+ */ + background: #ddd -o-linear-gradient(top, rgba(255, 255, 255, 0.3) 0%, rgba( + 0, + 0, + 0, + 0.3 + ) + 100%); /* Opera11.10+ */ + background: #ddd -ms-linear-gradient(top, rgba(255, 255, 255, 0.3) 0%, rgba( + 0, + 0, + 0, + 0.3 + ) + 100%); /* IE10+ */ + background: #ddd + linear-gradient(top, rgba(255, 255, 255, 0.3) 0%, rgba(0, 0, 0, 0.3) 100%); /* W3C */ + border: 1px solid #888; + border-top: 1px solid #aaa; + border-left: 1px solid #aaa; +} - .button.full-width, - button.full-width, - input[type="submit"].full-width, - input[type="reset"].full-width, - input[type="button"].full-width { - width: 100%; - padding-left: 0 !important; - padding-right: 0 !important; - text-align: center; } +.button:active, +button:active, +input[type="submit"]:active, +input[type="reset"]:active, +input[type="button"]:active { + border: 1px solid #666; + background: #ccc; /* Old browsers */ + background: #ccc -moz-linear-gradient(top, rgba(255, 255, 255, 0.35) 0%, rgba( + 10, + 10, + 10, + 0.4 + ) + 100%); /* FF3.6+ */ + background: #ccc -webkit-gradient(linear, left top, left bottom, color-stop(0%, rgba(255, 255, 255, 0.35)), color-stop(100%, rgba(10, 10, 10, 0.4))); /* Chrome,Safari4+ */ + background: #ccc -webkit-linear-gradient(top, rgba(255, 255, 255, 0.35) 0%, rgba( + 10, + 10, + 10, + 0.4 + ) + 100%); /* Chrome10+,Safari5.1+ */ + background: #ccc -o-linear-gradient(top, rgba(255, 255, 255, 0.35) 0%, rgba( + 10, + 10, + 10, + 0.4 + ) + 100%); /* Opera11.10+ */ + background: #ccc -ms-linear-gradient(top, rgba(255, 255, 255, 0.35) 0%, rgba( + 10, + 10, + 10, + 0.4 + ) + 100%); /* IE10+ */ + background: #ccc + linear-gradient( + top, + rgba(255, 255, 255, 0.35) 0%, + rgba(10, 10, 10, 0.4) 100% + ); /* W3C */ +} - /* Fix for odd Mozilla border & padding issues */ - button::-moz-focus-inner, - input::-moz-focus-inner { - border: 0; - padding: 0; - } +.button.full-width, +button.full-width, +input[type="submit"].full-width, +input[type="reset"].full-width, +input[type="button"].full-width { + width: 100%; + padding-left: 0 !important; + padding-right: 0 !important; + text-align: center; +} +/* Fix for odd Mozilla border & padding issues */ +button::-moz-focus-inner, +input::-moz-focus-inner { + border: 0; + padding: 0; +} /* #Forms ================================================== */ - form { - margin-bottom: 20px; } - fieldset { - margin-bottom: 20px; } - input[type="text"], - input[type="password"], - input[type="email"], - textarea, - select { - border: 1px solid #ccc; - padding: 6px 4px; - outline: none; - -moz-border-radius: 2px; - -webkit-border-radius: 2px; - border-radius: 2px; - font: 13px "HelveticaNeue", "Helvetica Neue", Helvetica, Arial, sans-serif; - color: #777; - margin: 0; - width: 210px; - max-width: 100%; - display: block; - margin-bottom: 20px; - background: #fff; } - select { - padding: 0; } - input[type="text"]:focus, - input[type="password"]:focus, - input[type="email"]:focus, - textarea:focus { - border: 1px solid #aaa; - color: #444; - -moz-box-shadow: 0 0 3px rgba(0,0,0,.2); - -webkit-box-shadow: 0 0 3px rgba(0,0,0,.2); - box-shadow: 0 0 3px rgba(0,0,0,.2); } - textarea { - min-height: 60px; } - label, - legend { - display: block; - font-weight: bold; - font-size: 13px; } - select { - width: 220px; } - input[type="checkbox"] { - display: inline; } - label span, - legend span { - font-weight: normal; - font-size: 13px; - color: #444; } +form { + margin-bottom: 20px; +} +fieldset { + margin-bottom: 20px; +} +input[type="text"], +input[type="password"], +input[type="email"], +textarea, +select { + border: 1px solid #ccc; + padding: 6px 4px; + outline: none; + -moz-border-radius: 2px; + -webkit-border-radius: 2px; + border-radius: 2px; + font: 13px "HelveticaNeue", "Helvetica Neue", Helvetica, Arial, sans-serif; + color: #777; + margin: 0; + width: 210px; + max-width: 100%; + display: block; + margin-bottom: 20px; + background: #fff; +} +select { + padding: 0; +} +input[type="text"]:focus, +input[type="password"]:focus, +input[type="email"]:focus, +textarea:focus { + border: 1px solid #aaa; + color: #444; + -moz-box-shadow: 0 0 3px rgba(0, 0, 0, 0.2); + -webkit-box-shadow: 0 0 3px rgba(0, 0, 0, 0.2); + box-shadow: 0 0 3px rgba(0, 0, 0, 0.2); +} +textarea { + min-height: 60px; +} +label, +legend { + display: block; + font-weight: bold; + font-size: 13px; +} +select { + width: 220px; +} +input[type="checkbox"] { + display: inline; +} +label span, +legend span { + font-weight: normal; + font-size: 13px; + color: #444; +} /* #Misc ================================================== */ - .remove-bottom { margin-bottom: 0 !important; } - .half-bottom { margin-bottom: 10px !important; } - .add-bottom { margin-bottom: 20px !important; } - - +.remove-bottom { + margin-bottom: 0 !important; +} +.half-bottom { + margin-bottom: 10px !important; +} +.add-bottom { + margin-bottom: 20px !important; +} diff --git a/static/css/spc/halloween.css b/static/css/spc/halloween.css index 6870152..95cc9bb 100644 --- a/static/css/spc/halloween.css +++ b/static/css/spc/halloween.css @@ -1,47 +1,201 @@ -body,textarea,h2 small,.del a{color:#FA5923} -body.mainpage,body.threads{background:#000 url('../img/bg_madera.png');} -body.threadpage{background:#111} -a,#n2{color:#F00} -a:active,a:active .name,#n2:active{color:#f60} -hr{border:0;border-top:1px solid #900;border-bottom: 1px solid #500000} -input[type=submit]:active,input[type=button]:active,a:active{filter:blur(2px)} -h1{text-shadow:0 4px 1px #300000,0 6px 1px #400000,0 8px 1px #500000,0 10px 1px #600000,0 12px 1px #700000,0 14px 1px #800000,0 16px 1px #900000,0 18px 1px #A00000,0 20px 1px #B00000,0 22px 1px #C00000,0 24px 1px #D00000,0 26px 1px #E00000,0 28px 1px #F00000,0 30px 1px #FA0000,0 32px 1px #FB0000,0 34px 1px #FC0000,0 36px 1px #FD0000,0 38px 1px #FE0000,0 40px 2px #F00} -.threads h1{margin-bottom:35px} -h2{margin-bottom:3px} -h2 a{color:#32cd32} -h3{color:#F00} -h3 span{color:#900} -#main_nav{background:#000} -.outerbox{background:#000;border:1px outset #FF4500;color:#FFA500} -.innerbox{border:1px inset #FF4500} -#threadlist{background:#330e00;border:1px inset #FF4500} -.mainpage .thread,#content{background:#111;border:1px outset #914400} -.name,a .name,.abbrev{color:#f90} -.name em{color:#111e6c} -.msg{color:#fa6a39;margin:4px 40px 24px} -a.thumb{margin-top:4px} -.q{color:#875384} -.yt{background:#240000;border:1px solid #FF4500} -.deleted{color:#592a56;margin-bottom:24px} -.outerbox input,.outerbox textarea{background:#222;color:#FFA500;border:1px solid #FF4500} -.outerbox input:focus,.outerbox textarea:focus{background:#401100} -.outerbox input[type=submit],.outerbox input[type=button]{background:#000;box-shadow:0 0 5px #FF4500} -.threadpage input,.threadpage textarea,.thread input,.thread textarea{background:#0C050D;border:1px solid #FA5923;color:#FA5923} -.threadpage input:focus,.threadpage textarea:focus,.thread input:focus,.thread textarea:focus{background:#290c0a} -.threadpage input[type=submit],.threadpage input[type=button],.thread input[type=submit],.thread input[type=button]{background:#0C050D} -#q-p{background:#160901;border:1px solid #521;box-shadow:0 0 5px #521} -#q-p .msg,#q-p a.thumb{margin-bottom:8px} -#createbox{display:flex} -#createbox .extrabox{border:1px inset grey;margin:7px 0 7px 7px;float:left;width:40px;height:auto;flex:0 1 40px;-webkit-flex:0 1 40px} -#createbox .innerbox{flex:0 1 100%;-webkit-flex:0 1 100%} -form .msg{border:1px dotted #FA5923;background:#000} -#footer{text-shadow:0 0 2px} -#content.list{padding:7px} -#content.list #header div{background:#2d0000;border-top:1px inset #914400} -#content.list .row:nth-child(odd),#content.grid .row:hover{background:#000} -#content.list .row div:first-child{border-left:1px inset #914400} -#content.list .row div:last-child{border-right:1px inset #914400} -#content.list .row:last-child div{border-bottom:1px inset #914400} -#content.grid{border:1px outset #914400;padding:1px} -#content.grid .row{border:1px inset #914400;margin:1px} -@media screen and (max-width:480px){.msg{margin:4px 20px 12px}}
\ No newline at end of file +body, +textarea, +h2 small, +.del a { + color: #fa5923; +} +body.mainpage, +body.threads { + background: #000 url("../img/bg_madera.png"); +} +body.threadpage { + background: #111; +} +a, +#n2 { + color: #f00; +} +a:active, +a:active .name, +#n2:active { + color: #f60; +} +hr { + border: 0; + border-top: 1px solid #900; + border-bottom: 1px solid #500000; +} +input[type="submit"]:active, +input[type="button"]:active, +a:active { + filter: blur(2px); +} +h1 { + text-shadow: 0 4px 1px #300000, 0 6px 1px #400000, 0 8px 1px #500000, + 0 10px 1px #600000, 0 12px 1px #700000, 0 14px 1px #800000, + 0 16px 1px #900000, 0 18px 1px #a00000, 0 20px 1px #b00000, + 0 22px 1px #c00000, 0 24px 1px #d00000, 0 26px 1px #e00000, + 0 28px 1px #f00000, 0 30px 1px #fa0000, 0 32px 1px #fb0000, + 0 34px 1px #fc0000, 0 36px 1px #fd0000, 0 38px 1px #fe0000, 0 40px 2px #f00; +} +.threads h1 { + margin-bottom: 35px; +} +h2 { + margin-bottom: 3px; +} +h2 a { + color: #32cd32; +} +h3 { + color: #f00; +} +h3 span { + color: #900; +} +#main_nav { + background: #000; +} +.outerbox { + background: #000; + border: 1px outset #ff4500; + color: #ffa500; +} +.innerbox { + border: 1px inset #ff4500; +} +#threadlist { + background: #330e00; + border: 1px inset #ff4500; +} +.mainpage .thread, +#content { + background: #111; + border: 1px outset #914400; +} +.name, +a .name, +.abbrev { + color: #f90; +} +.name em { + color: #111e6c; +} +.msg { + color: #fa6a39; + margin: 4px 40px 24px; +} +a.thumb { + margin-top: 4px; +} +.q { + color: #875384; +} +.yt { + background: #240000; + border: 1px solid #ff4500; +} +.deleted { + color: #592a56; + margin-bottom: 24px; +} +.outerbox input, +.outerbox textarea { + background: #222; + color: #ffa500; + border: 1px solid #ff4500; +} +.outerbox input:focus, +.outerbox textarea:focus { + background: #401100; +} +.outerbox input[type="submit"], +.outerbox input[type="button"] { + background: #000; + box-shadow: 0 0 5px #ff4500; +} +.threadpage input, +.threadpage textarea, +.thread input, +.thread textarea { + background: #0c050d; + border: 1px solid #fa5923; + color: #fa5923; +} +.threadpage input:focus, +.threadpage textarea:focus, +.thread input:focus, +.thread textarea:focus { + background: #290c0a; +} +.threadpage input[type="submit"], +.threadpage input[type="button"], +.thread input[type="submit"], +.thread input[type="button"] { + background: #0c050d; +} +#q-p { + background: #160901; + border: 1px solid #521; + box-shadow: 0 0 5px #521; +} +#q-p .msg, +#q-p a.thumb { + margin-bottom: 8px; +} +#createbox { + display: flex; +} +#createbox .extrabox { + border: 1px inset grey; + margin: 7px 0 7px 7px; + float: left; + width: 40px; + height: auto; + flex: 0 1 40px; + -webkit-flex: 0 1 40px; +} +#createbox .innerbox { + flex: 0 1 100%; + -webkit-flex: 0 1 100%; +} +form .msg { + border: 1px dotted #fa5923; + background: #000; +} +#footer { + text-shadow: 0 0 2px; +} +#content.list { + padding: 7px; +} +#content.list #header div { + background: #2d0000; + border-top: 1px inset #914400; +} +#content.list .row:nth-child(odd), +#content.grid .row:hover { + background: #000; +} +#content.list .row div:first-child { + border-left: 1px inset #914400; +} +#content.list .row div:last-child { + border-right: 1px inset #914400; +} +#content.list .row:last-child div { + border-bottom: 1px inset #914400; +} +#content.grid { + border: 1px outset #914400; + padding: 1px; +} +#content.grid .row { + border: 1px inset #914400; + margin: 1px; +} +@media screen and (max-width: 480px) { + .msg { + margin: 4px 20px 12px; + } +} diff --git a/static/css/spc/layout.css b/static/css/spc/layout.css index b99f451..ed0b6b5 100644 --- a/static/css/spc/layout.css +++ b/static/css/spc/layout.css @@ -23,21 +23,25 @@ /* #Media Queries ================================================== */ - /* Smaller than standard 960 (devices and browsers) */ - @media only screen and (max-width: 959px) {} +/* Smaller than standard 960 (devices and browsers) */ +@media only screen and (max-width: 959px) { +} - /* Tablet Portrait size to standard 960 (devices and browsers) */ - @media only screen and (min-width: 768px) and (max-width: 959px) {} +/* Tablet Portrait size to standard 960 (devices and browsers) */ +@media only screen and (min-width: 768px) and (max-width: 959px) { +} - /* All Mobile Sizes (devices and browser) */ - @media only screen and (max-width: 767px) {} +/* All Mobile Sizes (devices and browser) */ +@media only screen and (max-width: 767px) { +} - /* Mobile Landscape Size to Tablet Portrait (devices and browsers) */ - @media only screen and (min-width: 480px) and (max-width: 767px) {} - - /* Mobile Portrait Size to Mobile Landscape Size (devices and browsers) */ - @media only screen and (max-width: 479px) {} +/* Mobile Landscape Size to Tablet Portrait (devices and browsers) */ +@media only screen and (min-width: 480px) and (max-width: 767px) { +} +/* Mobile Portrait Size to Mobile Landscape Size (devices and browsers) */ +@media only screen and (max-width: 479px) { +} /* #Font-Face ================================================== */ @@ -55,4 +59,4 @@ url('../fonts/FontName.svg#webfontZam02nTh') format('svg'); font-weight: normal; font-style: normal; } -*/
\ No newline at end of file +*/ diff --git a/static/css/spc/material.css b/static/css/spc/material.css index ac3051c..3e6b57b 100644 --- a/static/css/spc/material.css +++ b/static/css/spc/material.css @@ -1,75 +1,378 @@ -body,textarea{color:#111} -body{background:#f5f5f5} -a,#n2{color:#00F;text-decoration:none} -a:active,a:active .name,#n2:active{color:#f00} -.msg a{color:#111;text-decoration:underline} -.msg a:hover{color:#438ac1} -h1{font-size:30px;margin:0;background:#1a2357;margin:-7px -7px 16px;padding:16px;font-variant:small-caps;box-shadow:0 2px 10px #000} -h2{margin-bottom:.5em} -h2 a{color:#616161} -h3{border-bottom:1px solid #CCC;color:#4b01d1;font-weight:bold;margin:0 0 8px;padding-bottom:8px;text-align:center} -h3 span{display:block;font-size:smaller;font-weight:normal;opacity:.7} -h4{font-size:12px} -.date,h2 span,.threadnav,hr,#size,.banner,.threadpage .postform br{display:none} -#main_nav{background:#4b01d1;font-size:1px;font-size:0;position:relative;z-index:9} -#thread_nav{background:#303F9F;margin:-8px -8px -100px;padding:16px 0 116px;text-align:center} -#main_nav a,#thread_nav a{background:#FFF;border-radius:2px;color:#000;display:inline-block;font-size:14px;margin:0 2px;padding:2px} -#main_nav a:hover,.threadlinks a:hover,#thread_nav a:hover{background:#DDD} -#titlebox a,#threadbox a{color:#FFF} -#titlebox,#createbox,#footer,.end{background:#303F9F;color:#FFF;margin:0} -#rules,#search{margin:1em 1em 0} -#threadbox{background:rgb(63, 81, 181);color:#FFF;margin:0 0 -150px;padding-bottom:150px} -#threadbox .innerbox:after{content:'';box-shadow:0 0 20px 25px #3f51b5;display:block;position:relative;z-index:9} -#threadlinks{text-transform:uppercase} -#threadlist{overflow-y:hidden} -#threadlist a{background:#FFF;border-bottom:1px solid #182050;border-radius:5px;color:#303F9F;display:inline-block;padding:3px;margin:3px} -.innerbox,.threadpage .threadlinks{margin:0} -.thread,.outerbox,#content{background:#FFF;margin:2em 7%} -.thread,#content,.threadpage .postform{box-shadow:0px 2px 2px 0px rgba(0,0,0,.14),0px 3px 1px -2px rgba(0,0,0,.2),0px 1px 5px 0px rgba(0,0,0,.12);} -.thread .innerbox{background:#FFF;margin:0;padding:16px} -.mainpage .thread{margin:2em 7%} -.threadpage .thread{max-width:600px;margin:0 auto;padding:1em} -.threadpage .postform{max-width:800px;margin:0 auto;padding:1em;text-align:center} -.threadpage .postform>span,.threadpage textarea{display:block;margin:.5em 0 0} -input[type="submit"],input[type="button"],button,.lastposts a,#n2{background:#2296f3;border:0;border-radius:5px;box-shadow:0 2px 5px rgba(0,0,0,.12);color:#FFF;text-transform:uppercase;padding:8px} -input[type="submit"]:active,input[type="button"]:active,button:active{background:#438ac1} -input[type="text"],textarea,#search input[type="text"]{border:1px solid #CCC;border-radius:2px;padding:8px;} -textarea{margin:.5em 0;width:100%} -select{border-radius:2px;background:#2296f3 url(data:image/gif;base64,iVBORw0KGgoAAAANSUhEUgAAAAUAAAADCAYAAABbNsX4AAAABmJLR0QAAAAAAAD5Q7t/AAAACXBIWXMAAC4jAAAuIwF4pT92AAAAB3RJTUUH4wQBBAYpAtmVHwAAABl0RVh0Q29tbWVudABDcmVhdGVkIHdpdGggR0lNUFeBDhcAAAAfSURBVAjXY/z///9/BjTAyMDAwIAswcjIyAiXRZYAAKlrC/sti8JVAAAAAElFTkSuQmCC) no-repeat 95%;border:0;padding:0;color:#FFF;appearance:none;-webkit-appearance:none;-moz-appearance:none;} -.num,.del{float:right} -.name{background:#FFF;float:left;margin-right:-20px;position:relative;z-index:9} -a .name,.name,.abbrev{color:#2296f3} -.name:after{content:' dijo';color:#FF4081;font-style:italic;text-decoration:none} -.name em{color:#009} -.del{margin-right:4px} -.del a{color:#000} -.reply{margin-bottom:.5em} -.msg{margin:.5em 0 0 40px} -a.thumb{margin-top:4px} -.q{color:#666} -a.yt{background:#FFF;border:1px solid #CCC;box-shadow:0 4px 10px -4px #CCC;color:#444;text-decoration:none} -a.yt,.yt .pvw{border-radius:10px} -.deleted{color:#AFAFAF;margin-bottom:24px} -#q-p{background:#EFEFEF;border:1px solid #999} -#q-p .reply{margin-bottom:8px} -.lastposts{padding:16px 0;font-size:1px;font-size:0;text-align:center} -.lastposts a,.lastposts #n2{background:#ff4081;margin:0 5px;text-decoration:none} -#counter{background:#2296f3;border-radius:100%;box-shadow:0 2px 5px rgba(0,0,0,.12)} -.lastposts a,#n2,#counter{color:#FFF;display:inline-block;font-size:16px;padding:5px} -.mainpage .postform,.formpad{padding-left:0} -.mainpage .postform{margin:1em -1em -1em;padding:1em} -.postform{background:#EEE;color:#666} -.threadlinks a{background:#FFF;border-radius:.2em;color:#00BCD4;display:inline-block;font-size:smaller;margin-right:.2em;padding:.2em;text-transform:uppercase} -form .msg{border:1px dotted #000;background:#DDD} -h5{font-variant:small-caps;text-align:center} -#createbox{padding-top:1em} -#createbox .innerbox{padding:0} -#createbox table{margin:0 auto} -#footer{padding:1em} -#footer a{color:#FFF} -.end{margin:-100px -8px -8px;padding:116px 0 16px;position:relative;text-align:center;z-index:-1} -#content .thread{background:none;box-shadow:none} -#content.list #header div{background:#FFF;border-bottom:1px solid #CCC} -#content .row:hover{background:#EEE} -#content.list .row div{border-bottom:1px solid #EEE} -#content.grid .row{border:1px solid #EEE;margin:0}
\ No newline at end of file +body, +textarea { + color: #111; +} +body { + background: #f5f5f5; +} +a, +#n2 { + color: #00f; + text-decoration: none; +} +a:active, +a:active .name, +#n2:active { + color: #f00; +} +.msg a { + color: #111; + text-decoration: underline; +} +.msg a:hover { + color: #438ac1; +} +h1 { + font-size: 30px; + margin: 0; + background: #1a2357; + margin: -7px -7px 16px; + padding: 16px; + font-variant: small-caps; + box-shadow: 0 2px 10px #000; +} +h2 { + margin-bottom: 0.5em; +} +h2 a { + color: #616161; +} +h3 { + border-bottom: 1px solid #ccc; + color: #4b01d1; + font-weight: bold; + margin: 0 0 8px; + padding-bottom: 8px; + text-align: center; +} +h3 span { + display: block; + font-size: smaller; + font-weight: normal; + opacity: 0.7; +} +h4 { + font-size: 12px; +} +.date, +h2 span, +.threadnav, +hr, +#size, +.banner, +.threadpage .postform br { + display: none; +} +#main_nav { + background: #4b01d1; + font-size: 1px; + font-size: 0; + position: relative; + z-index: 9; +} +#thread_nav { + background: #303f9f; + margin: -8px -8px -100px; + padding: 16px 0 116px; + text-align: center; +} +#main_nav a, +#thread_nav a { + background: #fff; + border-radius: 2px; + color: #000; + display: inline-block; + font-size: 14px; + margin: 0 2px; + padding: 2px; +} +#main_nav a:hover, +.threadlinks a:hover, +#thread_nav a:hover { + background: #ddd; +} +#titlebox a, +#threadbox a { + color: #fff; +} +#titlebox, +#createbox, +#footer, +.end { + background: #303f9f; + color: #fff; + margin: 0; +} +#rules, +#search { + margin: 1em 1em 0; +} +#threadbox { + background: rgb(63, 81, 181); + color: #fff; + margin: 0 0 -150px; + padding-bottom: 150px; +} +#threadbox .innerbox:after { + content: ""; + box-shadow: 0 0 20px 25px #3f51b5; + display: block; + position: relative; + z-index: 9; +} +#threadlinks { + text-transform: uppercase; +} +#threadlist { + overflow-y: hidden; +} +#threadlist a { + background: #fff; + border-bottom: 1px solid #182050; + border-radius: 5px; + color: #303f9f; + display: inline-block; + padding: 3px; + margin: 3px; +} +.innerbox, +.threadpage .threadlinks { + margin: 0; +} +.thread, +.outerbox, +#content { + background: #fff; + margin: 2em 7%; +} +.thread, +#content, +.threadpage .postform { + box-shadow: 0px 2px 2px 0px rgba(0, 0, 0, 0.14), + 0px 3px 1px -2px rgba(0, 0, 0, 0.2), 0px 1px 5px 0px rgba(0, 0, 0, 0.12); +} +.thread .innerbox { + background: #fff; + margin: 0; + padding: 16px; +} +.mainpage .thread { + margin: 2em 7%; +} +.threadpage .thread { + max-width: 600px; + margin: 0 auto; + padding: 1em; +} +.threadpage .postform { + max-width: 800px; + margin: 0 auto; + padding: 1em; + text-align: center; +} +.threadpage .postform > span, +.threadpage textarea { + display: block; + margin: 0.5em 0 0; +} +input[type="submit"], +input[type="button"], +button, +.lastposts a, +#n2 { + background: #2296f3; + border: 0; + border-radius: 5px; + box-shadow: 0 2px 5px rgba(0, 0, 0, 0.12); + color: #fff; + text-transform: uppercase; + padding: 8px; +} +input[type="submit"]:active, +input[type="button"]:active, +button:active { + background: #438ac1; +} +input[type="text"], +textarea, +#search input[type="text"] { + border: 1px solid #ccc; + border-radius: 2px; + padding: 8px; +} +textarea { + margin: 0.5em 0; + width: 100%; +} +select { + border-radius: 2px; + background: #2296f3 + url(data:image/gif;base64,iVBORw0KGgoAAAANSUhEUgAAAAUAAAADCAYAAABbNsX4AAAABmJLR0QAAAAAAAD5Q7t/AAAACXBIWXMAAC4jAAAuIwF4pT92AAAAB3RJTUUH4wQBBAYpAtmVHwAAABl0RVh0Q29tbWVudABDcmVhdGVkIHdpdGggR0lNUFeBDhcAAAAfSURBVAjXY/z///9/BjTAyMDAwIAswcjIyAiXRZYAAKlrC/sti8JVAAAAAElFTkSuQmCC) + no-repeat 95%; + border: 0; + padding: 0; + color: #fff; + appearance: none; + -webkit-appearance: none; + -moz-appearance: none; +} +.num, +.del { + float: right; +} +.name { + background: #fff; + float: left; + margin-right: -20px; + position: relative; + z-index: 9; +} +a .name, +.name, +.abbrev { + color: #2296f3; +} +.name:after { + content: " dijo"; + color: #ff4081; + font-style: italic; + text-decoration: none; +} +.name em { + color: #009; +} +.del { + margin-right: 4px; +} +.del a { + color: #000; +} +.reply { + margin-bottom: 0.5em; +} +.msg { + margin: 0.5em 0 0 40px; +} +a.thumb { + margin-top: 4px; +} +.q { + color: #666; +} +a.yt { + background: #fff; + border: 1px solid #ccc; + box-shadow: 0 4px 10px -4px #ccc; + color: #444; + text-decoration: none; +} +a.yt, +.yt .pvw { + border-radius: 10px; +} +.deleted { + color: #afafaf; + margin-bottom: 24px; +} +#q-p { + background: #efefef; + border: 1px solid #999; +} +#q-p .reply { + margin-bottom: 8px; +} +.lastposts { + padding: 16px 0; + font-size: 1px; + font-size: 0; + text-align: center; +} +.lastposts a, +.lastposts #n2 { + background: #ff4081; + margin: 0 5px; + text-decoration: none; +} +#counter { + background: #2296f3; + border-radius: 100%; + box-shadow: 0 2px 5px rgba(0, 0, 0, 0.12); +} +.lastposts a, +#n2, +#counter { + color: #fff; + display: inline-block; + font-size: 16px; + padding: 5px; +} +.mainpage .postform, +.formpad { + padding-left: 0; +} +.mainpage .postform { + margin: 1em -1em -1em; + padding: 1em; +} +.postform { + background: #eee; + color: #666; +} +.threadlinks a { + background: #fff; + border-radius: 0.2em; + color: #00bcd4; + display: inline-block; + font-size: smaller; + margin-right: 0.2em; + padding: 0.2em; + text-transform: uppercase; +} +form .msg { + border: 1px dotted #000; + background: #ddd; +} +h5 { + font-variant: small-caps; + text-align: center; +} +#createbox { + padding-top: 1em; +} +#createbox .innerbox { + padding: 0; +} +#createbox table { + margin: 0 auto; +} +#footer { + padding: 1em; +} +#footer a { + color: #fff; +} +.end { + margin: -100px -8px -8px; + padding: 116px 0 16px; + position: relative; + text-align: center; + z-index: -1; +} +#content .thread { + background: none; + box-shadow: none; +} +#content.list #header div { + background: #fff; + border-bottom: 1px solid #ccc; +} +#content .row:hover { + background: #eee; +} +#content.list .row div { + border-bottom: 1px solid #eee; +} +#content.grid .row { + border: 1px solid #eee; + margin: 0; +} diff --git a/static/css/spc/material_normal.css b/static/css/spc/material_normal.css index 9af806f..0fa7c7e 100644 --- a/static/css/spc/material_normal.css +++ b/static/css/spc/material_normal.css @@ -1,85 +1,408 @@ -body,textarea{color:#111} -body{background:#f5f5f5} -a{color:#00BCD4;text-decoration:none} -a:hover{color:#FF6961} -.msg a{color:#111;text-decoration:underline} -.msg a:hover{color:#438ac1} -h1{font-size:30px;margin:0;background:#1a2357;margin:-7px -7px 16px;padding:16px;font-variant:small-caps;box-shadow:0 2px 10px #000} -h2{margin-bottom:.5em} -h2 span{color:#CCC} -h2 a{color:#616161} -h3{border-bottom:1px solid #CCC;color:#4b01d1;font-weight:bold;margin:0 0 8px;padding-bottom:8px;text-align:center} -h3 span{display:block;font-size:smaller;opacity:.7} -h4{color:#AAA;font-size:12px} -hr,#size,.banner,.threadpage .postform br{display:none} -#main_nav{background:#4b01d1;font-size:1px;font-size:0;position:relative;z-index:9} -#thread_nav{background:#303F9F;margin:-8px -8px -100px;padding:16px 0 116px;text-align:center} -#main_nav a,#thread_nav a{background:#FFF;border-radius:2px;color:#000;display:inline-block;font-size:14px;margin:0 2px;padding:2px} -#main_nav a:hover,.threadlinks a:hover,#thread_nav a:hover,#threadlist a:hover{background:#DDD} -#titlebox a,#threadbox a{color:#FFF} -#rules a:hover,.links a:hover,#threadlinks a:hover{border-radius:4px;margin:-2px;padding:2px;background:#1f285a;display:inline-block} -#titlebox,#createbox,#footer,.end{background:#303F9F;color:#FFF;margin:0} -#rules,#search{margin:1em 1em 0} -#threadbox{background:#3f51b5;color:#FFF;margin:0 0 -150px;padding:0 1em 150px} -.mainpage #threadbox .innerbox:after{content:'';box-shadow:0 0 20px 25px #3f51b5;display:block;position:relative;z-index:9} -#threadlinks{text-transform:uppercase} -#threadlist a{background:#FFF;border-bottom:1px solid #182050;border-radius:5px;color:#303F9F;display:inline-block;padding:3px;margin:3px} -.threadnav a{color:#FFF;padding:4px;display:inline-block} -.innerbox{margin:0} -.thread,.outerbox,#content{background:#FFF;margin-top:2em} -.mainpage .thread{margin-top:2em} -.thread,#content,.threadpage .postform{box-shadow:0px 2px 2px 0px rgba(0,0,0,.14),0px 3px 1px -2px rgba(0,0,0,.2),0px 1px 5px 0px rgba(0,0,0,.12);} -.thread .innerbox{background:#FFF;margin:0;padding:16px} -.threadpage .thread,.threadpage .postform{margin:0 2.5%;padding:1em} -.thread textarea,.threadpage textarea,.mainpage .threadlinks{margin-top:.5em} -input[type="submit"],input[type="button"],button,.lastposts a,#n2{background:#2296f3;border:0;border-radius:5px;box-shadow:0 2px 5px rgba(0,0,0,.12);color:#FFF;text-transform:uppercase;padding:6px} -input[type="submit"]:active,input[type="button"]:active,button:active,.threadnav a:hover{background:#438ac1} -input[type="text"],textarea,#search input[type="text"]{border:1px solid #CCC;border-radius:2px;padding:6px} -textarea{width:100%} -select{border-radius:2px;background:#2296f3 url(data:image/gif;base64,iVBORw0KGgoAAAANSUhEUgAAAAUAAAADCAYAAABbNsX4AAAABmJLR0QAAAAAAAD5Q7t/AAAACXBIWXMAAC4jAAAuIwF4pT92AAAAB3RJTUUH4wQBBAYpAtmVHwAAABl0RVh0Q29tbWVudABDcmVhdGVkIHdpdGggR0lNUFeBDhcAAAAfSURBVAjXY/z///9/BjTAyMDAwIAswcjIyAiXRZYAAKlrC/sti8JVAAAAAElFTkSuQmCC) no-repeat 95%;border:0;padding:0;color:#FFF;appearance:none;-webkit-appearance:none;-moz-appearance:none;} -a .name,.name,.abbrev{color:#2296f3} -.name em{color:#009} -.del{margin-right:4px} -.del a{color:#000} -a.thumb{margin-top:4px} -.q{color:#666} -a.yt{background:#FFF;border:1px solid #CCC;box-shadow:0 4px 10px -4px #CCC;color:#444;text-decoration:none} -a.yt,.yt .pvw{border-radius:10px} -.deleted{color:#AFAFAF;margin-bottom:24px} -#q-p{background:#FFF;border:1px solid #DDD;box-shadow:0 0 5px #CCC} -.lastposts{padding:16px 0;font-size:1px;font-size:0;text-align:center} -.lastposts a,.lastposts #n2{background:#ff4081;margin-right:5px;text-decoration:none} -.lastposts a:active,#n2:active{background:#b22d5a} -.threadpage .threadlinks{margin:0;margin-bottom:8px} -#counter,.threadnav a{background:#2296f3;border-radius:100%;box-shadow:0 2px 5px rgba(0,0,0,.12)} -.lastposts a,#n2,#counter{color:#FFF;display:inline-block;font-size:16px;padding:5px} -.mainpage .postform,.formpad{padding-left:0} -.mainpage .postform{margin:1em -1em -1em;padding:1em} -.postform{background:#EEE;color:#666;text-align:center} -.threadlinks a{background:#FFF;border-radius:.2em;color:#00BCD4;display:inline-block;font-size:smaller;padding:.2em;text-transform:uppercase} -form .msg{border:1px dotted #AAA;background:#FFF;color:#111} -h5{font-variant:small-caps;text-align:center} -#createbox{margin-top:2em;padding-top:1em} -#createbox .innerbox{padding:0} -#createbox table{margin:0 auto} -#createbox .threadnav{right:7px;position:relative} -#footer{padding:1em} -#footer a{color:#FFF} -.end{margin:-100px -8px -8px;padding:116px 0 16px;position:relative;text-align:center;z-index:-1} -#content .thread{background:none;box-shadow:none} -#content.list #header div{background:#FFF;border-bottom:1px solid #CCC} -#content .row:hover{background:#EEE} -#content.list .row div{border-bottom:1px solid #EEE} -#content.grid .row{border:1px solid #EEE;margin:0} -@media(max-width:720px){ - #main_nav.mob select{font-size:12px} - h1{font-size:18px} - #threadbox{padding-left:0;padding-right:0} - #rules,#search{margin-left:0;margin-right:0} - .thread .innerbox{padding:.5em} - .mainpage .thread{margin:2em .5em} - .mainpage .postform{margin:.5em -.5em -.5em;padding:.5em} - .threadpage .thread,.threadpage .postform{margin:0;padding:.5em} - .lastposts{padding:8px 0} - .postform>span{margin-top:.5em} -}
\ No newline at end of file +body, +textarea { + color: #111; +} +body { + background: #f5f5f5; +} +a { + color: #00bcd4; + text-decoration: none; +} +a:hover { + color: #ff6961; +} +.msg a { + color: #111; + text-decoration: underline; +} +.msg a:hover { + color: #438ac1; +} +h1 { + font-size: 30px; + margin: 0; + background: #1a2357; + margin: -7px -7px 16px; + padding: 16px; + font-variant: small-caps; + box-shadow: 0 2px 10px #000; +} +h2 { + margin-bottom: 0.5em; +} +h2 span { + color: #ccc; +} +h2 a { + color: #616161; +} +h3 { + border-bottom: 1px solid #ccc; + color: #4b01d1; + font-weight: bold; + margin: 0 0 8px; + padding-bottom: 8px; + text-align: center; +} +h3 span { + display: block; + font-size: smaller; + opacity: 0.7; +} +h4 { + color: #aaa; + font-size: 12px; +} +hr, +#size, +.banner, +.threadpage .postform br { + display: none; +} +#main_nav { + background: #4b01d1; + font-size: 1px; + font-size: 0; + position: relative; + z-index: 9; +} +#thread_nav { + background: #303f9f; + margin: -8px -8px -100px; + padding: 16px 0 116px; + text-align: center; +} +#main_nav a, +#thread_nav a { + background: #fff; + border-radius: 2px; + color: #000; + display: inline-block; + font-size: 14px; + margin: 0 2px; + padding: 2px; +} +#main_nav a:hover, +.threadlinks a:hover, +#thread_nav a:hover, +#threadlist a:hover { + background: #ddd; +} +#titlebox a, +#threadbox a { + color: #fff; +} +#rules a:hover, +.links a:hover, +#threadlinks a:hover { + border-radius: 4px; + margin: -2px; + padding: 2px; + background: #1f285a; + display: inline-block; +} +#titlebox, +#createbox, +#footer, +.end { + background: #303f9f; + color: #fff; + margin: 0; +} +#rules, +#search { + margin: 1em 1em 0; +} +#threadbox { + background: #3f51b5; + color: #fff; + margin: 0 0 -150px; + padding: 0 1em 150px; +} +.mainpage #threadbox .innerbox:after { + content: ""; + box-shadow: 0 0 20px 25px #3f51b5; + display: block; + position: relative; + z-index: 9; +} +#threadlinks { + text-transform: uppercase; +} +#threadlist a { + background: #fff; + border-bottom: 1px solid #182050; + border-radius: 5px; + color: #303f9f; + display: inline-block; + padding: 3px; + margin: 3px; +} +.threadnav a { + color: #fff; + padding: 4px; + display: inline-block; +} +.innerbox { + margin: 0; +} +.thread, +.outerbox, +#content { + background: #fff; + margin-top: 2em; +} +.mainpage .thread { + margin-top: 2em; +} +.thread, +#content, +.threadpage .postform { + box-shadow: 0px 2px 2px 0px rgba(0, 0, 0, 0.14), + 0px 3px 1px -2px rgba(0, 0, 0, 0.2), 0px 1px 5px 0px rgba(0, 0, 0, 0.12); +} +.thread .innerbox { + background: #fff; + margin: 0; + padding: 16px; +} +.threadpage .thread, +.threadpage .postform { + margin: 0 2.5%; + padding: 1em; +} +.thread textarea, +.threadpage textarea, +.mainpage .threadlinks { + margin-top: 0.5em; +} +input[type="submit"], +input[type="button"], +button, +.lastposts a, +#n2 { + background: #2296f3; + border: 0; + border-radius: 5px; + box-shadow: 0 2px 5px rgba(0, 0, 0, 0.12); + color: #fff; + text-transform: uppercase; + padding: 6px; +} +input[type="submit"]:active, +input[type="button"]:active, +button:active, +.threadnav a:hover { + background: #438ac1; +} +input[type="text"], +textarea, +#search input[type="text"] { + border: 1px solid #ccc; + border-radius: 2px; + padding: 6px; +} +textarea { + width: 100%; +} +select { + border-radius: 2px; + background: #2296f3 + url(data:image/gif;base64,iVBORw0KGgoAAAANSUhEUgAAAAUAAAADCAYAAABbNsX4AAAABmJLR0QAAAAAAAD5Q7t/AAAACXBIWXMAAC4jAAAuIwF4pT92AAAAB3RJTUUH4wQBBAYpAtmVHwAAABl0RVh0Q29tbWVudABDcmVhdGVkIHdpdGggR0lNUFeBDhcAAAAfSURBVAjXY/z///9/BjTAyMDAwIAswcjIyAiXRZYAAKlrC/sti8JVAAAAAElFTkSuQmCC) + no-repeat 95%; + border: 0; + padding: 0; + color: #fff; + appearance: none; + -webkit-appearance: none; + -moz-appearance: none; +} +a .name, +.name, +.abbrev { + color: #2296f3; +} +.name em { + color: #009; +} +.del { + margin-right: 4px; +} +.del a { + color: #000; +} +a.thumb { + margin-top: 4px; +} +.q { + color: #666; +} +a.yt { + background: #fff; + border: 1px solid #ccc; + box-shadow: 0 4px 10px -4px #ccc; + color: #444; + text-decoration: none; +} +a.yt, +.yt .pvw { + border-radius: 10px; +} +.deleted { + color: #afafaf; + margin-bottom: 24px; +} +#q-p { + background: #fff; + border: 1px solid #ddd; + box-shadow: 0 0 5px #ccc; +} +.lastposts { + padding: 16px 0; + font-size: 1px; + font-size: 0; + text-align: center; +} +.lastposts a, +.lastposts #n2 { + background: #ff4081; + margin-right: 5px; + text-decoration: none; +} +.lastposts a:active, +#n2:active { + background: #b22d5a; +} +.threadpage .threadlinks { + margin: 0; + margin-bottom: 8px; +} +#counter, +.threadnav a { + background: #2296f3; + border-radius: 100%; + box-shadow: 0 2px 5px rgba(0, 0, 0, 0.12); +} +.lastposts a, +#n2, +#counter { + color: #fff; + display: inline-block; + font-size: 16px; + padding: 5px; +} +.mainpage .postform, +.formpad { + padding-left: 0; +} +.mainpage .postform { + margin: 1em -1em -1em; + padding: 1em; +} +.postform { + background: #eee; + color: #666; + text-align: center; +} +.threadlinks a { + background: #fff; + border-radius: 0.2em; + color: #00bcd4; + display: inline-block; + font-size: smaller; + padding: 0.2em; + text-transform: uppercase; +} +form .msg { + border: 1px dotted #aaa; + background: #fff; + color: #111; +} +h5 { + font-variant: small-caps; + text-align: center; +} +#createbox { + margin-top: 2em; + padding-top: 1em; +} +#createbox .innerbox { + padding: 0; +} +#createbox table { + margin: 0 auto; +} +#createbox .threadnav { + right: 7px; + position: relative; +} +#footer { + padding: 1em; +} +#footer a { + color: #fff; +} +.end { + margin: -100px -8px -8px; + padding: 116px 0 16px; + position: relative; + text-align: center; + z-index: -1; +} +#content .thread { + background: none; + box-shadow: none; +} +#content.list #header div { + background: #fff; + border-bottom: 1px solid #ccc; +} +#content .row:hover { + background: #eee; +} +#content.list .row div { + border-bottom: 1px solid #eee; +} +#content.grid .row { + border: 1px solid #eee; + margin: 0; +} +@media (max-width: 720px) { + #main_nav.mob select { + font-size: 12px; + } + h1 { + font-size: 18px; + } + #threadbox { + padding-left: 0; + padding-right: 0; + } + #rules, + #search { + margin-left: 0; + margin-right: 0; + } + .thread .innerbox { + padding: 0.5em; + } + .mainpage .thread { + margin: 2em 0.5em; + } + .mainpage .postform { + margin: 0.5em -0.5em -0.5em; + padding: 0.5em; + } + .threadpage .thread, + .threadpage .postform { + margin: 0; + padding: 0.5em; + } + .lastposts { + padding: 8px 0; + } + .postform > span { + margin-top: 0.5em; + } +} diff --git a/static/css/spc/navidad.css b/static/css/spc/navidad.css index 4d90c6a..19621bb 100644 --- a/static/css/spc/navidad.css +++ b/static/css/spc/navidad.css @@ -1,161 +1,161 @@ -html, body { - background:#004608; - color:#fff; +html, +body { + background: #004608; + color: #fff; } a { - color:#EFD279; + color: #efd279; } a.rep { - color:#fff; + color: #fff; } a:hover { - color:#DD0000; + color: #dd0000; } -.reflink a:hover{ - font-weight: bold; +.reflink a:hover { + font-weight: bold; } .adminbar { - text-align:right; - clear:both; - float:right; + text-align: right; + clear: both; + float: right; } .logo { - clear:both; - text-align:center; - font-size:2em; - color:#CCFFCC; - width:100%; + clear: both; + text-align: center; + font-size: 2em; + color: #ccffcc; + width: 100%; } .replymode { - background:#078B26; - text-align:center; - padding:2px; - color:#FFFFFF; - width:100%; + background: #078b26; + text-align: center; + padding: 2px; + color: #ffffff; + width: 100%; } .catalogmode { - background:#0040E0; - text-align:center; - padding:2px; - color:#FFFFFF; - width:100%; + background: #0040e0; + text-align: center; + padding: 2px; + color: #ffffff; + width: 100%; } .rules { - /*font-size:0.7em;*/ - width: 468px; - font-size: 10px; - font-family: sans-serif; + /*font-size:0.7em;*/ + width: 468px; + font-size: 10px; + font-family: sans-serif; } .rules li { - margin-left: 1em; - /*text-indent: 0em;*/ + margin-left: 1em; + /*text-indent: 0em;*/ } .postblock { - background:#B00000; - color:#FFF; - font-weight:800; + background: #b00000; + color: #fff; + font-weight: 800; } .footer { - text-align:center; - font-size:12px; - font-family:serif; + text-align: center; + font-size: 12px; + font-family: serif; } .passvalid { - background:#EEAA88; - text-align:center; - width:100%; - color:#ffffff; + background: #eeaa88; + text-align: center; + width: 100%; + color: #ffffff; } .dellist { - font-weight: bold; - text-align:center; + font-weight: bold; + text-align: center; } .delbuttons { - text-align:center; - padding-bottom:4px; - + text-align: center; + padding-bottom: 4px; } .managehead { - background:#AAAA66; - color:#400000; - padding:0px; + background: #aaaa66; + color: #400000; + padding: 0px; } .postlists { - background:#FFFFFF; - width:100%; - padding:0px; - color:#800000; + background: #ffffff; + width: 100%; + padding: 0px; + color: #800000; } .row1 { - background:#EEEECC; - color:#800000; + background: #eeeecc; + color: #800000; } .row2 { - background:#DDDDAA; - color:#800000; + background: #ddddaa; + color: #800000; } .q { - background:inherit; - color:#BDF46C; + background: inherit; + color: #bdf46c; } .filesize { - text-decoration:none; + text-decoration: none; } .filetitle { - background:inherit; - font-size:1.3em; - color:#E91F1F; - font-weight:800; + background: inherit; + font-size: 1.3em; + color: #e91f1f; + font-weight: 800; } .postername { - color:#AFD775; - font-weight:bold; + color: #afd775; + font-weight: bold; } .postertrip { - color:#AFD775; + color: #afd775; } .oldpost { - color:#CC1105; - font-weight:800; + color: #cc1105; + font-weight: 800; } .omittedposts { - color:#909090; + color: #909090; } .reply { - background: #078B26; - color: #fff; + background: #078b26; + color: #fff; } .replyhl { - background: #F0C0B0; - color: #800000; + background: #f0c0b0; + color: #800000; } .replytitle { - font-size: 1.2em; - color:#CC1105; - font-weight:800; + font-size: 1.2em; + color: #cc1105; + font-weight: 800; } .commentpostername { - color:#117743; - font-weight:800; + color: #117743; + font-weight: 800; } .thumbnailmsg { - font-size: small; - color:#800000; + font-size: small; + color: #800000; } .abbrev { - color:#707070; + color: #707070; } .highlight { - /*background:#95CBE9;*/ - background: #5B8BB4; - /*color:#2C5700;*/ - /*border: 2px dashed #070;*/ - border: 2px dashed #AFD775; + /*background:#95CBE9;*/ + background: #5b8bb4; + /*color:#2C5700;*/ + /*border: 2px dashed #070;*/ + border: 2px dashed #afd775; } .banned { - color:#F99C64; + color: #f99c64; } .administrator { - color:#C00 !important; + color: #c00 !important; } diff --git a/static/css/spc/skeleton.css b/static/css/spc/skeleton.css index 049db08..efb2126 100644 --- a/static/css/spc/skeleton.css +++ b/static/css/spc/skeleton.css @@ -7,7 +7,6 @@ * 6/20/2012 */ - /* Table of Contents ================================================== #Base 960 Grid @@ -16,227 +15,408 @@ #Mobile (Landscape) #Clearing */ - - /* #Base 960 Grid ================================================== */ - .container { position: relative; width: 960px; margin: 0 auto; padding: 0; } - .container .column, - .container .columns { float: left; display: inline; margin-left: 10px; margin-right: 10px; } - .row { margin-bottom: 20px; } - - /* Nested Column Classes */ - .column.alpha, .columns.alpha { margin-left: 0; } - .column.omega, .columns.omega { margin-right: 0; } - - /* Base Grid */ - .container .one.column, - .container .one.columns { width: 40px; } - .container .two.columns { width: 100px; } - .container .three.columns { width: 160px; } - .container .four.columns { width: 220px; } - .container .five.columns { width: 280px; } - .container .six.columns { width: 340px; } - .container .seven.columns { width: 400px; } - .container .eight.columns { width: 460px; } - .container .nine.columns { width: 520px; } - .container .ten.columns { width: 580px; } - .container .eleven.columns { width: 640px; } - .container .twelve.columns { width: 700px; } - .container .thirteen.columns { width: 760px; } - .container .fourteen.columns { width: 820px; } - .container .fifteen.columns { width: 880px; } - .container .sixteen.columns { width: 940px; } - - .container .one-third.column { width: 300px; } - .container .two-thirds.column { width: 620px; } - - /* Offsets */ - .container .offset-by-one { padding-left: 60px; } - .container .offset-by-two { padding-left: 120px; } - .container .offset-by-three { padding-left: 180px; } - .container .offset-by-four { padding-left: 240px; } - .container .offset-by-five { padding-left: 300px; } - .container .offset-by-six { padding-left: 360px; } - .container .offset-by-seven { padding-left: 420px; } - .container .offset-by-eight { padding-left: 480px; } - .container .offset-by-nine { padding-left: 540px; } - .container .offset-by-ten { padding-left: 600px; } - .container .offset-by-eleven { padding-left: 660px; } - .container .offset-by-twelve { padding-left: 720px; } - .container .offset-by-thirteen { padding-left: 780px; } - .container .offset-by-fourteen { padding-left: 840px; } - .container .offset-by-fifteen { padding-left: 900px; } - - +.container { + position: relative; + width: 960px; + margin: 0 auto; + padding: 0; +} +.container .column, +.container .columns { + float: left; + display: inline; + margin-left: 10px; + margin-right: 10px; +} +.row { + margin-bottom: 20px; +} + +/* Nested Column Classes */ +.column.alpha, +.columns.alpha { + margin-left: 0; +} +.column.omega, +.columns.omega { + margin-right: 0; +} + +/* Base Grid */ +.container .one.column, +.container .one.columns { + width: 40px; +} +.container .two.columns { + width: 100px; +} +.container .three.columns { + width: 160px; +} +.container .four.columns { + width: 220px; +} +.container .five.columns { + width: 280px; +} +.container .six.columns { + width: 340px; +} +.container .seven.columns { + width: 400px; +} +.container .eight.columns { + width: 460px; +} +.container .nine.columns { + width: 520px; +} +.container .ten.columns { + width: 580px; +} +.container .eleven.columns { + width: 640px; +} +.container .twelve.columns { + width: 700px; +} +.container .thirteen.columns { + width: 760px; +} +.container .fourteen.columns { + width: 820px; +} +.container .fifteen.columns { + width: 880px; +} +.container .sixteen.columns { + width: 940px; +} + +.container .one-third.column { + width: 300px; +} +.container .two-thirds.column { + width: 620px; +} + +/* Offsets */ +.container .offset-by-one { + padding-left: 60px; +} +.container .offset-by-two { + padding-left: 120px; +} +.container .offset-by-three { + padding-left: 180px; +} +.container .offset-by-four { + padding-left: 240px; +} +.container .offset-by-five { + padding-left: 300px; +} +.container .offset-by-six { + padding-left: 360px; +} +.container .offset-by-seven { + padding-left: 420px; +} +.container .offset-by-eight { + padding-left: 480px; +} +.container .offset-by-nine { + padding-left: 540px; +} +.container .offset-by-ten { + padding-left: 600px; +} +.container .offset-by-eleven { + padding-left: 660px; +} +.container .offset-by-twelve { + padding-left: 720px; +} +.container .offset-by-thirteen { + padding-left: 780px; +} +.container .offset-by-fourteen { + padding-left: 840px; +} +.container .offset-by-fifteen { + padding-left: 900px; +} /* #Tablet (Portrait) ================================================== */ - /* Note: Design for a width of 768px */ - - @media only screen and (min-width: 768px) and (max-width: 959px) { - .container { width: 768px; } - .container .column, - .container .columns { margin-left: 10px; margin-right: 10px; } - .column.alpha, .columns.alpha { margin-left: 0; margin-right: 10px; } - .column.omega, .columns.omega { margin-right: 0; margin-left: 10px; } - .alpha.omega { margin-left: 0; margin-right: 0; } - - .container .one.column, - .container .one.columns { width: 28px; } - .container .two.columns { width: 76px; } - .container .three.columns { width: 124px; } - .container .four.columns { width: 172px; } - .container .five.columns { width: 220px; } - .container .six.columns { width: 268px; } - .container .seven.columns { width: 316px; } - .container .eight.columns { width: 364px; } - .container .nine.columns { width: 412px; } - .container .ten.columns { width: 460px; } - .container .eleven.columns { width: 508px; } - .container .twelve.columns { width: 556px; } - .container .thirteen.columns { width: 604px; } - .container .fourteen.columns { width: 652px; } - .container .fifteen.columns { width: 700px; } - .container .sixteen.columns { width: 748px; } - - .container .one-third.column { width: 236px; } - .container .two-thirds.column { width: 492px; } - - /* Offsets */ - .container .offset-by-one { padding-left: 48px; } - .container .offset-by-two { padding-left: 96px; } - .container .offset-by-three { padding-left: 144px; } - .container .offset-by-four { padding-left: 192px; } - .container .offset-by-five { padding-left: 240px; } - .container .offset-by-six { padding-left: 288px; } - .container .offset-by-seven { padding-left: 336px; } - .container .offset-by-eight { padding-left: 384px; } - .container .offset-by-nine { padding-left: 432px; } - .container .offset-by-ten { padding-left: 480px; } - .container .offset-by-eleven { padding-left: 528px; } - .container .offset-by-twelve { padding-left: 576px; } - .container .offset-by-thirteen { padding-left: 624px; } - .container .offset-by-fourteen { padding-left: 672px; } - .container .offset-by-fifteen { padding-left: 720px; } - } - +/* Note: Design for a width of 768px */ + +@media only screen and (min-width: 768px) and (max-width: 959px) { + .container { + width: 768px; + } + .container .column, + .container .columns { + margin-left: 10px; + margin-right: 10px; + } + .column.alpha, + .columns.alpha { + margin-left: 0; + margin-right: 10px; + } + .column.omega, + .columns.omega { + margin-right: 0; + margin-left: 10px; + } + .alpha.omega { + margin-left: 0; + margin-right: 0; + } + + .container .one.column, + .container .one.columns { + width: 28px; + } + .container .two.columns { + width: 76px; + } + .container .three.columns { + width: 124px; + } + .container .four.columns { + width: 172px; + } + .container .five.columns { + width: 220px; + } + .container .six.columns { + width: 268px; + } + .container .seven.columns { + width: 316px; + } + .container .eight.columns { + width: 364px; + } + .container .nine.columns { + width: 412px; + } + .container .ten.columns { + width: 460px; + } + .container .eleven.columns { + width: 508px; + } + .container .twelve.columns { + width: 556px; + } + .container .thirteen.columns { + width: 604px; + } + .container .fourteen.columns { + width: 652px; + } + .container .fifteen.columns { + width: 700px; + } + .container .sixteen.columns { + width: 748px; + } + + .container .one-third.column { + width: 236px; + } + .container .two-thirds.column { + width: 492px; + } + + /* Offsets */ + .container .offset-by-one { + padding-left: 48px; + } + .container .offset-by-two { + padding-left: 96px; + } + .container .offset-by-three { + padding-left: 144px; + } + .container .offset-by-four { + padding-left: 192px; + } + .container .offset-by-five { + padding-left: 240px; + } + .container .offset-by-six { + padding-left: 288px; + } + .container .offset-by-seven { + padding-left: 336px; + } + .container .offset-by-eight { + padding-left: 384px; + } + .container .offset-by-nine { + padding-left: 432px; + } + .container .offset-by-ten { + padding-left: 480px; + } + .container .offset-by-eleven { + padding-left: 528px; + } + .container .offset-by-twelve { + padding-left: 576px; + } + .container .offset-by-thirteen { + padding-left: 624px; + } + .container .offset-by-fourteen { + padding-left: 672px; + } + .container .offset-by-fifteen { + padding-left: 720px; + } +} /* #Mobile (Portrait) ================================================== */ - /* Note: Design for a width of 320px */ - - @media only screen and (max-width: 767px) { - .container { width: 300px; } - .container .columns, - .container .column { margin: 0; } - - .container .one.column, - .container .one.columns, - .container .two.columns, - .container .three.columns, - .container .four.columns, - .container .five.columns, - .container .six.columns, - .container .seven.columns, - .container .eight.columns, - .container .nine.columns, - .container .ten.columns, - .container .eleven.columns, - .container .twelve.columns, - .container .thirteen.columns, - .container .fourteen.columns, - .container .fifteen.columns, - .container .sixteen.columns, - .container .one-third.column, - .container .two-thirds.column { width: 300px; } - - /* Offsets */ - .container .offset-by-one, - .container .offset-by-two, - .container .offset-by-three, - .container .offset-by-four, - .container .offset-by-five, - .container .offset-by-six, - .container .offset-by-seven, - .container .offset-by-eight, - .container .offset-by-nine, - .container .offset-by-ten, - .container .offset-by-eleven, - .container .offset-by-twelve, - .container .offset-by-thirteen, - .container .offset-by-fourteen, - .container .offset-by-fifteen { padding-left: 0; } - - } - +/* Note: Design for a width of 320px */ + +@media only screen and (max-width: 767px) { + .container { + width: 300px; + } + .container .columns, + .container .column { + margin: 0; + } + + .container .one.column, + .container .one.columns, + .container .two.columns, + .container .three.columns, + .container .four.columns, + .container .five.columns, + .container .six.columns, + .container .seven.columns, + .container .eight.columns, + .container .nine.columns, + .container .ten.columns, + .container .eleven.columns, + .container .twelve.columns, + .container .thirteen.columns, + .container .fourteen.columns, + .container .fifteen.columns, + .container .sixteen.columns, + .container .one-third.column, + .container .two-thirds.column { + width: 300px; + } + + /* Offsets */ + .container .offset-by-one, + .container .offset-by-two, + .container .offset-by-three, + .container .offset-by-four, + .container .offset-by-five, + .container .offset-by-six, + .container .offset-by-seven, + .container .offset-by-eight, + .container .offset-by-nine, + .container .offset-by-ten, + .container .offset-by-eleven, + .container .offset-by-twelve, + .container .offset-by-thirteen, + .container .offset-by-fourteen, + .container .offset-by-fifteen { + padding-left: 0; + } +} /* #Mobile (Landscape) ================================================== */ - /* Note: Design for a width of 480px */ - - @media only screen and (min-width: 480px) and (max-width: 767px) { - .container { width: 420px; } - .container .columns, - .container .column { margin: 0; } - - .container .one.column, - .container .one.columns, - .container .two.columns, - .container .three.columns, - .container .four.columns, - .container .five.columns, - .container .six.columns, - .container .seven.columns, - .container .eight.columns, - .container .nine.columns, - .container .ten.columns, - .container .eleven.columns, - .container .twelve.columns, - .container .thirteen.columns, - .container .fourteen.columns, - .container .fifteen.columns, - .container .sixteen.columns, - .container .one-third.column, - .container .two-thirds.column { width: 420px; } - } - +/* Note: Design for a width of 480px */ + +@media only screen and (min-width: 480px) and (max-width: 767px) { + .container { + width: 420px; + } + .container .columns, + .container .column { + margin: 0; + } + + .container .one.column, + .container .one.columns, + .container .two.columns, + .container .three.columns, + .container .four.columns, + .container .five.columns, + .container .six.columns, + .container .seven.columns, + .container .eight.columns, + .container .nine.columns, + .container .ten.columns, + .container .eleven.columns, + .container .twelve.columns, + .container .thirteen.columns, + .container .fourteen.columns, + .container .fifteen.columns, + .container .sixteen.columns, + .container .one-third.column, + .container .two-thirds.column { + width: 420px; + } +} /* #Clearing ================================================== */ - /* Self Clearing Goodness */ - .container:after { content: "\0020"; display: block; height: 0; clear: both; visibility: hidden; } +/* Self Clearing Goodness */ +.container:after { + content: "\0020"; + display: block; + height: 0; + clear: both; + visibility: hidden; +} - /* Use clearfix class on parent to clear nested columns, +/* Use clearfix class on parent to clear nested columns, or wrap each row of columns in a <div class="row"> */ - .clearfix:before, - .clearfix:after, - .row:before, - .row:after { - content: '\0020'; - display: block; - overflow: hidden; - visibility: hidden; - width: 0; - height: 0; } - .row:after, - .clearfix:after { - clear: both; } - .row, - .clearfix { - zoom: 1; } - - /* You can also use a <br class="clear" /> to clear columns */ - .clear { - clear: both; - display: block; - overflow: hidden; - visibility: hidden; - width: 0; - height: 0; - }
\ No newline at end of file +.clearfix:before, +.clearfix:after, +.row:before, +.row:after { + content: "\0020"; + display: block; + overflow: hidden; + visibility: hidden; + width: 0; + height: 0; +} +.row:after, +.clearfix:after { + clear: both; +} +.row, +.clearfix { + zoom: 1; +} + +/* You can also use a <br class="clear" /> to clear columns */ +.clear { + clear: both; + display: block; + overflow: hidden; + visibility: hidden; + width: 0; + height: 0; +} diff --git a/static/css/spc/valentin.css b/static/css/spc/valentin.css index bbbc6c1..cf70219 100644 --- a/static/css/spc/valentin.css +++ b/static/css/spc/valentin.css @@ -1,170 +1,170 @@ -html, body { - /*background:#940BFE;*/ - background: url('img/corazoncitos.gif'); - color:#fff; +html, +body { + /*background:#940BFE;*/ + background: url("img/corazoncitos.gif"); + color: #fff; } a { - color:#EFD279; + color: #efd279; } a.rep { - color:#fff; + color: #fff; } a:hover { - color:#DD0000; + color: #dd0000; } -.reflink a:hover{ - font-weight: bold; +.reflink a:hover { + font-weight: bold; } .adminbar { - text-align:right; - clear:both; - float:right; + text-align: right; + clear: both; + float: right; } .logo { - clear:both; - text-align:center; - font-size:2em; - color:#CCFFCC; - width:100%; + clear: both; + text-align: center; + font-size: 2em; + color: #ccffcc; + width: 100%; } .replymode { - background:#0BBEB8; - text-align:center; - padding:2px; - color:#FFFFFF; - width:100%; + background: #0bbeb8; + text-align: center; + padding: 2px; + color: #ffffff; + width: 100%; } .extramode { - background:#0040E0; - text-align:center; - padding:2px; - color:#FFFFFF; - width:100%; + background: #0040e0; + text-align: center; + padding: 2px; + color: #ffffff; + width: 100%; } .rules { - /*font-size:0.7em;*/ - width: 468px; - font-size: 11px; - font-family: sans-serif; + /*font-size:0.7em;*/ + width: 468px; + font-size: 11px; + font-family: sans-serif; } .rules li { - margin-left: 1em; - /*text-indent: 0em;*/ + margin-left: 1em; + /*text-indent: 0em;*/ } .postblock { - background:#95CBE9; - color:#2C5700; - font-weight:800; + background: #95cbe9; + color: #2c5700; + font-weight: 800; } .footer { - text-align:center; - font-size:12px; - font-family:serif; + text-align: center; + font-size: 12px; + font-family: serif; } .passvalid { - background:#EEAA88; - text-align:center; - width:100%; - color:#ffffff; + background: #eeaa88; + text-align: center; + width: 100%; + color: #ffffff; } .dellist { - font-weight: bold; - text-align:center; + font-weight: bold; + text-align: center; } .delbuttons { - text-align:center; - padding-bottom:4px; - + text-align: center; + padding-bottom: 4px; } .managehead { - background:#AAAA66; - color:#400000; - padding:0px; + background: #aaaa66; + color: #400000; + padding: 0px; } .postlists { - background:#FFFFFF; - width:100%; - padding:0px; - color:#800000; + background: #ffffff; + width: 100%; + padding: 0px; + color: #800000; } .row1 { - background:#EEEECC; - color:#800000; + background: #eeeecc; + color: #800000; } .row2 { - background:#DDDDAA; - color:#800000; + background: #ddddaa; + color: #800000; } .q { - background:inherit; - color:#BDF46C; + background: inherit; + color: #bdf46c; } .filesize { - text-decoration:none; + text-decoration: none; } .filetitle { - background:inherit; - font-size:1.3em; - color:#DE9D7F; - font-weight:800; + background: inherit; + font-size: 1.3em; + color: #de9d7f; + font-weight: 800; } .postername { - color:#AFD775; - font-weight:bold; + color: #afd775; + font-weight: bold; } .postertrip { - color:#AFD775; + color: #afd775; } .oldpost { - color:#CC1105; - font-weight:800; + color: #cc1105; + font-weight: 800; } .omittedposts { - color:#909090; + color: #909090; } .reply { - background: #FE0BDF; - color: #fff; + background: #fe0bdf; + color: #fff; } .replyhl { - background: #F0C0B0; - color: #800000; + background: #f0c0b0; + color: #800000; } .replytitle { - font-size: 1.2em; - color:#CC1105; - font-weight:800; + font-size: 1.2em; + color: #cc1105; + font-weight: 800; } .commentpostername { - color:#117743; - font-weight:800; + color: #117743; + font-weight: 800; } .thumbnailmsg { - font-size: small; - color:#800000; + font-size: small; + color: #800000; } .abbrev { - color:#707070; + color: #707070; } .highlight { - /*background:#95CBE9;*/ - background: #5B8BB4; - /*color:#2C5700;*/ - /*border: 2px dashed #070;*/ - border: 2px dashed #AFD775; + /*background:#95CBE9;*/ + background: #5b8bb4; + /*color:#2C5700;*/ + /*border: 2px dashed #070;*/ + border: 2px dashed #afd775; } .banned { - color:#F99C64; + color: #f99c64; } .administrator { - color:#C00 !important; + color: #c00 !important; } .managertable td { - background:#3B6B94; - color:#FFF; + background: #3b6b94; + color: #fff; } .managertable th { - background:#AAF; - color:#FFF; -}
\ No newline at end of file + background: #aaf; + color: #fff; +} diff --git a/static/css/spc/valentin2.css b/static/css/spc/valentin2.css index 189611c..83f76d3 100644 --- a/static/css/spc/valentin2.css +++ b/static/css/spc/valentin2.css @@ -1,177 +1,177 @@ -html, body { - background:url('img/hearts1.gif'); - color:#000; +html, +body { + background: url("img/hearts1.gif"); + color: #000; } a { - color:#2D89D0; + color: #2d89d0; } a.rep { - color:#000; + color: #000; } a:hover { - color:#DD0000; + color: #dd0000; } -.reflink a:hover{ - font-weight: bold; +.reflink a:hover { + font-weight: bold; } .adminbar { - text-align:right; - clear:both; - float:right; + text-align: right; + clear: both; + float: right; } .logo { - clear:both; - text-align:center; - font-size:2em; - color:#B35692; - width:100%; + clear: both; + text-align: center; + font-size: 2em; + color: #b35692; + width: 100%; } .replymode { - background:#1D7548; - text-align:center; + background: #1d7548; + text-align: center; font-weight: bold; - padding:2px; - color:#FFFFFF; - width:100%; + padding: 2px; + color: #ffffff; + width: 100%; } .extramode { - background:#0040E0; - text-align:center; + background: #0040e0; + text-align: center; font-weight: bold; - padding:2px; - color:#FFFFFF; - width:100%; + padding: 2px; + color: #ffffff; + width: 100%; } .rules { - /*font-size:0.7em;*/ - width: 468px; - font-size: 11px; - font-family: sans-serif; + /*font-size:0.7em;*/ + width: 468px; + font-size: 11px; + font-family: sans-serif; } .rules li { - margin-left: 1em; - /*text-indent: 0em;*/ + margin-left: 1em; + /*text-indent: 0em;*/ } .postblock { - background:#FF7BD1; - color:#666; - font-weight:800; + background: #ff7bd1; + color: #666; + font-weight: 800; } .footer { - text-align:center; - font-size:12px; - font-family:serif; + text-align: center; + font-size: 12px; + font-family: serif; } .passvalid { - background:#EEAA88; - text-align:center; - width:100%; - color:#ffffff; + background: #eeaa88; + text-align: center; + width: 100%; + color: #ffffff; } .dellist { - font-weight: bold; - text-align:center; + font-weight: bold; + text-align: center; } .delbuttons { - text-align:center; - padding-bottom:4px; - + text-align: center; + padding-bottom: 4px; } .managehead { - background:#AAAA66; - color:#400000; - padding:0px; + background: #aaaa66; + color: #400000; + padding: 0px; } .postlists { - background:#FFFFFF; - width:100%; - padding:0px; - color:#800000; + background: #ffffff; + width: 100%; + padding: 0px; + color: #800000; } .row1 { - background:#EEEECC; - color:#800000; + background: #eeeecc; + color: #800000; } .row2 { - background:#DDDDAA; - color:#800000; + background: #ddddaa; + color: #800000; } .q { - background:inherit; - color:#3D343C; + background: inherit; + color: #3d343c; } blockquote blockquote { - background:inherit; - color:#6D940C; + background: inherit; + color: #6d940c; } .filesize { - text-decoration:none; + text-decoration: none; } .filetitle { - background:inherit; - font-size:1.3em; - color:#DC3D90; - font-weight:800; + background: inherit; + font-size: 1.3em; + color: #dc3d90; + font-weight: 800; } .postername { - color:#C000D6; - font-weight:bold; + color: #c000d6; + font-weight: bold; } .postertrip { - color:#C000D; + color: #C000D; } .oldpost { - color:#CC1105; - font-weight:800; + color: #cc1105; + font-weight: 800; } .omittedposts { - color:#909090; + color: #909090; } .reply { - background: url('img/hearts2.jpg'); - border: 1px solid #BBF; - color: #333; + background: url("img/hearts2.jpg"); + border: 1px solid #bbf; + color: #333; } .replyhl { - background: #F0C0B0; - color: #800000; + background: #f0c0b0; + color: #800000; } .replytitle { - font-size: 1.2em; - color:#DE9D7F; - font-weight:800; + font-size: 1.2em; + color: #de9d7f; + font-weight: 800; } .commentpostername { - color:#117743; - font-weight:800; + color: #117743; + font-weight: 800; } .thumbnailmsg { - font-size: small; - color:#000; + font-size: small; + color: #000; margin: 0; } .abbrev { - color:#707070; + color: #707070; } .highlight { - /*background:#95CBE9;*/ - background: #5B8BB4; - /*color:#2C5700;*/ - /*border: 2px dashed #070;*/ - border: 2px dashed #AFD775; + /*background:#95CBE9;*/ + background: #5b8bb4; + /*color:#2C5700;*/ + /*border: 2px dashed #070;*/ + border: 2px dashed #afd775; } .banned { - color:#F99C64; + color: #f99c64; } .administrator { - color:#C00 !important; + color: #c00 !important; } .managertable td { - background:#3B6B94; - color:#FFF; + background: #3b6b94; + color: #fff; } .managertable th { - background:#AAF; - color:#FFF; + background: #aaf; + color: #fff; } |