feature/css-datei #11

Merged
TorstenHettstedt merged 4 commits from feature/css-datei into master 2021-04-15 10:55:54 +02:00
15 changed files with 1248 additions and 2 deletions
Showing only changes of commit 338c3ce5e4 - Show all commits
-1
View File
@@ -1 +0,0 @@
+2 -1
View File
@@ -10,7 +10,8 @@
<title>Svelte app</title> <title>Svelte app</title>
<link rel='icon' type='image/png' href='/favicon.png'> <link rel='icon' type='image/png' href='/favicon.png'>
<link rel="stylesheet" href="/global.css"> <link rel="stylesheet" href="/global.css" media="screen">
<link rel="stylesheet" href="/print.css" media="print">
<link rel="stylesheet" href="/bundle.css"> <link rel="stylesheet" href="/bundle.css">
<script type="module" src="https://unpkg.com/dimport?module" data-main="/index.js"></script> <script type="module" src="https://unpkg.com/dimport?module" data-main="/index.js"></script>
<script nomodule src="https://unpkg.com/dimport/nomodule" data-main="/index.js"></script> <script nomodule src="https://unpkg.com/dimport/nomodule" data-main="/index.js"></script>
+19
View File
@@ -0,0 +1,19 @@
// Einstellungen auf die Grundlagen zurücksetzen,
// beinhaltet auch Einstellungen für die neuen HTML5-Tags
//noinspection CssUnknownTarget
@import "meyer_resets.css";
// Import und Einbindung der Zeichensätze
@import "lesslib/fonts.less";
// Bestimmung der Farben
@import "lesslib/colors.less";
// Mixins des Layouts
@import "lesslib/mixins.less";
// Layout-Unabhängige Mixins
@import "lesslib/mixins.framework.less";
// Bestimmung des grundsätzlichen Erscheinungsbildes der einzelnen Elemente,
// einschließlich des Hauptbereiches
@import "lesslib/basics.less";
// Darstellung unabhängig der Darstellungsgrößen
@import "lesslib/layout.less";
// Darstellung in den verschiedenen Ansichtsgrößen
@import "lesslib/media_queries.less";
+85
View File
@@ -0,0 +1,85 @@
html {
font-size: 100%;
}
body {
color: #000;
font-size: 1em;
font-family: OpenSans, "Lucida Grande", "Lucida Sans Unicode", Verdana, Helvetica, Arial, sans-serif;
text-align: left;
background-color: #fff;
}
strong, b {
font-weight: bold;
}
em, i {
font-style: italic;
}
small {
font-size: 0.8rem;
}
section article {
font-size: 95%;
p, ul, ol, dl {
line-height: 1.5em;
.hyphens();
font-size: 1.00em;
}
p {
text-align: justify;
}
ul, ol {
li {
list-style: initial;
}
}
dl {
dt {
font-weight: 600;
}
}
h1, h2, h3 {
font-weight: bold;
}
h1 {
font-size: 1.50em;
}
h2 {
font-size: 1.30em;
}
h3 {
font-size: 1.20em;
}
table {
colgroup:not(:first-child) col:first-child{
border-left: solid thin;
}
thead {
th {
font-size: 100%;
font-weight: bold;
}
}
}
form {
fieldset {
legend {
font-size: 1.30em;
font-weight: bold;
}
div.zelle > label {
}
}
}
&.http-error {
header {
background: hsl(340, 90%, 50%);
color: hsl(0, 0%, 95%);
}
}
}
+13
View File
@@ -0,0 +1,13 @@
/**
Definition der Farben
*/
@hueMain: 35;
@hueSub: 215;
@mainColor: hsl(@hueMain, 90%, 29%);
@mainColorDark: darken(@mainColor,66%,relativ);
@mainColorLight: lighten(@mainColor,66%,relativ);
@subColor: hsl(@hueSub, 90%, 29%);
@subColorDark: darken(@subColor,66%,relativ);
@subColorLight: lighten(@subColor,66%,relativ);
+43
View File
@@ -0,0 +1,43 @@
@font-face {
font-family: OpenSans;
src: url(../fonts/opensans-regular.eot);
src: url(../fonts/opensans-regular.eot?#iefix) format("embedded-opentype"),
url(../fonts/opensans-regular.woff) format("woff"),
url(../fonts/opensans-regular.ttf) format("truetype"),
url(../fonts/opensans-regular.svg#open_sansregular) format("svg");
font-weight: normal;
font-style: normal;
}
@font-face {
font-family: OpenSans;
src: url(../fonts/opensans-italic.eot);
src: url(../fonts/opensans-italic.eot?#iefix) format("embedded-opentype"),
url(../fonts/opensans-italic.woff) format("woff"),
url(../fonts/opensans-italic.ttf) format("truetype"),
url(../fonts/opensans-italic.svg#open_sansitalic) format("svg");
font-weight: normal;
font-style: italic;
}
@font-face {
font-family: OpenSans;
src: url(../fonts/opensans-bold.eot);
src: url(../fonts/opensans-bold.eot?#iefix) format("embedded-opentype"),
url(../fonts/opensans-bold.woff) format("woff"),
url(../fonts/opensans-bold.ttf) format("truetype"),
url(../fonts/opensans-bold.svg#open_sansbold) format("svg");
font-weight: bold;
font-style: normal;
}
@font-face {
font-family: OpenSans;
src: url(../fonts/opensans-bolditalic.eot);
src: url(../fonts/opensans-bolditalic.eot?#iefix) format("embedded-opentype"),
url(../fonts/opensans-bolditalic.woff) format("woff"),
url(../fonts/opensans-bolditalic.ttf) format("truetype"),
url(../fonts/opensans-bolditalic.svg#open_sansbold_italic) format("svg");
font-weight: bold;
font-style: italic;
}
+235
View File
@@ -0,0 +1,235 @@
@breiteMainBereich: 70rem;
@breiteTextBereich: 60rem;
@breiteNavBereich: @breiteMainBereich - @breiteTextBereich;
html {
body {
background: @mainColorLight;
> header, > footer {
color: @mainColorDark;
background: @mainColor;
font-family: serif;
h1 {
font-size: 3rem;
text-align: center;
}
p {
text-indent: inherit;
&:first-letter {
font-size: inherit;
}
font-style: italic;
}
}
> header h1 {
margin: 1rem auto;
}
> footer {
color: contrast(@mainColorDark);
}
& > nav {
ul {
background: darken(@mainColorLight,33%,relativ);
li {
font-weight: bold;
&:not(:first-child) {
border-left: @mainColorDark solid thin;
}
a {
text-decoration: none;
color: @mainColorDark;
}
&:hover {
background: lighten(@mainColor,20%,relativ);
a {
color: lighten(@mainColor,66%,relativ);
}
}
&.selected, &.selected:hover {
background: lighten(@mainColor,10%,relativ);
a {
color: lighten(@mainColor,66%,relativ);
}
}
}
}
}
}
}
main {
* {
border-style: none;
border-color: @mainColorDark;
border-width: medium;
}
section {
@sectionMargin: 1rem;
h1, h2 {
margin: @sectionMargin;
}
p, ul, ol, dl {
margin: @sectionMargin;
text-indent: @sectionMargin * 2;
}
ul, ol {
margin: initial;
li {
margin: initial;
padding: initial;
}
}
dl {
dd {
margin-left: 2em;
}
}
table {
thead {
tr:last-child {
td, th {
border-bottom: @mainColor solid thin;
}
}
}
}
form {
@formLabelWidth: 10rem;
@formItemWidth: 40rem;
fieldset {
width: @formItemWidth + @formLabelWidth + 2rem;
margin: 1rem auto;
border-style: solid ;
border-color: @mainColor;
padding: @sectionMargin;
&.tasten {
border: none;
background-color: @mainColorLight;
}
legend {
margin: @sectionMargin;
margin-left: @sectionMargin * 2;
}
div {
& > label {
width: @formLabelWidth;
display: inline-block;
margin: 0.5rem;
}
input, textarea {
display: inline-block;
width: @formItemWidth;
padding: 0.25rem;
margin-bottom: 1.0rem;
border-style: solid;
border-width: thin;
}
div.radio-button {
padding-left: 20%;
label, input {
display: inline;
width: auto;
}
input {
margin-top: inherit;
margin-right: 1rem;
margin-left: 1rem;
margin-bottom: inherit;
}
}
textarea {
height: 10rem;
}
ul.suche {
width: 30rem;
margin-left: @formLabelWidth + 1.5rem;
margin-top: -1rem;
background: white;
position: absolute;
border: solid thin;
li {list-style: none;
text-indent: 0;
cursor: pointer;
&:hover {
background: @mainColorLight;
color: @mainColor;
}
}
}
}
}
}
button {
.button(@mainColor, spin(lighten(@mainColor,66%,relativ),@subColor));
&.sub-button {
.button(lighten(@mainColor,20%,relativ), spin(@mainColor,@subColor));
}
}
footer {
text-align: right;
padding: 0;
p {
padding: 0.5rem;
display: inline-block;
margin: inherit;
text-indent: inherit;
&:first-letter {
font-size: inherit;
}
background: @mainColorLight ;
color: @mainColor ;
font-style: italic;
font-size: 85%;
}
nav li {
padding: 0.5rem;
}
border-bottom-style: solid;
}
}
}
aside {
background: @mainColorLight ;
li {
background: @mainColorLight;
color: @mainColor;
font-weight: bold ;
&:not(:first-child) {
margin-top: 1rem;
}
a {
display: block;
padding: 1.25rem .5rem;
text-decoration: none;
color: @mainColor;
&:hover, &:active, &:focus {
color: darken(@mainColor,10%,relative);
}
}
&:hover, &:active, &:focus {
background: lighten(@mainColorLight,10%,relative);
}
}
form {
@paddingForm: 0.5rem;
@paddingInput: @paddingForm/2;
background: @mainColorLight;
color: @mainColor;
padding: 2 * @paddingForm @paddingForm;
input {
display: block;
width: @breiteNavBereich - (@paddingForm + @paddingInput) * 2 ;
border: none;
margin-bottom: @paddingForm;
padding: @paddingInput;
}
}
p {
line-height: 1.5em;
text-align: left;
.hyphens();
margin: 1em;
font-size: 85%;
}
}
+267
View File
@@ -0,0 +1,267 @@
//Media Queries
@media print {
* {
font-size: 10pt;
}
header, footer, main, nav, aside {
body > & {
width: 19cm;
margin: auto;
.border-box();
}
}
header, footer{
padding: 0.5rem;
;
}
body {
& > header {
font-size: 200%;
font-weight: bolder;
}
& > nav, > header {
display: none;
}
}
main {
padding: 1.5rem 0.5rem 3.25rem;
.flexKinder(flow,'row');
width: @breiteTextBereich;
section {
padding: 0 0.5rem;
h1, h2, p {
margin-bottom: 1rem;
}
footer {
padding: 0;
p {
padding: 0.5rem;
font-size: 85%;
margin-bottom: 0;
}
}
article.liste {
page-break-after: always;
}
}
h1, h2 {
margin-left: 5em;
}
h1 {
font-size: 2em;
}
h2 {
font-size: 1.75em;
}
table {
margin: auto;
td, th {
padding: 0.5rem;
collapse: true;
}
}
}
aside {
padding-top: 2rem;
.flexKinder(flow,'row');
width: @breiteNavBereich;
}
}
@media screen and (min-width: 831px) {
header, footer, main, nav, aside {
body > & {
width: @breiteMainBereich;
margin: auto;
.border-box();
}
}
header, footer{
padding: 0.5rem;
}
body {
& > header {
font-size: 200%;
font-weight: bolder;
}
& > nav {
ul {
.flexEltern();
margin: 0;
li {
display: inline-block;
height: 1.5rem;
padding: 0.5rem 1rem;
}
}
}
}
main {
padding: 1.5rem 0.5rem 3.25rem;
.flexKinder(flow,'row');
width: @breiteTextBereich;
section {
padding: 0 0.5rem;
h1, h2, p {
margin-bottom: 1rem;
}
footer {
padding: 0;
p {
padding: 0.5rem;
font-size: 85%;
margin-bottom: 0;
}
}
}
h1, h2 {
margin-left: 5em;
}
h1 {
font-size: 2em;
}
h2 {
font-size: 1.75em;
}
table {
margin: auto;
td, th {
padding: 0.5rem;
}
}
}
aside {
padding-top: 2rem;
.flexKinder(flow,'row');
width: @breiteNavBereich;
}
}
@media screen and (max-width: 830px) {
html body {
@boxHeight: 5rem;
& > header {
height: @boxHeight;
font-size: @boxHeight;
text-align: center;
padding: 1rem;
}
& > nav {
background: none;
left:auto;
ul {
li {
display: inline-block;
border: none;
width: auto;
a {
padding: 0.75rem;
}
&:not(:first-child) {
border-left: none;
}
}
}
}
main section {
header {
padding: 0 0.5rem;
h1, h2, p {
margin-bottom: 1rem;
}
h1, h2 {
margin-left: 5em;
}
h1 {
font-size: 2em;
}
h2 {
font-size: 1.75em;
}
}
form {
@formLabelWidth: 10rem;
@formItemWidth: 40rem;
@sectionMargin: 1rem;
fieldset {
width: auto;
margin: 1rem auto;
padding: @sectionMargin;
legend {
margin: @sectionMargin;
margin-left: @sectionMargin * 2;
}
div {
& > label {
width: auto;
display: inline-block;
margin: 0.5rem;
}
input, textarea {
display: inline-block;
width: auto;
padding: 0.25rem;
margin: 0.5rem;
margin-bottom: 1.0rem;
border-style: solid;
border-width: thin;
}
div.radio-button {
padding-left: 20%;
label, input {
display: inline;
width: auto;
}
input {
margin-top: inherit;
margin-right: 1rem;
margin-left: 1rem;
margin-bottom: inherit;
}
}
textarea {
height: 10rem;
}
ul.suche {
width: 30rem;
margin-left: @formLabelWidth + 1.5rem;
margin-top: -1rem;
background: white;
position: absolute;
border: solid thin;
li {list-style: none;
text-indent: 0;
cursor: pointer;
&:hover {
background: @mainColorLight;
color: @mainColor;
}
}
}
}
}
}
}
table {
width: 90%;
margin: 5%;
td, th {
padding: 0.25rem;
}
colgroup:not(:first-child) col:first-child{
border-left: solid thin;
}
thead {
th {
font-size: 100%;
font-weight: bold;
}
}
}
}
}
@media screen and (max-width: 720px) {
}
@@ -0,0 +1,188 @@
.clearfix() {
&:after {
content: ".";
display: block;
height: 0;
line-height: 0;
clear: both;
visibility: hidden;
}
}
.hyphens() {
-webkit-hyphens: auto;
-moz-hyphens: auto;
hyphens: auto;
}
.border-box() {
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
}
.vertical-gradient(@stop1, @stop2) {
.gradient(0deg, @stop1, @stop2);
}
.horizontal-gradient(@stop1, @stop2) {
.gradient(-90deg, @stop1, @stop2);
}
.gradient(@winkel, @stop1, @stop2) {
@winkelOld: @winkel + 90deg;
@groundColor: @stop2;
background: @groundColor -moz-linear-gradient(@winkelOld, @stop2, @stop1);
background: @groundColor -webkit-linear-gradient(@winkelOld, @stop2, @stop1);
background: @groundColor -o-linear-gradient(@winkelOld, @stop2, @stop1);
background: @groundColor -ms-linear-gradient(@winkelOld, @stop2, @stop1);
background: @groundColor linear-gradient(@winkel, @stop2, @stop1);
background-repeat: no-repeat;
}
.box-shadow(...) {
-webkit-box-shadow: @arguments;
-moz-box-shadow: @arguments;
box-shadow: @arguments;
}
.border-radius(...) {
-webkit-border-radius: @arguments;
-moz-border-radius: @arguments;
border-radius: @arguments;
}
.nowrap() {
display: block;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
.mywrap() {
white-space: normal;
}
.hamburgerMenu() {
color: white;
width: 3rem;
height: 2rem;
top: 0.5rem;
right: 0.5rem;
left: auto;
.border-radius(4px);
border: none;
.vertical-gradient(#555; #000);
> ul {
height: auto;
width: auto;
position: absolute;
right: 0;
top: 100%;
background: fade(black,80%);
.border-radius(5px);
display: none;
> li {
display: block;
text-align: left;
line-height: normal;
border: none;
&:not(:first-child) {
border-top: 1px #888 solid;
}
a {
.nowrap();
display: block;
height: auto;
width: auto;
padding: 0.5rem 1rem;
color: white;
&:hover,
&:focus {
color: white;
.vertical-gradient(#59b4fd; #0560e8);
}
}
&:first-child {
a {
.border-radius( 5px 5px 0 0 );
}
}
&:last-child {
a {
.border-radius( 0 0 5px 5px );
}
}
}
}
&:hover, &:focus, &:active {
ul {
display: block;
}
}
&:before {
content: "\2261";
font-size: 2rem;
text-align: center;
line-height: 0.8em;
display: block;
cursor: pointer;
}
}
.transition(@property) {
-moz-transition: ~"@{property}";
-webkit-transition: ~"@{property}";
-o-transition: ~"@{property}";
-ms-transition: ~"@{property}";
transition: ~"@{property}";
-moz-transition-duration: 0.5s;
-webkit-transition-duration: 0.5s;
-o-transition-duration: 0.5s;
-ms-transition-duration: 0.5s;
transition-duration: 0.5s;
}
.flexEltern() {
display:-ms-flexbox;
display: flexbox;
display: -webkit-flex;
display: flex;
}
.flexEltern(column) {
display:-ms-flexbox;
display: flexbox;
display: -webkit-flex;
display: flex;
-webkit-flex-direction: column;
-ms-flex-direction: column;
flex-direction: column;
}
.flexKinder(flow, @rest...) {
-webkit-flex-flow: @rest;
-ms-flex-flow: @rest;
flex-flow: @rest;
}
.flexKinder(glow, @num) {
-webkit-flex-grow: @num;
-ms-flex: @num;
flex: @num;
flex-grow: @num;
}
.background-size(...) {
-webkit-background-size: @arguments;
-moz-background-size: @arguments;
background-size: @arguments;
}
.transform(...) {
-ms-transform: @arguments;
-webkit-transform: @arguments;
-o-transform: @arguments;
-moz-transform: @arguments;
transform: @arguments;
}
+16
View File
@@ -0,0 +1,16 @@
.button(@color, @colorFont) {
@colorBackground: @color;
@colorBackgroundLight: lighten(@colorBackground,50%,relativ);
@colorShadow: fade(@colorBackground,50%);
height: 2.5em;
.border-radius(1.25em);
padding: 0.5em 1.25em;
.vertical-gradient(@colorBackgroundLight, @colorBackground);
.box-shadow(0.1em 0.2em 0.5em @colorShadow);
color: @colorFont;
font-weight: bold;
&:hover {
.vertical-gradient(@colorBackground, @colorBackgroundLight);
}
margin: 0.25rem;
}
+83
View File
@@ -0,0 +1,83 @@
html {
font-size: 100%;
}
body {
color: #000;
font-size: 1em;
font-family: OpenSans, "Lucida Grande", "Lucida Sans Unicode", Verdana, Helvetica, Arial, sans-serif;
text-align: left;
background-color: #fff;
}
strong, b {
font-weight: bold;
}
em, i {
font-style: italic;
}
small {
font-size: 0.8rem;
}
section article {
font-size: 95%;
p, ul, ol, dl {
line-height: 1.5em;
//noinspection TaskProblemsInspection,LessResolvedByNameOnly
.hyphens();
font-size: 1.00em;
}
p {
text-align: justify;
}
ul, ol {
li {
list-style: initial;
}
}
dl {
dt {
font-weight: 600;
}
}
h1, h2, h3 {
font-weight: bold;
}
h1 {
font-size: 1.50em;
}
h2 {
font-size: 1.30em;
}
h3 {
font-size: 1.20em;
}
table {
thead {
th {
font-size: 100%;
font-weight: bold;
}
}
}
form {
fieldset {
legend {
font-size: 1.30em;
font-weight: bold;
}
div.zelle > label {
}
}
}
&.http-error {
header {
background: hsl(340, 90%, 50%);
color: hsl(0, 0%, 95%);
}
}
}
+13
View File
@@ -0,0 +1,13 @@
/**
Definition der Farben
*/
@hueMain: 180;
@hueSub: 60;
@mainColor: hsl(@hueMain, 90%, 29%);
@mainColorDark: darken(@mainColor,66%,relativ);
@mainColorLight: lighten(@mainColor,66%,relativ);
@subColor: hsl(@hueSub, 90%, 29%);
@subColorDark: darken(@subColor,66%,relativ);
@subColorLight: lighten(@subColor,66%,relativ);
+218
View File
@@ -0,0 +1,218 @@
html {
body {
> header, > footer {
background: none;
font-family: serif;
h1 {
font-size: 3rem;
text-align: left;
}
p {
text-indent: inherit;
&:first-letter {
font-size: inherit;
}
font-style: italic;
}
}
> header {
border-bottom: black solid thick;
h1 {
margin: 1rem;
}
}
> footer {
color: contrast(@mainColor);
}
}
}
#inhalts-bereich {
background-color: @mainColorLight;
color: @mainColor;
}
main {
* {
border-style: none;
border-color: @mainColorDark;
border-width: medium;
}
section {
@sectionMargin: 1rem;
header {
text-align: center;
}
h1, h2 {
margin: @sectionMargin;
}
p, ul, ol, dl {
margin: @sectionMargin;
text-indent: @sectionMargin * 2;
}
ul, ol {
margin: initial;
li {
margin: initial;
padding: initial;
}
}
dl {
dd {
margin-left: 2em;
}
}
table {
colgroup:not(:first-child) col:first-child{
border-left: solid medium;
}
thead {
tr:last-child {
td, th {
border-bottom: @mainColorDark solid thick;
}
}
}
tbody {
th {
font-weight: bold;
text-align: center;
padding: 1rem 0.5rem;
}
th, td {
padding: 0.5rem;
border-bottom: solid thin;
}
}
}
form {
@formLabelWidth: 10rem;
@formItemWidth: 40rem;
fieldset {
width: @formItemWidth + @formLabelWidth + 2rem;
margin: 1rem auto;
border-style: solid ;
padding: @sectionMargin;
&.tasten {
border: none;
background-color: @mainColorLight;
}
legend {
margin: @sectionMargin;
margin-left: @sectionMargin * 2;
}
}
div.zelle {
& > label {
width: @formLabelWidth;
display: inline-block;
margin: 0.5rem;
}
input, textarea {
display: inline-block;
width: @formItemWidth;
padding: 0.25rem;
margin-bottom: 1.0rem;
border-style: solid;
border-width: thin;
}
div.radio-button {
padding-left: 20%;
label, input {
display: inline;
width: auto;
}
input {
margin-top: inherit;
margin-right: 1rem;
margin-left: 1rem;
margin-bottom: inherit;
}
}
textarea {
height: 10rem;
}
}
button {
@farbeHintergrund: @mainColorLight;
@farbeHintergrundHell: lighten(@farbeHintergrund,50%,relativ);
@farbeText: spin(lighten(@farbeHintergrund,66%,relativ),@mainColor);
@farbeSchatten: fade(@farbeHintergrund,50%);
height: 2.5em;
.border-radius(1.25em);
padding: 0.5em 1.25em;
.vertical-gradient(@farbeHintergrundHell,@farbeHintergrund);
.box-shadow(0.1em 0.2em 0.5em @farbeSchatten);
color: @farbeText;
font-weight: bold;
&:hover {
.vertical-gradient(@farbeHintergrund,@farbeHintergrundHell);
}
margin: 0.25rem;
}
}
footer {
text-align: right;
padding: 0;
p {
padding: 0.5rem;
display: inline-block;
margin: inherit;
text-indent: inherit;
&:first-letter {
font-size: inherit;
}
background: @mainColorLight ;
color: @mainColor ;
font-style: italic;
font-size: 85%;
}
border-bottom-style: solid;
}
}
}
aside {
background: @subColorLight ;
li {
background: @mainColorLight;
color: @mainColor;
font-weight: bold ;
&:not(:first-child) {
margin-top: 1rem;
}
a {
display: block;
padding: 1.25rem .5rem;
text-decoration: none;
color: @mainColor;
&:hover, &:active, &:focus {
color: darken(@mainColor,10%,relative);
}
}
&:hover, &:active, &:focus {
background: lighten(@mainColor,10%,relative);
}
}
form {
@paddingForm: 0.5rem;
@paddingInput: @paddingForm/2;
background: @mainColorLight;
color: @mainColor;
padding: 2 * @paddingForm @paddingForm;
input {
display: block;
width: @mainColor - (@paddingForm + @paddingInput) * 2 ;
border: none;
margin-bottom: @paddingForm;
padding: @paddingInput;
}
}
p {
line-height: 1.5em;
text-align: left;
.hyphens();
margin: 1em;
font-size: 85%;
}
}
+15
View File
@@ -0,0 +1,15 @@
// Einstellungen auf die Grundlagen zurücksetzen,
// beinhaltet auch Einstellungen für die neuen HTML5-Tags
//noinspection CssUnknownTarget
@import "meyer_resets.css";
// Bestimmung der Farben
@import "lesslib/colors.less";
// Mixins des Layouts
@import "lesslib/mixins.less";
// Layout-Unabhängige Mixins
@import "lesslib/mixins.framework.less";
// Bestimmung des grundsätzlichen Erscheinungsbildes der einzelnen Elemente,
// einschließlich des Hauptbereiches
@import "lesslib/print/basics.less";
// Darstellung unabhängig der Darstellungsgrößen
@import "lesslib/print/layout.less";
+51
View File
@@ -0,0 +1,51 @@
/* http://meyerweb.com/eric/tools/css/reset/
v2.0 | 20110126
License: none (public domain)
*/
@media screen {
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed,
figure, figcaption, footer, header, hgroup,
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
margin: 0;
padding: 0;
border: 0;
font: inherit;
font-size: 100%;
vertical-align: baseline;
}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure,
main, /* Korektur: Torsten Lücke 2016-09-01 */
footer, header, hgroup, menu, nav, section {
display: block;
}
body {
line-height: 1;
}
ol, ul {
list-style: none;
}
blockquote, q {
quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
content: '';
content: none;
}
table {
border-collapse: collapse;
border-spacing: 0;
}
}
/* END: meyer_ressets */