gradido/websrc/src/less/05-screen.less
2020-05-27 18:02:01 +02:00

163 lines
2.9 KiB
Plaintext

/* ============================================================
Screen styles.
Datei : screen.less
Datum : 2020-04-30
Autor : Christine Slotty
Copyright : Gradio
============================================================*/
@media screen {
/* =======================
Basis
=======================*/
html,
body {
font-family: 'Roboto', sans-serif;
font-size: @body-fs;
line-height: @body-lh;
color: @main-text;
background-color: @main-background;
margin: 0;
overflow: hidden;
}
/* =======================
Kopfbereich
=======================*/
.header {
display: flex;
justify-content: space-between;
align-items: center;
flex: flex-grow;
width: 100%;
padding: 1em;
background-color: @menu-background;
}
/* =======================
Fußbereich
=======================*/
.footer {
display: flex;
flex-direction: column;
justify-content: flex-start;
align-items: center;
font-size: @footer-fs;
font-style: italic;
}
.bottomright {
position: fixed;
bottom: 0;
right: 0;
color: @unobtrusive;
font-size: @devinfo-fs;
line-height: 1.125em;
padding-right: 0.25em;
text-align: right;
}
.bottomleft {
position: fixed;
bottom: 0;
left: 0;
color: @unobtrusive;
font-size: @devinfo-fs;
line-height: 1.125em;
padding-left: 0.25em;
}
/* =======================
Gradido
=======================*/
/* Gradido Transform */
.gdt-text-color {
color: @gdt-text;
}
/* =======================
Sonstige
=======================*/
/* Hyperlinks */
a {
text-decoration: none;
color: inherit;
}
main a {
text-decoration: underline;
font-style: italic;
}
a:link,
a:visited {
color: inherit;
}
a:hover,
a:focus {
text-decoration: underline;
}
a:active {
background-color: @menu-background;
color: @main-link-text;
}
a:focus,
a:active {
outline: none;
}
a.grd_invisible_link {
color: @main-link-text;
text-decoration: none;
}
a.grd_invisible_link:hover {
color: @unobtrusive;
}
/* layout helper */
.grd_margin_5 {
margin: 5px;
}
.grd-margin-top-10 {
margin-top: 10px;
}
.grd-width-200 {
width: 200px;
}
.grd_margin-bottom {
margin-bottom: 5px;
}
.grd_right {
float: right;
}
.grd_clickable {
cursor: pointer;
}
.grd-no-style {
list-style: none;
}
.grd_small {
margin-top: 2px;
margin-bottom: 2px;
}
}
/* Ende @media screen */