contentdb/app/scss/components.scss

381 lines
5.5 KiB
SCSS
Raw Normal View History

2018-05-09 19:35:36 +02:00
h1 {
margin: 0;
}
h2, h3 {
margin: 5px 0;
}
a {
color: #0be;
font-weight: bold;
text-decoration: none;
}
a:hover {
color: #0df;
text-decoration: underline;
}
/* Containers */
.box {
border-radius: 5px;
margin: 15px 0;
2018-05-18 03:31:38 +02:00
padding: 0;
}
2018-05-18 05:06:27 +02:00
.box h2, .box h3 {
2018-05-18 03:31:38 +02:00
margin: 0;
2018-05-18 05:06:27 +02:00
padding: 0.5em 0.5em 0.5em 15px;
2018-05-18 03:31:38 +02:00
border-bottom: 1px solid #444;
}
2018-05-18 22:35:54 +02:00
.box .box-body {
2018-05-21 23:42:02 +02:00
padding: 1em !important;
2018-05-09 19:35:36 +02:00
}
2018-05-18 05:06:27 +02:00
// .box form {
// padding: 1em;
// }
2018-05-09 19:35:36 +02:00
.box_grey {
background: #333;
border: 1px solid #444;
}
.ul_boxes {
display: block;
margin: 0;
padding: 0;
list-style: none;
}
.ul_boxes > li {
padding: 0;
list-style: none;
}
.box_link {
display: block;
color: #ddd;
text-decoration: none;
}
.box_link:hover{
background: #3a3a3a;
}
2018-05-18 05:06:27 +02:00
2018-05-09 19:35:36 +02:00
/*
buttonset
*/
.buttonset, .buttonset li {
display: block;
margin: 0;
padding: 0;
list-style: none;
}
.buttonset {
margin: 15px 0;
}
2018-05-18 05:18:57 +02:00
.button, .buttonset li a, input[type=submit] {
cursor: pointer;
}
2018-05-18 05:06:27 +02:00
.button, .buttonset li a, input[type=submit], input[type=text],
input[type=password], textarea, select {
2018-05-09 19:35:36 +02:00
text-align: center;
display: inline-block;
2018-05-18 05:06:27 +02:00
padding: 0.4em 1em;
background: rgba(255,255,255,0.07);
border: 1px solid rgba(255,255,255,0.1);
2018-05-09 19:35:36 +02:00
color: #ddd;
border-radius: 5px;
text-decoration: none;
2018-05-18 05:06:27 +02:00
font-size: 100%;
}
2018-05-21 14:50:30 +02:00
header {
.button, .buttonset li a, input[type=submit], input[type=text],
input[type=password], textarea, select {
background: rgba(255,255,255,0.1);
border: 1px solid rgba(255,255,255,0.2);
}
}
2018-05-18 05:06:27 +02:00
input[type=text], input[type=password], textarea, select {
text-align: left;
}
select {
min-width: 200px;
}
select:not([multiple]) {
background: linear-gradient(#444, #333);
}
.form-group {
padding: 8px 0;
}
.form-group label {
display: block;
vertical-align: top;
padding: 0 8px 8px 0;
}
.form-group input, .form-group textarea {
display: block;
min-width: 100%;
max-width: 100%;
}
.box .form-group input, .box .form-group textarea {
min-width: 95%;
max-width: 95%;
}
.form-group textarea {
min-height: 200px;
2018-05-09 19:35:36 +02:00
}
2018-05-18 05:06:27 +02:00
.button:hover, .buttonset li a:hover, input[type=submit]:hover {
background: rgba(255,255,255,0.13);
border: 1px solid rgba(255,255,255,0.17);
2018-05-09 19:35:36 +02:00
text-decoration: none;
2018-05-18 05:18:57 +02:00
color: #ddd;
2018-05-09 19:35:36 +02:00
}
.btn_green {
background: #363 !important;
border: 1px solid #473;
}
.btn_green:hover {
background: #474 !important;
}
.linedbuttonset a {
border: 1px solid #eee;
border-radius: 3px;
padding: 4px 10px;
margin: 0;
display: block;
}
.linedbuttonset {
display: block;
margin: 0;
}
.linedbuttonset li {
display: inline-block;
margin: 10px 10px 0 0;
}
/* Alerts */
2018-05-18 22:35:54 +02:00
.alert {
padding: 10px;
position: relative;
}
.alert .alert_right, .alert > form {
display: inline-block;
margin: 0;
padding: 0;
position: absolute;
top: 0;
right: 0;
bottom: 0;
}
.alert .alert_right form {
height: 100%;
}
.alert form {
display: inline-block;
margin: 0;
padding: 0;
}
.alert input {
margin: 0;
height: 100%;
background: 0;
border: 0;
border-left: 1px solid rgba(255,255,255,0.12);
border-radius: 0;
}
.alert input:hover {
border: 0;
border-left: 1px solid rgba(255,255,255,0.2);
}
2018-05-09 19:35:36 +02:00
#alerts {
list-style: none;
position: fixed;
bottom: 15px;
left: 0;
right: 0;
}
#alerts .alert {
margin: 5px 0;
vertical-align: middle;
}
#alerts .close {
float: right;
color: white;
}
#alerts .close:hover {
color: #fff;
}
.alert-error {
background: #933;
border: 1px solid #c44;
}
.alert-warning {
background: #963;
border: 1px solid #c96;
}
.alert-success {
background: #161;
border: 1px solid #393;
}
2018-05-14 15:46:41 +02:00
table.fancyTable {
2018-05-14 15:46:41 +02:00
font-family: "Arial Black", Gadget, sans-serif;
border: 2px solid #000000;
background-color: #4A4A4A;
width: 100%;
text-align: center;
border-collapse: collapse;
}
table.fancyTable td, table.fancyTable th {
2018-05-14 15:46:41 +02:00
border: 1px solid #4A4A4A;
padding: 3px 2px;
}
table.fancyTable tbody td {
2018-05-14 15:46:41 +02:00
font-size: 13px;
color: #E6E6E6;
}
table.fancyTable tr:nth-child(even) {
2018-05-14 15:46:41 +02:00
background: #888888;
}
table.fancyTable thead {
2018-05-14 15:46:41 +02:00
background: #000000;
border-bottom: 3px solid #000000;
}
table.fancyTable thead th {
2018-05-14 15:46:41 +02:00
font-size: 15px;
font-weight: bold;
color: #E6E6E6;
text-align: center;
border-left: 2px solid #4A4A4A;
}
table.fancyTable thead th:first-child {
2018-05-14 15:46:41 +02:00
border-left: none;
}
table.fancyTable tfoot {
2018-05-14 15:46:41 +02:00
font-size: 12px;
font-weight: bold;
color: #E6E6E6;
background: #000000;
background: -moz-linear-gradient(top, #404040 0%, #191919 66%, #000000 100%);
background: -webkit-linear-gradient(top, #404040 0%, #191919 66%, #000000 100%);
background: linear-gradient(to bottom, #404040 0%, #191919 66%, #000000 100%);
border-top: 1px solid #4A4A4A;
}
table.fancyTable tfoot td {
2018-05-14 15:46:41 +02:00
font-size: 12px;
}
2018-05-15 16:00:07 +02:00
2018-05-18 22:35:54 +02:00
.t-mll tr td:not(:first-child) {
text-align: left;
}
2018-05-15 16:00:07 +02:00
.userlist li.NOT_JOINED {
color: #aaa;
}
.NOT_JOINED a, a.NOT_JOINED {
color: #7ac;
}
.ADMIN a, a.ADMIN{
color: #e30;
}
.MODERATOR a, a.MODERATOR {
color: #e90;
}
.EDITOR a, a.EDITOR {
color: #b6f;
}
2018-05-18 03:31:38 +02:00
/*
Aside
*/
.asideright {
float: right;
margin: 0 0 0 15px;
max-width: 300px;
}
.outsidecontainer {
position: absolute;
right: 102%;
top: 0;
width: intrinsic; /* Safari/WebKit uses a non-standard name */
width: -moz-max-content; /* Firefox/Gecko */
width: -webkit-max-content; /* Chrome */
}
@media (max-width: 1490px) {
.outsidecontainer {
display: none;
}
}
.flatlist, .flatlist li {
list-style: none;
padding: 0;
margin: 0;
}
.flatlist li {
display: block;
}
.flatlist a {
display: block;
padding: 0.5em 20px;
color: #ddd;
font-weight: normal;
}
.flatlist a:hover {
background: #444;
text-decoration: none;
}
2018-05-21 23:20:28 +02:00
.table-topalign td {
vertical-align: top;
}