diff options
Diffstat (limited to 'p/themes/Dark/global.css')
| -rw-r--r-- | p/themes/Dark/global.css | 524 |
1 files changed, 524 insertions, 0 deletions
diff --git a/p/themes/Dark/global.css b/p/themes/Dark/global.css new file mode 100644 index 000000000..f96f83fc8 --- /dev/null +++ b/p/themes/Dark/global.css @@ -0,0 +1,524 @@ +@charset "UTF-8"; + +/* FONTS */ +@font-face { + font-family: "OpenSans"; + src: url("../fonts/openSans.woff") format("woff"); +} + + +* { + margin: 0; + padding: 0; +} +html, body { + height: 100%; + font-size: 95%; + font-family: "OpenSans", "Cantarell", "Helvetica", "Arial", sans-serif; + color: #888; +} + +/* LIENS */ +a { + color: #6986B2; + text-decoration: none; +} + a:hover { + text-decoration: underline; + } + +/* LISTES */ +ul, ol, dl { + margin: 10px 0 10px 30px; + line-height: 190%; +} + dd { + margin: 0 0 10px 30px; + } + +/* TITRES */ +h1, h2, h3 { + min-height: 40px; + margin: 15px 0 5px; + line-height: 40px; +} + +/* IMG */ +figure { + margin: 5px 0 10px; + text-align: center; +} + figcaption { + display: inline-block; + padding: 3px 20px; + color: #999; + font-style: italic; + border-bottom: 1px solid #ccc; + } +img { + height: auto; + max-width: 100%; + vertical-align: middle; +} + a img { + border: none; + } + +/* VIDEOS */ +iframe, embed, object, video { + max-width: 100%; +} + +/* FORMULAIRES */ +legend { + display: block; + width: 100%; + margin: 20px 0 5px; + padding: 5px 0; + border-bottom: 1px solid #2f2f2f; + font-size: 150%; + clear: both; +} +label { + display: block; + min-height: 25px; + padding: 5px 0; + font-size: 14px; + line-height: 25px; + cursor: pointer; +} +input { + width: 180px; +} +textarea { + width: 360px; + height: 100px; +} +input, select, textarea { + display: inline-block; + max-width: 100%; + min-height: 25px; + padding: 5px; + background: #333; + border: 1px solid #000; + border-radius: 3px; + color: #999; + line-height: 25px; + vertical-align: middle; + box-shadow: 0 2px 2px #1d1d1d inset; +} + option { + padding:0 .5em 0 .5em; + } + input[type="radio"], + input[type="checkbox"] { + width: 15px !important; + min-height: 15px !important; + } + input:focus, select:focus, textarea:focus { + color: #6986b2; + border-color: #2f2f2f; + } + input:invalid, select:invalid { + border-color: red; + box-shadow: 0 0 2px 1px red; + } + input:focus.extend { + width: 300px; + transition: width 200ms linear; + } + +.form-group { + margin: 0; +} + .form-group:after { + content: ""; + display: block; + clear: both; + } + .form-group.form-actions { + min-width: 250px; + padding: 5px 0; + background: #1a1a1a; + border-top: 1px solid #2f2f2f; + } + .form-group.form-actions .btn { + margin: 0 10px; + } + .form-group .group-name { + display: block; + float: left; + width: 200px; + padding: 10px 0; + text-align: right; + } + .form-group .group-controls { + min-width: 250px; + min-height: 25px; + margin: 0 0 0 220px; + padding: 5px 0; + } + .form-group .group-controls .control { + display: block; + min-height: 30px; + padding: 5px 0; + line-height: 25px; + font-size: 14px; + } + +.stick { + display: inline-block; + white-space: nowrap; + font-size: 0px; + vertical-align: middle; +} + .stick input, + .stick .btn { + border-radius: 0; + font-size: 14px; + } + .stick .btn:first-child, + .stick input:first-child { + border-radius: 3px 0 0 3px; + } + .stick .btn-important:first-child { + border-right: 1px solid #000; + } + .stick .btn:last-child, + .stick input:last-child { + border-radius: 0 3px 3px 0; + } + .stick .btn + .btn, + .stick .btn + input, + .stick .btn + .dropdown > .btn, + .stick input + .btn, + .stick input + input, + .stick input + .dropdown > .btn, + .stick .dropdown + .btn, + .stick .dropdown + input, + .stick .dropdown + .dropdown > .btn { + border-left: none; + } + .stick .btn + .dropdown > .btn { + border-left: none; + border-radius: 0 3px 3px 0; + } + .stick .btn + .dropdown a { + font-size: 12px; + } + +.btn { + display: inline-block; + min-height: 37px; + min-width: 15px; + padding: 5px 10px; + background: linear-gradient(to bottom, #fff 0%, #eee 100%); + border-radius: 3px; + border: 1px solid #000; + color: #888; + line-height: 20px; + vertical-align: middle; + cursor: pointer; + overflow: hidden; +} + a.btn { + min-height: 25px; + line-height: 25px; + } + .btn:hover { + background: linear-gradient(to bottom, #4A5D7A, #26303F); + text-decoration: none; + } + .btn.active, + .btn:active, + .dropdown-target:target ~ .btn.dropdown-toggle { + background: #26303F; + } + + .btn-important { + background: linear-gradient(to bottom, #0084CC, #0045CC); + color: #888888; + border: 1px solid #000000; + } + .btn-important:hover { + background: linear-gradient(to bottom, #0066CC, #0045CC); + } + .btn-important:active { + background: #0044CB; + box-shadow: none; + } + + .btn-attention { + background: linear-gradient(to bottom, #E95B57, #BD362F); + color: #888888; + border: 1px solid #000000; + } + .btn-attention:hover { + background: linear-gradient(to bottom, #D14641, #BD362F); + } + .btn-attention:active { + background: #BD362F; + box-shadow: none; + } + +/* NAVIGATION */ +.nav-list .nav-header, +.nav-list .item { + display: block; + height: 35px; + line-height: 35px; +} + .nav-list .item:hover { + background: #1a1a1a; + } + .nav-list .item:hover a { + color: #26303F; + } + .nav-list .item.active { + background: #26303F; + color: #1a1a1a; + } + .nav-list .item.active a { + color: #888; + } + .nav-list .disable { + color: #aaa; + background: #fafafa; + text-align: center; + } + .nav-list .item > * { + display: block; + padding: 0 10px; + overflow: hidden; + white-space: nowrap; + text-overflow: ellipsis; + } + .nav-list a:hover { + text-decoration: none; + } + .nav-list .item.error a { + color: #BD362F; + } + .nav-list .item.active.error a { + color: #fff; + background: #BD362F; + } + .nav-list .item.empty a { + color: #f39c12; + } + .nav-list .item.active.empty a { + color: #fff; + background: #f39c12; + } + + .nav-list .nav-header { + padding: 0 10px; + background: #1a1a1a; + border-bottom: 1px solid #2f2f2f; + font-weight: bold; + } + .nav-list .separator { + display: block; + height: 0; + margin: 5px 0; + border-bottom: 1px solid #2f2f2f; + } + + .nav-list .nav-form { + padding: 3px; + text-align: center; + } + +.nav-head { + display: block; + margin: 0; + background: linear-gradient(to bottom, #fff, #f0f0f0); + border-bottom: 1px solid #2f2f2f; + text-align: right; +} + .nav-head .item { + display: inline-block; + padding: 5px 10px; + } + +/* HORIZONTAL-LIST */ +.horizontal-list { + display: table; + table-layout: fixed; + margin: 0; + padding: 0; + width: 100%; +} + .horizontal-list .item { + display: table-cell; + vertical-align: middle; + } + +/* DROPDOWN */ +.dropdown { + position: relative; + display: inline-block; +} + .dropdown-target { + display: none; + } + + .dropdown-menu { + display: none; + min-width: 200px; + margin: 5px 0 0; + padding: 5px 0; + position: absolute; + right: 0px; + background: #1a1a1a; + border: 1px solid #888; + border-radius: 5px; + text-align: left; + } + .dropdown-menu:after { + content: ""; + position: absolute; + top: -6px; + right: 13px; + width: 10px; + height: 10px; + background: #1a1a1a; + border-top: 1px solid #888; + border-left: 1px solid #888; + z-index: -10; + transform: rotate(45deg); + } + .dropdown-header { + display: block; + padding: 0 5px; + color: #888; + font-weight: bold; + font-size: 14px; + line-height: 30px; + } + .dropdown-menu .item { + display: block; + height: 30px; + font-size: 90%; + line-height: 30px; + } + .dropdown-menu > .item > a { + display: block; + padding: 0 25px; + line-height: 30px; + } + .dropdown-menu > .item:hover { + background: #26303F; + color: #888; + } + .dropdown-menu > .item[aria-checked="true"] > a:before { + content: '✓ '; + font-weight: bold; + margin: 0 0 0 -1.2em; + padding: 0 0.2em 0 0; + } + .dropdown-menu > .item:hover > a { + color: #888; + text-decoration: none; + } + .dropdown-menu .input { + display: block; + height: 40px; + font-size: 90%; + line-height: 30px; + } + .dropdown-menu .input select, + .dropdown-menu .input input { + display: block; + height: 20px; + width: 95%; + margin: auto; + padding: 2px 5px; + border-radius: 3px; + } + .dropdown-menu .input select { + width: 70%; + height: auto; + } + .dropdown-menu .separator { + display: block; + height: 0; + margin: 5px 0; + border-bottom: 1px solid #888; + } + .dropdown-target:target ~ .dropdown-menu { + display: block; + z-index: 10; + } + .dropdown-close { + display: inline; + } + .dropdown-close a { + font-size: 0; + position: fixed; + top: 0; bottom: 0; + left: 0; right: 0; + display: block; + z-index: -10; + } + +/* ALERTS */ +.alert { + display: block; + width: 90%; + margin: 15px auto; + padding: 10px 15px; + background: #1a1a1a; + border: 1px solid #ccc; + border-right: 1px solid #aaa; + border-bottom: 1px solid #aaa; + border-radius: 5px; + color: #aaa; +} + .alert-head { + margin: 0; + font-weight: bold; + font-size: 110%; + } + .alert > a { + color: inherit; + text-decoration: underline; + } + .alert-warn { + border: 1px solid #c95; + color: #c95; + } + .alert-success { + border: 1px solid #484; + color: #484; + } + .alert-error { + border: 1px solid #844; + color: #844; + } + +/* ICÔNES */ +.icon { + display: inline-block; + width: 16px; + height: 16px; + vertical-align: middle; + line-height: 16px; +} + +/* Prompt (centré) */ +.prompt > h1, .prompt > p { + text-align:center; +} +.prompt > form { + margin:1em auto 2.5em auto; + width:10em; +} +.prompt .btn { + display:block; + margin:.5em auto; +} +.prompt input { + margin:.4em auto 1.1em auto; + width:99%; +} |
