diff --git a/index.css b/index.css index 691e46e..805b781 100644 --- a/index.css +++ b/index.css @@ -5,7 +5,6 @@ header { align-items: center; display: flex; - height: 10vh; background-color: deeppink; margin-bottom: 1vh; } @@ -88,7 +87,7 @@ footer{ } } -@media only screen and (max-width: 500px) { +@media screen and (max-width: 400px) { [class*="bannerHeader"] { font-size: 7vh; color: #fff; @@ -108,9 +107,10 @@ footer{ grid-row-start: 2; grid-row-end: 2; } - [class*="infoContainer"] { - display: grid; - grid-template-columns: auto; + .infoContainer { + margin-left: 10vw; + margin-right: 10vw; + display: grid; } [class*="infoImg"] { width: 60vw; @@ -119,11 +119,22 @@ footer{ .linkContainer { grid-template-columns: auto auto; } - .info { - font-size: 6vw; + [class*="info"] { + font-size: 8vw; + } + .infoDiv { + display: grid; + width: 80vw; + text-align: left; + justify-content: center + justify-self: none; } + .infoHeader { - font-size: 9vw; + font-size: 10vw; + margin-top: 5vw; + margin-bottom: 0vw; + color: deeppink; } .grid-container { display: grid; @@ -139,6 +150,19 @@ footer{ } } +@media screen and (min-width: 400px) { + + .info { + font-size: 2vw; + } + .infoDiv { + display: grid; + width: 50vw; + text-align: justify; + justify-content: center + justify-self: none; + } + .infoImg { width: 30vw; } @@ -157,17 +181,6 @@ footer{ justify-self: none; } -.infoDiv { - display: grid; - width: 50vw; - text-align: justify; - justify-content: center - justify-self: none; -} - -.info { - font-size: 2vw; -} .infoHeader { font-size: 3vw; @@ -176,16 +189,6 @@ footer{ color: deeppink; } -.model0 { - width: 50vw; - height: 100vh; -} -.model1 { - width: 50vw; - height: 100vh; -} -.grid-container { - display: grid; - grid-template-columns: auto auto; } + diff --git a/index.php b/index.php index cbdd0da..a8c353f 100644 --- a/index.php +++ b/index.php @@ -43,7 +43,7 @@
-
+
logo diff --git a/locale.yaml b/locale.yaml index 2e83707..2298d32 100644 --- a/locale.yaml +++ b/locale.yaml @@ -40,7 +40,7 @@ info3Header: de-DE: Open Source en-US: Open Source info4: - de-DE: Die Software des KaosCubes baut auf den Grundprogrammiersprachen des Internets sowie Standard Bibliotheken aller Linux Systeme auf. Das heißt der Code ist wartungsfreundlich und sehr kurz. Die Benutzeroberfläche ist einfach gehalten. In deiner Wunschfarbe. Schau dir Informationen an, die dir alles Wichtige erklären. Dabei kannst du so tief einsteigen, wie es dir passt. + de-DE: Die Software des KaosCubes baut auf den Standard Bibliotheken aller Linux Systeme auf. Das heißt der Code ist wartungsfreundlich und sehr kurz. Die Benutzeroberfläche ist einfach gehalten. In deiner Wunschfarbe. en-US: The software of the KaosCube is based on the basic programming languages of the Internet and standard libraries of all Linux systems. This means that the code is easy to maintain and very short. The user interface is kept simple. In the colour of your choice. Look at the information that explains everything important to you. You can go as deep as you like. info4Header: de-DE: Einfachheit