Mercurial > hg > fapweb
view examples/css/admin.css @ 1090:04495bb47dc9
Update example admin stylesheet.
author | Matti Hamalainen <ccr@tnsp.org> |
---|---|
date | Thu, 26 Jan 2017 01:59:07 +0200 |
parents | c2839190ca54 |
children |
line wrap: on
line source
@font-face { font-family: 'Oswald'; font-style: normal; font-weight: 300; src: local('Oswald Light'), local('Oswald-Light'), url(oswald.ttf) format('truetype'); } html { -webkit-backface-visibility: hidden; } body { font-size: 16px; font-family: 'Oswald', sans-serif; background: black; margin: 0; padding: 0; color: #0f0; } a { color: white; } a:active, a:focus { outline: none; } /* * Message and image preview boxes */ #messageBox { position: absolute; top: 0; bottom: 0; left: 0; right: 0; z-index: 60; display: none; } #messageBox div.messageBoxControls { text-align: right; } #messageBox > div { position: absolute; z-index: 62; padding: 0.5em; border-radius: 0.5em; } #messageBox div.messageBoxInner { top: 2em; left: 2em; min-width: 50%; height: auto; background: #080; border: 2px solid black; color: white; } #messageBox div.imageBoxInner { top: 2em; left: 2em; background: #444; border: 2px solid black; } #messageBox div.imageBoxInner img { position: relative; } /* * Administration popup box */ #adminPopup { position: absolute; top: 0px; bottom: 0px; left: 0px; right: 0px; z-index: 50; display: none; } #adminPopup > div { position: absolute; top: 25%; left: 10%; height: auto; min-width: 80%; max-width: 80%; z-index: 52; background: black; border: 1px solid green; padding: 1.5em; border-radius: 1em; } /* * Page tabs / tab headers */ #tabHeadersCC { position: relative; top: 0.5em; left: 0; right: 0; height: 3em; z-index: 10; margin: 0; padding-left: 1em; background: #440; } div.tabHeadersSub { font-size: 1em; line-height: 2.7em; } div.tabHeadersSub a, div.ctrlModeControls a { z-index: 15; text-decoration: none; padding-left: 0.25em; padding-right: 0.25em; background: #060; text-shadow: 2px 2px 1px rgba(0,0,0,0.4); border-radius: 0.2em; white-space: nowrap; display: inline-block; margin-bottom: 0.2em; min-width: 6em; } #tabHeadersCC a.active, div.tabHeaders a.active, div.tabHeadersSub a.active { background: #800; } #tabHeadersCC a.inactive, div.tabHeaders a.inactive, div.tabHeadersSub a.inactive { } #tabHeadersCC a { position: relative; display: inline-block; z-index: 15; padding: 0.5em; text-decoration: none; background: #060; text-shadow: 2px 2px 1px rgba(0,0,0,0.4); border-top-left-radius: 0.2em; border-top-right-radius: 0.2em; } #tabHeadersCC a:hover, div.tabHeadersSub a:hover, div.ctrlModeControls a:hover { background: #C8D286; } #tabHeadersCC a:active, div.tabHeadersSub a:active { background: #C8D286; } #tabHeadersCC a.admin { right: -5em; } div.tabContents { position: absolute; left: 0; right: 0; top: 4.5em; bottom: 0; padding: 1em; margin: 0px; overflow-y: scroll; } span.cnotice { font-weight: bold; color: #f00; } #adminContent { position: absolute; top: 0; bottom: 0; left: 0; right: 0; padding: 0; margin: 0; } div.info { padding: 1em; background: black; border-radius: 0.7em; border: 0.2em solid rgba(255,0,0,0.6); } div.votekey { display: inline-block; width: 8em; margin: 0px; text-align: center; padding: 0.5em; background: black; border-right: 1pt dashed green; border-bottom: 1pt dashed green; } div.votekey span.keyid { font-weight: bold; } div.votekey:hover, tr.votekey:hover td { background: #800; } div.vkeyActive, tr.vkeyActive { background: #044; } .vkeyUsed { color: #0f0; } .vkeyUnused { color: red; } /* * Compo/infoscreen controls */ div.ctrlModeControls input[type="radio"] { display: none; } div.ctrlModeControls input[type="radio"] + label:before { content: "O"; display: inline-block; color: green; font-size: 1.5em; margin-right: 0.15em; } div.ctrlModeControls input[type="radio"]:checked + label:before { content: "X"; display: inline-block; color: red; font-weight: bold; font-size: 1.5em; } div.ctrlModeControls input[type="radio"]:checked + label { color: white; font-weight: bold; } div.ctrlModeControls, #ctrlSystemControls { border: 2px solid green; padding: 0.5em; border-radius: 0.5em; background: black; margin: 0.2em; } #ctrlEditDisplaySlide { position: absolute; top: 15%; min-width: 25%; height: auto; left: 15%; min-width: 50%; z-index: 52; display: none; } div.ctrlTitle { font-size: 1.2em; font-weight: bold; } div.ctrlBox { position: relative; display: inline-block; background: black; border: 2px solid green; padding: 0.5em; border-radius: 0.5em; min-height: 12em; vertical-align: top; } div.ctrlButtons { padding: 0.3em; text-align: right; } #ctrlEditRotationList input { display: inline; } #ctrlListRotationLists { width: 30em; } #ctrlListDisplaySlides { width: 25em; } #ctrlCompoControl { display: block; } div.ctrlDBox1, div.ctrlDBox2 { vertical-align: top; border-radius: 0.5em; display: inline-block; } div.ctrlDBox1 { background: #060; } div.ctrlDBox2 { width: 25em; border: 2pt solid #060; } #ctrlCurrCompoData { position: absolute; background: black; right: 0.5em; top: 0.5em; } #ctrlCurrCompoData div.entryData { background: #020; padding: 0.5em; margin: 0.5em; border-radius: 0.5em; overflow: hidden; } #ctrlCurrCompoData .entryAuthor, #ctrlCurrCompoData .entryName { font-weight: bold; color: white; } #ctrlCurrCompoData span.entryFileTitle { font-weight: bold; } #ctrlCurrCompoData span.entryFileName { color: red; } #ctrlCurrCompoData div.entryNotes { padding: 0.2em; border-radius: 0.2em; background: #630; color: white; } div.ctrlBox .selectBox { width: 100%; } div.ctrlInfo { position: fixed; top: 1em; left: 1em; z-index: 52; background: black; border: 1px solid white; padding: 1.5em; color: white; border-radius: 1em; display: none; } div.ctrlBox:hover div.ctrlInfo { display: block; } option { font-family: monospace; } #nstatus { } #adminLogin { padding: 1em; } .overbooked { color: red; } table.attendees,table.vote { width: 100%; } table td, table th { border-radius: 2pt; overflow-x: hidden; } table th { background: #040; } table.attendees .regtime { width: 15%; } table.attendees .oneliner { width: 50%; } table.attendees .name { width: 15%; } table.attendees .groups { width: 15%; } tr.rodd td { background: #010; } tr.reven td { background: #020; } table.attendees tr:hover td { background: #750; } .deleteWarning { background: red; } table.attendees tr.deleteWarning td { background: red; } div.compoItem, div.newsItem { margin: 0; padding: 1em; border-top: 1px solid #0f0; border-bottom: 1px solid #0f0; } h1, h2, h3 { margin: 0; } tr.active td { background: green; } /* * Entries */ div.rodd { background: #020; } div.reven { background: #030; } div.active { border: 1px solid #0f0; } div.deleteWarning { background: red; } div.entryRow { position: relative; margin-top: 1em; margin-bottom: 1em; padding: 0.5em; vertical-align: top; border-radius: 0.2em; } div.entryCell { display: inline-block; vertical-align: top; min-width: 15em; } /* * Individual edit controls */ div.editControl { vertical-align: top; padding: 0.2em; } span.editControlTitle { background: black; display: block; text-align: center; } /* * Specific entry items */ div.entryShowID { background: #800; width: 2em; min-width: 2em; text-align: center; } div.entryActions { position: absolute; right: 0.2em; bottom: 0.2em; min-width: 1em; width: auto; vertical-align: bottom; text-align: right; padding: 0.2em; background: #050; border-radius: 0.4em; } div.compoDesc { display: inline-block; }