Added SOMtonight (tm) css files
This commit is contained in:
parent
a849d56204
commit
8eb336df03
Binary file not shown.
|
After Width: | Height: | Size: 6.0 KiB |
|
|
@ -0,0 +1,207 @@
|
|||
/* Global styles */
|
||||
body {
|
||||
background-color: #121212;
|
||||
}
|
||||
|
||||
/* Login screen */
|
||||
/* Background */
|
||||
.stpanel section div#logo figure.figurelogo {
|
||||
filter: grayscale(100%) brightness(400%);
|
||||
}
|
||||
.stpanel section {
|
||||
background-color: #121212;
|
||||
}
|
||||
/* Marketing text */
|
||||
.stpanel section div#marketing {
|
||||
color: #e1e1e1;
|
||||
}
|
||||
/* Form container and messages */
|
||||
.stpanel section div.form--holder .stpanel--error--message, .stpanel section div.form--holder form {
|
||||
color: #e1e1e1;
|
||||
box-shadow: unset;
|
||||
background-color: #1E1E1E;
|
||||
}
|
||||
.stpanel .loader--dot1, .stpanel .loader--dot2, .stpanel .loader--dot3, .stpanel .loader--dot4 {
|
||||
background-color: #01A299;
|
||||
}
|
||||
.stpanel--loader {
|
||||
background-color: unset;
|
||||
}
|
||||
.stpanel--links a {
|
||||
color: #017374;
|
||||
}
|
||||
.stpanel--links a:hover {
|
||||
color: #00B3A6;
|
||||
}
|
||||
/* Slogan */
|
||||
.stpanel section div#slogan span:last-of-type {
|
||||
color: #01A299;
|
||||
}
|
||||
/* Inputs */
|
||||
.stpanel .form--input input {
|
||||
color: #e1e1e1;
|
||||
border-color: #e1e1e1;
|
||||
background-color: #383838;
|
||||
}
|
||||
.stpanel .form--input input:focus {
|
||||
color: #ebebeb;
|
||||
border-color: #70EFDE;
|
||||
}
|
||||
.stpanel .form--input.state-disabled input {
|
||||
background-color: #01A299;
|
||||
border-color: #01A299;
|
||||
color: #ebebeb;
|
||||
}
|
||||
.stpanel .form--input i {
|
||||
color: #ebebeb;
|
||||
}
|
||||
.stpanel .form--input i:hover {
|
||||
color: #a5a5a5;
|
||||
}
|
||||
/* Checkbox */
|
||||
.stpanel .form--checkbox:focus i, .stpanel .form--checkbox:hover i, .stpanel .form--radio:focus i, .stpanel .form--radio:hover i, .stpanel .form--select:focus select, .stpanel .form--select:hover select, .stpanel--screensaver .form--select:focus select, .stpanel--screensaver .form--select:hover select {
|
||||
border-color: #01A299;
|
||||
}
|
||||
.stpanel .form--checkbox input + i::after{
|
||||
color: #e1e1e1;
|
||||
}
|
||||
.stpanel .form--checkbox input:checked + i, .stpanel .form--radio input:checked + i {
|
||||
background-color: #01A299;
|
||||
border-color: #01A299;
|
||||
}
|
||||
/* Buttons */
|
||||
.button--stpanel, button.button--stpanel, input[type="submit"].button--stpanel {
|
||||
color: #01A299;
|
||||
}
|
||||
.stpanel section div#marketing a.btn, .stpanel section div.form--holder .stpanel--error--message a.button--stpanel, .stpanel section div.form--holder form a.button--stpanel, .stpanel--meldingen a.button--stpanel, .stpanel--screensaver section div.form--holder .stpanel--error--message a.button--stpanel, .stpanel--screensaver section div.form--holder form a.button--stpanel {
|
||||
border-color: #01A299;
|
||||
color: #01A299!important;
|
||||
}
|
||||
.stpanel section div#marketing a.btn:hover, .button--stpanel:active, .button--stpanel:focus, .button--stpanel:hover, .stpanel section div.form--holder .stpanel--error--message a.button--stpanel:active, .stpanel section div.form--holder .stpanel--error--message a.button--stpanel:focus, .stpanel section div.form--holder .stpanel--error--message a.button--stpanel:hover, .stpanel section div.form--holder form a.button--stpanel:active, .stpanel section div.form--holder form a.button--stpanel:focus, .stpanel section div.form--holder form a.button--stpanel:hover, .stpanel--meldingen a.button--stpanel:active, .stpanel--meldingen a.button--stpanel:focus, .stpanel--meldingen a.button--stpanel:hover, .stpanel--screensaver section div.form--holder .stpanel--error--message a.button--stpanel:active, .stpanel--screensaver section div.form--holder .stpanel--error--message a.button--stpanel:focus, .stpanel--screensaver section div.form--holder .stpanel--error--message a.button--stpanel:hover, .stpanel--screensaver section div.form--holder form a.button--stpanel:active, .stpanel--screensaver section div.form--holder form a.button--stpanel:focus, .stpanel--screensaver section div.form--holder form a.button--stpanel:hover, button.button--stpanel:active, button.button--stpanel:focus, button.button--stpanel:hover, input[type="submit"].button--stpanel:active, input[type="submit"].button--stpanel:focus, input[type="submit"].button--stpanel:hover {
|
||||
background:#01A299;
|
||||
color: #e1e1e1!important;
|
||||
}
|
||||
/* Footer */
|
||||
footer > span {
|
||||
color: #e1e1e1;
|
||||
}
|
||||
|
||||
/* Main screen */
|
||||
/* Header */
|
||||
span.logo {
|
||||
opacity: 0.75;
|
||||
}
|
||||
#header-wrapper {
|
||||
background-color: #1E1E1E;
|
||||
}
|
||||
#header-wrapper a {
|
||||
color: #a5a5a5!important;
|
||||
}
|
||||
#header-wrapper a:hover {
|
||||
color: #e1e1e1!important;
|
||||
opacity: 1;
|
||||
}
|
||||
span.header {
|
||||
color: unset;
|
||||
}
|
||||
#user img {
|
||||
display: none;
|
||||
}
|
||||
#user span.header {
|
||||
color: unset;
|
||||
}
|
||||
span#inbox-counter {
|
||||
background-color: #01A299;
|
||||
color: #121212!important;
|
||||
}
|
||||
|
||||
/* Content Window */
|
||||
/* Main menu */
|
||||
#main-menu a.active, #main-menu a.active:hover {
|
||||
background-color: #01A299;
|
||||
color: #e1e1e1!important;
|
||||
}
|
||||
#main-menu a {
|
||||
background-color: #232323;
|
||||
color: #a5a5a5!important;
|
||||
}
|
||||
#main-menu a:hover {
|
||||
background-color: #292929;
|
||||
color: #e1e1e1!important;
|
||||
}
|
||||
#main-menu-bottom {
|
||||
background-color: #01A299;
|
||||
}
|
||||
#content {
|
||||
box-shadow: unset;
|
||||
}
|
||||
/* Panels */
|
||||
#master-panel, #master-panel .panel-header {
|
||||
background-color: #1E1E1E;
|
||||
border: unset;
|
||||
color: #e1e1e1;
|
||||
}
|
||||
.panel-header h2, #detail-panel h2, #detail-panel h3 {
|
||||
color: #e1e1e1;
|
||||
}
|
||||
#master-panel h2, h1 {
|
||||
color: #e1e1e1;
|
||||
}
|
||||
#master-panel .sub {
|
||||
color: #a5a5a5;
|
||||
}
|
||||
div#detail-panel-wrapper {
|
||||
background-color: #232323;
|
||||
}
|
||||
#master-panel ~ #detail-panel-wrapper, #content {
|
||||
border: unset!important;
|
||||
}
|
||||
/* Date and type tags */
|
||||
#master-panel .date div, .pauze, .roster-table-header .day .huiswerk-items, .uurNummer, .type {
|
||||
background-color: #2C2C2C!important;
|
||||
color: #e1e1e1!important;
|
||||
border-color: #a5a5a5!important;
|
||||
}
|
||||
#master-panel .date div p.date-day, #master-panel .date div p.date-month, #master-panel .date span {
|
||||
color: #e1e1e1!important;
|
||||
}
|
||||
#master-panel .date div {
|
||||
border-right: 0px !important;
|
||||
margin: 0 0 0 -40px !important;
|
||||
padding: 5px !important;
|
||||
}
|
||||
#master-panel .date div p.date-day {
|
||||
background: unset;
|
||||
}
|
||||
/* Top-right buttons */
|
||||
.ribbon .chk.checked, .ribbon .chk:hover, .ribbon.chk.checked, .yellow.ribbon a {
|
||||
color:#e1e1e1;
|
||||
border-bottom: 3px solid #00C4B4;
|
||||
background-color: unset!important;
|
||||
}
|
||||
.ribbon .chk, .ribbon .chk.checked:hover{
|
||||
color: #a5a5a5;
|
||||
border-color: #019592;
|
||||
}
|
||||
.yellow.ribbon span {
|
||||
color: #a5a5a5;
|
||||
}
|
||||
/* Box items */
|
||||
.box {
|
||||
background-color: #2C2C2C;
|
||||
color: #e1e1e1;
|
||||
border: unset;
|
||||
margin-top: 5px;
|
||||
}
|
||||
.m-element {
|
||||
color: #e1e1e1;
|
||||
border: unset!important;
|
||||
}
|
||||
.m-element:hover {
|
||||
background-color: #2C2C2C;
|
||||
}
|
||||
/* Ions */
|
||||
.icon-geen-van-beide, .icon-huiswerk, .icon-leermiddelen, .icon-maatregel, .icon-studiewijzer, .icon-toets {
|
||||
background-color: #01A299;
|
||||
color: #121212!important;
|
||||
}
|
||||
|
|
@ -42,7 +42,8 @@
|
|||
"js": [
|
||||
"vendor/browser-polyfill.js",
|
||||
"content/js/index.js"
|
||||
]
|
||||
],
|
||||
"css": [ "content/css/index.css" ]
|
||||
}
|
||||
]
|
||||
|
||||
|
|
|
|||
Loading…
Reference in New Issue