Formatting documents
This commit is contained in:
parent
6e2b0b2360
commit
03d66f6d1c
15 changed files with 1615 additions and 1342 deletions
|
@ -1,7 +1,5 @@
|
|||
{
|
||||
"semi": false,
|
||||
"plugins": [
|
||||
"@trivago/prettier-plugin-sort-imports"
|
||||
],
|
||||
"plugins": ["@trivago/prettier-plugin-sort-imports"],
|
||||
"pluginSearchDirs": false
|
||||
}
|
||||
|
|
|
@ -2,39 +2,39 @@
|
|||
"name": "App",
|
||||
"icons": [
|
||||
{
|
||||
"src": "\/android-icon-36x36.png",
|
||||
"src": "/android-icon-36x36.png",
|
||||
"sizes": "36x36",
|
||||
"type": "image\/png",
|
||||
"type": "image/png",
|
||||
"density": "0.75"
|
||||
},
|
||||
{
|
||||
"src": "\/android-icon-48x48.png",
|
||||
"src": "/android-icon-48x48.png",
|
||||
"sizes": "48x48",
|
||||
"type": "image\/png",
|
||||
"type": "image/png",
|
||||
"density": "1.0"
|
||||
},
|
||||
{
|
||||
"src": "\/android-icon-72x72.png",
|
||||
"src": "/android-icon-72x72.png",
|
||||
"sizes": "72x72",
|
||||
"type": "image\/png",
|
||||
"type": "image/png",
|
||||
"density": "1.5"
|
||||
},
|
||||
{
|
||||
"src": "\/android-icon-96x96.png",
|
||||
"src": "/android-icon-96x96.png",
|
||||
"sizes": "96x96",
|
||||
"type": "image\/png",
|
||||
"type": "image/png",
|
||||
"density": "2.0"
|
||||
},
|
||||
{
|
||||
"src": "\/android-icon-144x144.png",
|
||||
"src": "/android-icon-144x144.png",
|
||||
"sizes": "144x144",
|
||||
"type": "image\/png",
|
||||
"type": "image/png",
|
||||
"density": "3.0"
|
||||
},
|
||||
{
|
||||
"src": "\/android-icon-192x192.png",
|
||||
"src": "/android-icon-192x192.png",
|
||||
"sizes": "192x192",
|
||||
"type": "image\/png",
|
||||
"type": "image/png",
|
||||
"density": "4.0"
|
||||
}
|
||||
]
|
||||
|
|
|
@ -1,4 +1,4 @@
|
|||
import { Html, Head, Main, NextScript } from 'next/document'
|
||||
import { Html, Head, Main, NextScript } from "next/document"
|
||||
|
||||
export default function Document() {
|
||||
return (
|
||||
|
|
|
@ -1,13 +0,0 @@
|
|||
// Next.js API route support: https://nextjs.org/docs/api-routes/introduction
|
||||
import type { NextApiRequest, NextApiResponse } from 'next'
|
||||
|
||||
type Data = {
|
||||
name: string
|
||||
}
|
||||
|
||||
export default function handler(
|
||||
req: NextApiRequest,
|
||||
res: NextApiResponse<Data>
|
||||
) {
|
||||
res.status(200).json({ name: 'John Doe' })
|
||||
}
|
|
@ -1,9 +1,9 @@
|
|||
import Head from 'next/head'
|
||||
import Image from 'next/image'
|
||||
import { Inter } from 'next/font/google'
|
||||
import styles from '@/styles/Home.module.css'
|
||||
import styles from "@/styles/Home.module.css"
|
||||
import { Inter } from "next/font/google"
|
||||
import Head from "next/head"
|
||||
import Image from "next/image"
|
||||
|
||||
const inter = Inter({ subsets: ['latin'] })
|
||||
const inter = Inter({ subsets: ["latin"] })
|
||||
|
||||
export default function Home() {
|
||||
return (
|
||||
|
@ -26,7 +26,7 @@ export default function Home() {
|
|||
target="_blank"
|
||||
rel="noopener noreferrer"
|
||||
>
|
||||
By{' '}
|
||||
By{" "}
|
||||
<Image
|
||||
src="/vercel.svg"
|
||||
alt="Vercel Logo"
|
||||
|
|
|
@ -97,7 +97,7 @@
|
|||
|
||||
.center::before,
|
||||
.center::after {
|
||||
content: '';
|
||||
content: "";
|
||||
left: 50%;
|
||||
position: absolute;
|
||||
filter: blur(45px);
|
||||
|
|
|
@ -1,9 +1,9 @@
|
|||
:root {
|
||||
--max-width: 1100px;
|
||||
--border-radius: 12px;
|
||||
--font-mono: ui-monospace, Menlo, Monaco, 'Cascadia Mono', 'Segoe UI Mono',
|
||||
'Roboto Mono', 'Oxygen Mono', 'Ubuntu Monospace', 'Source Code Pro',
|
||||
'Fira Mono', 'Droid Sans Mono', 'Courier New', monospace;
|
||||
--font-mono: ui-monospace, Menlo, Monaco, "Cascadia Mono", "Segoe UI Mono",
|
||||
"Roboto Mono", "Oxygen Mono", "Ubuntu Monospace", "Source Code Pro",
|
||||
"Fira Mono", "Droid Sans Mono", "Courier New", monospace;
|
||||
|
||||
--foreground-rgb: 0, 0, 0;
|
||||
--background-start-rgb: 214, 219, 220;
|
||||
|
|
|
@ -1,4 +1,4 @@
|
|||
*{
|
||||
* {
|
||||
scroll-margin-block-start: 60px;
|
||||
scroll-margin-block-end: 60px;
|
||||
box-sizing: border-box;
|
||||
|
@ -7,19 +7,32 @@
|
|||
max-height: 100%;
|
||||
}
|
||||
|
||||
::-webkit-scrollbar {width: 9px;}
|
||||
::-webkit-scrollbar-track {background: rgb(41, 41, 41);}
|
||||
::-webkit-scrollbar-thumb {background: #7f5af0;border-radius: 5px;}
|
||||
::-webkit-scrollbar-thumb:hover {background: #555;}
|
||||
::-webkit-scrollbar {
|
||||
width: 9px;
|
||||
}
|
||||
::-webkit-scrollbar-track {
|
||||
background: rgb(41, 41, 41);
|
||||
}
|
||||
::-webkit-scrollbar-thumb {
|
||||
background: #7f5af0;
|
||||
border-radius: 5px;
|
||||
}
|
||||
::-webkit-scrollbar-thumb:hover {
|
||||
background: #555;
|
||||
}
|
||||
|
||||
[class*="col-"] {float: left;}
|
||||
.row{clear: both;}
|
||||
[class*="col-"] {
|
||||
float: left;
|
||||
}
|
||||
.row {
|
||||
clear: both;
|
||||
}
|
||||
|
||||
#navbar {
|
||||
z-index: 1;
|
||||
overflow-y: auto;
|
||||
overflow-x: hidden;
|
||||
background-color:#121629;
|
||||
background-color: #121629;
|
||||
position: fixed;
|
||||
top: 0;
|
||||
width: 155px;
|
||||
|
@ -27,8 +40,13 @@
|
|||
margin-left: -8px;
|
||||
}
|
||||
|
||||
#navbar button{border-radius: 16px;scale: 0.9;}
|
||||
#navbar button:hover{scale: 1.06;}
|
||||
#navbar button {
|
||||
border-radius: 16px;
|
||||
scale: 0.9;
|
||||
}
|
||||
#navbar button:hover {
|
||||
scale: 1.06;
|
||||
}
|
||||
|
||||
#navbar a {
|
||||
float: none;
|
||||
|
@ -50,7 +68,7 @@
|
|||
z-index: 1;
|
||||
margin-left: -8px;
|
||||
overflow: visible;
|
||||
background-color:#121629;
|
||||
background-color: #121629;
|
||||
position: fixed;
|
||||
bottom: 0;
|
||||
width: 100%;
|
||||
|
@ -60,9 +78,12 @@
|
|||
justify-content: space-between;
|
||||
}
|
||||
|
||||
#sidenavbar button{all: unset;}
|
||||
#sidenavbar button {
|
||||
all: unset;
|
||||
}
|
||||
|
||||
#sidenavbar a, button {
|
||||
#sidenavbar a,
|
||||
button {
|
||||
margin: 5px auto;
|
||||
color: #eff0f3;
|
||||
padding-left: 10px;
|
||||
|
@ -78,10 +99,13 @@
|
|||
cursor: pointer;
|
||||
}
|
||||
|
||||
#sidenavbar button{all: unset;}
|
||||
|
||||
.main {height: 100%;}
|
||||
#sidenavbar button {
|
||||
all: unset;
|
||||
}
|
||||
|
||||
.main {
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
body {
|
||||
background-color: #16161a;
|
||||
|
@ -89,11 +113,27 @@ body {
|
|||
text-align: center;
|
||||
font-size: 1.4em;
|
||||
}
|
||||
h1 {font-size: 2.5em;color: #fffffe;}
|
||||
h2 {font-size: 2em;color: #fffffe;}
|
||||
h3 {font-size: 1.6em; clear: both;color: #fffffe;}
|
||||
p {text-align: justify;font-size: 0.875em;}
|
||||
header {text-align: center;padding-left: 140px;}
|
||||
h1 {
|
||||
font-size: 2.5em;
|
||||
color: #fffffe;
|
||||
}
|
||||
h2 {
|
||||
font-size: 2em;
|
||||
color: #fffffe;
|
||||
}
|
||||
h3 {
|
||||
font-size: 1.6em;
|
||||
clear: both;
|
||||
color: #fffffe;
|
||||
}
|
||||
p {
|
||||
text-align: justify;
|
||||
font-size: 0.875em;
|
||||
}
|
||||
header {
|
||||
text-align: center;
|
||||
padding-left: 140px;
|
||||
}
|
||||
|
||||
footer,
|
||||
aside,
|
||||
|
@ -111,23 +151,25 @@ img {
|
|||
}
|
||||
|
||||
button {
|
||||
background-color:#121629;
|
||||
background-color: #121629;
|
||||
color: #eff0f3;
|
||||
text-align: left;
|
||||
padding: 8px 8px;
|
||||
text-decoration: none;
|
||||
font-size: 0.9em;
|
||||
|
||||
}
|
||||
|
||||
p a {
|
||||
text-align: justify;
|
||||
text-decoration: underline;
|
||||
color:#94a1b2;
|
||||
color: #94a1b2;
|
||||
}
|
||||
p a:hover {
|
||||
color: rgb(225, 59, 59);
|
||||
}
|
||||
b {
|
||||
color: #91c4ff;
|
||||
}
|
||||
p a:hover {color: rgb(225, 59, 59);}
|
||||
b{color:#91c4ff;}
|
||||
|
||||
|
||||
.righties {
|
||||
margin: 0 2%;
|
||||
|
@ -138,7 +180,9 @@ b{color:#91c4ff;}
|
|||
transition: width 1.5s;
|
||||
clear: both;
|
||||
}
|
||||
.righties:hover {width: 50%;}
|
||||
.righties:hover {
|
||||
width: 50%;
|
||||
}
|
||||
|
||||
.lefties {
|
||||
margin-right: 20px;
|
||||
|
@ -148,14 +192,18 @@ b{color:#91c4ff;}
|
|||
transition: width 1.5s;
|
||||
display: none;
|
||||
}
|
||||
.lefties:hover {width: 50%;}
|
||||
.lefties:hover {
|
||||
width: 50%;
|
||||
}
|
||||
|
||||
#vcutout {
|
||||
width: 25%;
|
||||
}
|
||||
#vcutout:hover {
|
||||
width: 30%;
|
||||
}
|
||||
|
||||
#vcutout{width: 25%;}
|
||||
#vcutout:hover {width: 30%;}
|
||||
|
||||
|
||||
.hidden{
|
||||
.hidden {
|
||||
/*position:absolute;
|
||||
transform:translate(-50%,-50%);
|
||||
height:200px;
|
||||
|
@ -166,35 +214,61 @@ b{color:#91c4ff;}
|
|||
display: none;
|
||||
}
|
||||
/*wenn hover über text, zeige bild*/
|
||||
.imghover:hover + .hidden{display: block;}
|
||||
|
||||
|
||||
.imghover:hover + .hidden {
|
||||
display: block;
|
||||
}
|
||||
|
||||
.light-mode {
|
||||
background-color:#eff0f3;
|
||||
color:#2a2a2a;
|
||||
background-color: #eff0f3;
|
||||
color: #2a2a2a;
|
||||
}
|
||||
.light-mode article p a{
|
||||
.light-mode article p a {
|
||||
text-align: justify;
|
||||
text-decoration: underline;
|
||||
color:#2a2a2a;
|
||||
color: #2a2a2a;
|
||||
}
|
||||
.light-mode b {
|
||||
color: #2a2a2a;
|
||||
}
|
||||
.light-mode b a {
|
||||
color: #2a2a2a;
|
||||
}
|
||||
.light-mode h3 {
|
||||
color: #2a2a2a;
|
||||
}
|
||||
.light-mode h1 {
|
||||
color: #2a2a2a;
|
||||
}
|
||||
.light-mode h2 {
|
||||
color: #2a2a2a;
|
||||
}
|
||||
.light-mode #navbar {
|
||||
background-color: #b8c1ec;
|
||||
}
|
||||
.light-mode #sidenavbar {
|
||||
background-color: #b8c1ec;
|
||||
}
|
||||
.light-mode #navbar a {
|
||||
color: black;
|
||||
}
|
||||
.light-mode #sidenavbar a {
|
||||
color: black;
|
||||
}
|
||||
.light-mode button {
|
||||
background-color: #b8c1ec;
|
||||
color: black;
|
||||
}
|
||||
.light-mode b{color:#2a2a2a;}
|
||||
.light-mode b a{color: #2a2a2a;}
|
||||
.light-mode h3 {color: #2a2a2a;}
|
||||
.light-mode h1 {color: #2a2a2a;}
|
||||
.light-mode h2 {color: #2a2a2a;}
|
||||
.light-mode #navbar {background-color: #b8c1ec;}
|
||||
.light-mode #sidenavbar {background-color: #b8c1ec;}
|
||||
.light-mode #navbar a {color: black;}
|
||||
.light-mode #sidenavbar a {color: black;}
|
||||
.light-mode button {background-color: #b8c1ec;color: black;}
|
||||
|
||||
|
||||
/*Raster Einstellungen*/
|
||||
.light-mode .raster {background-color: #eff0f3;}
|
||||
.light-mode a {color:#2a2a2a;}
|
||||
a {color: rgb(225, 223, 210);}
|
||||
.light-mode .raster {
|
||||
background-color: #eff0f3;
|
||||
}
|
||||
.light-mode a {
|
||||
color: #2a2a2a;
|
||||
}
|
||||
a {
|
||||
color: rgb(225, 223, 210);
|
||||
}
|
||||
|
||||
.raster {
|
||||
width: 300px;
|
||||
|
@ -209,63 +283,124 @@ a {color: rgb(225, 223, 210);}
|
|||
scale: 0.9;
|
||||
font-size: 0.9em;
|
||||
}
|
||||
a div img, a div video{
|
||||
a div img,
|
||||
a div video {
|
||||
border-radius: 10%;
|
||||
max-width: 260px;
|
||||
max-height: 290px;
|
||||
padding-top: 8px;
|
||||
bottom: 0;
|
||||
}
|
||||
a div h3 {margin: 0.5%;}
|
||||
.raster:hover {scale: 1.06;}
|
||||
.raster:hover a div img {width: 110%;}
|
||||
|
||||
|
||||
.logos {height: 1.6em; margin-bottom: -18px;}
|
||||
|
||||
|
||||
.col-1 {width: 8.33%;}
|
||||
.col-2 {width: 12.5%;}
|
||||
.col-3 {width: 25%;}
|
||||
.col-4 {width: 33.33%;}
|
||||
.col-5 {width: 41.66%;}
|
||||
.col-6 {width: 50%;}
|
||||
.col-7 {width: 58.33%;}
|
||||
.col-8 {width: 66.66%;}
|
||||
.col-9 {width: 75%;}
|
||||
.col-10 {width: 83.33%;}
|
||||
.col-11 {width: 91.66%;}
|
||||
.col-12 {width: 100%;}
|
||||
|
||||
|
||||
@media (max-width: 767px)/*unter handy größe*/{
|
||||
header,article,img,p,h1,h2,h3 {margin-left: 0%;padding-left: 0;}
|
||||
[class*="col-"] {width: 100%;}
|
||||
#navbar {visibility: hidden;}
|
||||
#sidenavbar {visibility: visible;}
|
||||
/*.raster {width: calc(100%/2);}*/
|
||||
.righties {width: 100%;}
|
||||
.righties:hover {width: 100%;}
|
||||
a div h3 {
|
||||
margin: 0.5%;
|
||||
}
|
||||
.raster:hover {
|
||||
scale: 1.06;
|
||||
}
|
||||
.raster:hover a div img {
|
||||
width: 110%;
|
||||
}
|
||||
|
||||
@media only screen and (min-width: 767px)/*über handy größe*/ {
|
||||
#navbar {visibility: visible;}
|
||||
#sidenavbar {visibility: hidden;}
|
||||
.logos {
|
||||
height: 1.6em;
|
||||
margin-bottom: -18px;
|
||||
}
|
||||
|
||||
.col-1 {
|
||||
width: 8.33%;
|
||||
}
|
||||
.col-2 {
|
||||
width: 12.5%;
|
||||
}
|
||||
.col-3 {
|
||||
width: 25%;
|
||||
}
|
||||
.col-4 {
|
||||
width: 33.33%;
|
||||
}
|
||||
.col-5 {
|
||||
width: 41.66%;
|
||||
}
|
||||
.col-6 {
|
||||
width: 50%;
|
||||
}
|
||||
.col-7 {
|
||||
width: 58.33%;
|
||||
}
|
||||
.col-8 {
|
||||
width: 66.66%;
|
||||
}
|
||||
.col-9 {
|
||||
width: 75%;
|
||||
}
|
||||
.col-10 {
|
||||
width: 83.33%;
|
||||
}
|
||||
.col-11 {
|
||||
width: 91.66%;
|
||||
}
|
||||
.col-12 {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
@media (max-width: 767px) /*unter handy größe*/ {
|
||||
header,
|
||||
article,
|
||||
img,
|
||||
p,
|
||||
h1,
|
||||
h2,
|
||||
h3 {
|
||||
margin-left: 0%;
|
||||
padding-left: 0;
|
||||
}
|
||||
[class*="col-"] {
|
||||
width: 100%;
|
||||
}
|
||||
#navbar {
|
||||
visibility: hidden;
|
||||
}
|
||||
#sidenavbar {
|
||||
visibility: visible;
|
||||
}
|
||||
/*.raster {width: calc(100%/2);}*/
|
||||
.righties {
|
||||
width: 100%;
|
||||
}
|
||||
.righties:hover {
|
||||
width: 100%;
|
||||
}
|
||||
}
|
||||
|
||||
@media only screen and (min-width: 767px) /*über handy größe*/ {
|
||||
#navbar {
|
||||
visibility: visible;
|
||||
}
|
||||
#sidenavbar {
|
||||
visibility: hidden;
|
||||
}
|
||||
/*.raster {width: calc(100%/5);}*/
|
||||
div div button {visibility: hidden;}
|
||||
div div button {
|
||||
visibility: hidden;
|
||||
}
|
||||
}
|
||||
|
||||
/*@media screen and (min-width:1200px) {.raster {width: calc(100%/6);}}
|
||||
|
||||
@media screen and (min-width:1500px) {.raster {width: calc(100%/8);}}*/
|
||||
|
||||
@media screen and (min-width:1900px)/*HD Fullscreen only*/ {
|
||||
.lefties {display: block;width: 27%;}
|
||||
.righties {width: 27%;}
|
||||
@media screen and (min-width: 1900px) /*HD Fullscreen only*/ {
|
||||
.lefties {
|
||||
display: block;
|
||||
width: 27%;
|
||||
}
|
||||
.righties {
|
||||
width: 27%;
|
||||
}
|
||||
}
|
||||
|
||||
@media screen and (min-width:2250px)/*ab 2000px nicht weiter skalieren*/ {
|
||||
*{
|
||||
@media screen and (min-width: 2250px) /*ab 2000px nicht weiter skalieren*/ {
|
||||
* {
|
||||
width: 1950px;
|
||||
margin-left: auto;
|
||||
margin-right: auto;
|
||||
|
|
102
todo/Geräte.css
102
todo/Geräte.css
|
@ -1,22 +1,30 @@
|
|||
* {box-sizing: border-box;}
|
||||
|
||||
|
||||
::-webkit-scrollbar {width: 9px;}
|
||||
::-webkit-scrollbar-track {background: rgb(41, 41, 41);}
|
||||
::-webkit-scrollbar-thumb {background: #7f5af0;border-radius: 5px;}
|
||||
::-webkit-scrollbar-thumb:hover {background: #555;}
|
||||
* {
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
::-webkit-scrollbar {
|
||||
width: 9px;
|
||||
}
|
||||
::-webkit-scrollbar-track {
|
||||
background: rgb(41, 41, 41);
|
||||
}
|
||||
::-webkit-scrollbar-thumb {
|
||||
background: #7f5af0;
|
||||
border-radius: 5px;
|
||||
}
|
||||
::-webkit-scrollbar-thumb:hover {
|
||||
background: #555;
|
||||
}
|
||||
|
||||
[class*="col-"] {
|
||||
float: right;
|
||||
}
|
||||
|
||||
|
||||
#sidenavbar {
|
||||
z-index: 1;
|
||||
margin-left: -8px;
|
||||
overflow: visible;
|
||||
background-color:#121629;
|
||||
background-color: #121629;
|
||||
position: fixed;
|
||||
bottom: 0;
|
||||
width: 100%;
|
||||
|
@ -26,9 +34,12 @@
|
|||
justify-content: space-between;
|
||||
}
|
||||
|
||||
#sidenavbar button{all: unset;}
|
||||
#sidenavbar button {
|
||||
all: unset;
|
||||
}
|
||||
|
||||
#sidenavbar a, button {
|
||||
#sidenavbar a,
|
||||
button {
|
||||
margin: 5px auto;
|
||||
color: #eff0f3;
|
||||
padding-left: 10px;
|
||||
|
@ -44,9 +55,13 @@
|
|||
cursor: pointer;
|
||||
}
|
||||
|
||||
#sidenavbar button{border: none;}
|
||||
#sidenavbar button {
|
||||
border: none;
|
||||
}
|
||||
|
||||
.main {height: 100%;}
|
||||
.main {
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
body {
|
||||
background-color: #16161a;
|
||||
|
@ -54,9 +69,13 @@ body {
|
|||
font-size: 1.4em;
|
||||
}
|
||||
|
||||
h1 {font-size: 2.5em;}
|
||||
h1 {
|
||||
font-size: 2.5em;
|
||||
}
|
||||
|
||||
h2 {font-size: 2em;}
|
||||
h2 {
|
||||
font-size: 2em;
|
||||
}
|
||||
|
||||
h3 {
|
||||
font-size: 1.6em;
|
||||
|
@ -68,7 +87,9 @@ p {
|
|||
font-size: 0.875em;
|
||||
}
|
||||
|
||||
header {text-align: center;}
|
||||
header {
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
footer,
|
||||
aside,
|
||||
|
@ -87,22 +108,45 @@ img {
|
|||
display: block;
|
||||
}
|
||||
|
||||
.col-1 {width: 8.33%;}
|
||||
.col-2 {width: 16.66%;}
|
||||
.col-3 {width: 25%;}
|
||||
.col-4 {width: 33.33%;}
|
||||
.col-5 {width: 41.66%;}
|
||||
.col-6 {width: 50%;}
|
||||
.col-7 {width: 58.33%;}
|
||||
.col-8 {width: 66.66%;}
|
||||
.col-9 {width: 75%;}
|
||||
.col-10 {width: 83.33%;}
|
||||
.col-11 {width: 91.66%;}
|
||||
.col-12 {width: 100%;}
|
||||
.col-1 {
|
||||
width: 8.33%;
|
||||
}
|
||||
.col-2 {
|
||||
width: 16.66%;
|
||||
}
|
||||
.col-3 {
|
||||
width: 25%;
|
||||
}
|
||||
.col-4 {
|
||||
width: 33.33%;
|
||||
}
|
||||
.col-5 {
|
||||
width: 41.66%;
|
||||
}
|
||||
.col-6 {
|
||||
width: 50%;
|
||||
}
|
||||
.col-7 {
|
||||
width: 58.33%;
|
||||
}
|
||||
.col-8 {
|
||||
width: 66.66%;
|
||||
}
|
||||
.col-9 {
|
||||
width: 75%;
|
||||
}
|
||||
.col-10 {
|
||||
width: 83.33%;
|
||||
}
|
||||
.col-11 {
|
||||
width: 91.66%;
|
||||
}
|
||||
.col-12 {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
@media only screen and (max-width: 767px) {
|
||||
[class*="col-"] {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
}
|
||||
|
|
|
@ -1,37 +1,95 @@
|
|||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<link rel="apple-touch-icon" sizes="57x57" href="favicon/apple-icon-57x57.png">
|
||||
<link rel="apple-touch-icon" sizes="60x60" href="favicon/apple-icon-60x60.png">
|
||||
<link rel="apple-touch-icon" sizes="72x72" href="favicon/apple-icon-72x72.png">
|
||||
<link rel="apple-touch-icon" sizes="76x76" href="favicon/apple-icon-76x76.png">
|
||||
<link rel="apple-touch-icon" sizes="114x114" href="favicon/apple-icon-114x114.png">
|
||||
<link rel="apple-touch-icon" sizes="120x120" href="favicon/apple-icon-120x120.png">
|
||||
<link rel="apple-touch-icon" sizes="144x144" href="favicon/apple-icon-144x144.png">
|
||||
<link rel="apple-touch-icon" sizes="152x152" href="favicon/apple-icon-152x152.png">
|
||||
<link rel="apple-touch-icon" sizes="180x180" href="favicon/apple-icon-180x180.png">
|
||||
<link rel="icon" type="image/png" sizes="192x192" href="favicon/android-icon-192x192.png">
|
||||
<link rel="icon" type="image/png" sizes="32x32" href="favicon/favicon-32x32.png">
|
||||
<link rel="icon" type="image/png" sizes="96x96" href="favicon/favicon-96x96.png">
|
||||
<link rel="icon" type="image/png" sizes="16x16" href="favicon/favicon-16x16.png">
|
||||
<link rel="manifest" href="favicon/manifest.json">
|
||||
<meta name="msapplication-TileColor" content="#ffffff">
|
||||
<meta name="msapplication-TileImage" content="favicon/ms-icon-144x144.png">
|
||||
<meta name="theme-color" content="#ffffff">
|
||||
<head>
|
||||
<link
|
||||
rel="apple-touch-icon"
|
||||
sizes="57x57"
|
||||
href="favicon/apple-icon-57x57.png"
|
||||
/>
|
||||
<link
|
||||
rel="apple-touch-icon"
|
||||
sizes="60x60"
|
||||
href="favicon/apple-icon-60x60.png"
|
||||
/>
|
||||
<link
|
||||
rel="apple-touch-icon"
|
||||
sizes="72x72"
|
||||
href="favicon/apple-icon-72x72.png"
|
||||
/>
|
||||
<link
|
||||
rel="apple-touch-icon"
|
||||
sizes="76x76"
|
||||
href="favicon/apple-icon-76x76.png"
|
||||
/>
|
||||
<link
|
||||
rel="apple-touch-icon"
|
||||
sizes="114x114"
|
||||
href="favicon/apple-icon-114x114.png"
|
||||
/>
|
||||
<link
|
||||
rel="apple-touch-icon"
|
||||
sizes="120x120"
|
||||
href="favicon/apple-icon-120x120.png"
|
||||
/>
|
||||
<link
|
||||
rel="apple-touch-icon"
|
||||
sizes="144x144"
|
||||
href="favicon/apple-icon-144x144.png"
|
||||
/>
|
||||
<link
|
||||
rel="apple-touch-icon"
|
||||
sizes="152x152"
|
||||
href="favicon/apple-icon-152x152.png"
|
||||
/>
|
||||
<link
|
||||
rel="apple-touch-icon"
|
||||
sizes="180x180"
|
||||
href="favicon/apple-icon-180x180.png"
|
||||
/>
|
||||
<link
|
||||
rel="icon"
|
||||
type="image/png"
|
||||
sizes="192x192"
|
||||
href="favicon/android-icon-192x192.png"
|
||||
/>
|
||||
<link
|
||||
rel="icon"
|
||||
type="image/png"
|
||||
sizes="32x32"
|
||||
href="favicon/favicon-32x32.png"
|
||||
/>
|
||||
<link
|
||||
rel="icon"
|
||||
type="image/png"
|
||||
sizes="96x96"
|
||||
href="favicon/favicon-96x96.png"
|
||||
/>
|
||||
<link
|
||||
rel="icon"
|
||||
type="image/png"
|
||||
sizes="16x16"
|
||||
href="favicon/favicon-16x16.png"
|
||||
/>
|
||||
<link rel="manifest" href="favicon/manifest.json" />
|
||||
<meta name="msapplication-TileColor" content="#ffffff" />
|
||||
<meta
|
||||
name="msapplication-TileImage"
|
||||
content="favicon/ms-icon-144x144.png"
|
||||
/>
|
||||
<meta name="theme-color" content="#ffffff" />
|
||||
|
||||
<meta charset="UTF-8">
|
||||
<meta http-equiv="X-UA-Compatible" content="IE=edge">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<meta charset="UTF-8" />
|
||||
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
||||
<title>KS S22</title>
|
||||
<link rel="stylesheet" href="Geräte.css">
|
||||
</head>
|
||||
<body>
|
||||
<link rel="stylesheet" href="Geräte.css" />
|
||||
</head>
|
||||
<body>
|
||||
<div id="sidenavbar">
|
||||
<a href="javascript:history.back()">Zurück</a>
|
||||
<a href="EUC Überblick DE.html">Start</a>
|
||||
</div>
|
||||
|
||||
|
||||
<div class="row">
|
||||
<div class="col-4">
|
||||
<img src="KS S22/S22shutterkode2.jpg" />
|
||||
|
@ -41,22 +99,50 @@
|
|||
<article>
|
||||
<h2>Kingsong S22</h2>
|
||||
|
||||
<p>Das Kingsong S22, früher S20, ist ein klar Offroad und Trail orientiertes Einrad. Es hat unter anderem 130mm travel und eine robuste Metallkonstruktion, welches es einmalig ideal für große Sprünge und hohe Drops macht. </p>
|
||||
<p>
|
||||
Das Kingsong S22, früher S20, ist ein klar Offroad und Trail
|
||||
orientiertes Einrad. Es hat unter anderem 130mm travel und eine
|
||||
robuste Metallkonstruktion, welches es einmalig ideal für große
|
||||
Sprünge und hohe Drops macht.
|
||||
</p>
|
||||
|
||||
<p>Es ist der Nachfolger vom kleineren S18, aber mit doppeltem Akku und 50% mehr Motor Leistung, so wie 70 statt 50 km/h top Geschwindigkeit. Wobei der Freespin bis zu 114 km/h hoch ist, also ideal für längere Sprünge bei denen der Reifen in der Luft ist. </p>
|
||||
<p>
|
||||
Es ist der Nachfolger vom kleineren S18, aber mit doppeltem Akku und
|
||||
50% mehr Motor Leistung, so wie 70 statt 50 km/h top
|
||||
Geschwindigkeit. Wobei der Freespin bis zu 114 km/h hoch ist, also
|
||||
ideal für längere Sprünge bei denen der Reifen in der Luft ist.
|
||||
</p>
|
||||
|
||||
<p>Außerdem hat es gleich mitgeliefert einen Sitz, ziemlich brauchbare Jump wie Powerpads und Spiked-Pedals. Dazu einen robusten, wenn auch komisch platzierten und etwas kurzen Trolleyhandle, sowie einen stabilen Kickstand und höhenverstellbare helle Lichter. Es ist Wasserfest, aber nicht eintauchbar, und das Beste: es ist superleicht daran zu arbeiten, weil das Gerät sehr modular designt wurde. So lässt sich der Reifen mit theoretisch nur 2 schrauben rausnehmen</p>
|
||||
<p>
|
||||
Außerdem hat es gleich mitgeliefert einen Sitz, ziemlich brauchbare
|
||||
Jump wie Powerpads und Spiked-Pedals. Dazu einen robusten, wenn auch
|
||||
komisch platzierten und etwas kurzen Trolleyhandle, sowie einen
|
||||
stabilen Kickstand und höhenverstellbare helle Lichter. Es ist
|
||||
Wasserfest, aber nicht eintauchbar, und das Beste: es ist
|
||||
superleicht daran zu arbeiten, weil das Gerät sehr modular designt
|
||||
wurde. So lässt sich der Reifen mit theoretisch nur 2 schrauben
|
||||
rausnehmen
|
||||
</p>
|
||||
|
||||
<p>Während all das wahr ist, haben sich leider mit diesem hoch erwartetem und gehypten Rad auch viele Probleme ergeben. So gab es Motorprobleme mit den ersten Geräten, welche zu cut-offs führten und dadurch das Motherboard durchbrannten. Auch ist das Slider Design sehr schwerfällig und über die Zeit immer schwerer zu bewegen. So mussten viele s22 Käufer lange auf Ersatzmotoren warten, so wie für 100 bis 200€ die Slider upgraden. Mit den Upgrades jedoch ist es das momentan bester Suspension Einrad auf dem Markt. (Bis das Veteran Sherman S zu kaufen ist.)</p>
|
||||
<p>
|
||||
Während all das wahr ist, haben sich leider mit diesem hoch
|
||||
erwartetem und gehypten Rad auch viele Probleme ergeben. So gab es
|
||||
Motorprobleme mit den ersten Geräten, welche zu cut-offs führten und
|
||||
dadurch das Motherboard durchbrannten. Auch ist das Slider Design
|
||||
sehr schwerfällig und über die Zeit immer schwerer zu bewegen. So
|
||||
mussten viele s22 Käufer lange auf Ersatzmotoren warten, so wie für
|
||||
100 bis 200€ die Slider upgraden. Mit den Upgrades jedoch ist es das
|
||||
momentan bester Suspension Einrad auf dem Markt. (Bis das Veteran
|
||||
Sherman S zu kaufen ist.)
|
||||
</p>
|
||||
</article>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
<div class="row">
|
||||
<div class="col-4"><img src="KS S22/S22shutterkode5.jpg" /></div>
|
||||
<div class="col-4"><img src="KS S22/BusJump.jpg" /></div>
|
||||
<div class="col-4"><img src="KS S22/S22shutterkode4.jpg"/></div>
|
||||
<div class="col-4"><img src="KS S22/S22shutterkode4.jpg" /></div>
|
||||
</div>
|
||||
|
||||
<table>
|
||||
|
@ -150,7 +236,6 @@
|
|||
<td>nope</td>
|
||||
</tr>
|
||||
|
||||
|
||||
<tr>
|
||||
<td>Accessoires</td>
|
||||
<td>Powerpads, Jumppads, Seat, Spiked-Pedals</td>
|
||||
|
@ -203,9 +288,6 @@
|
|||
<td>Ladeports:</td>
|
||||
<td>2</td>
|
||||
</tr>
|
||||
|
||||
|
||||
</table>
|
||||
|
||||
</body>
|
||||
</body>
|
||||
</html>
|
|
@ -1,4 +1,4 @@
|
|||
*{
|
||||
* {
|
||||
scroll-margin-block-start: 60px;
|
||||
scroll-margin-block-end: 60px;
|
||||
box-sizing: border-box;
|
||||
|
@ -7,26 +7,43 @@
|
|||
max-height: 100%;
|
||||
}
|
||||
|
||||
::-webkit-scrollbar {width: 9px;}
|
||||
::-webkit-scrollbar-track {background: rgb(41, 41, 41);}
|
||||
::-webkit-scrollbar-thumb {background:#ff8906;border-radius: 5px;}
|
||||
::-webkit-scrollbar-thumb:hover {background: #555;}
|
||||
::-webkit-scrollbar {
|
||||
width: 9px;
|
||||
}
|
||||
::-webkit-scrollbar-track {
|
||||
background: rgb(41, 41, 41);
|
||||
}
|
||||
::-webkit-scrollbar-thumb {
|
||||
background: #ff8906;
|
||||
border-radius: 5px;
|
||||
}
|
||||
::-webkit-scrollbar-thumb:hover {
|
||||
background: #555;
|
||||
}
|
||||
|
||||
[class*="col-"] {float: left;}
|
||||
.row{clear: both;}
|
||||
[class*="col-"] {
|
||||
float: left;
|
||||
}
|
||||
.row {
|
||||
clear: both;
|
||||
}
|
||||
|
||||
body {
|
||||
background-color: #0f0e17;
|
||||
color:#a7a9be;
|
||||
color: #a7a9be;
|
||||
text-align: left;
|
||||
font-size: 1.4em;
|
||||
max-width: 900px;
|
||||
margin: auto;
|
||||
}
|
||||
|
||||
p {padding: 10px;}
|
||||
p {
|
||||
padding: 10px;
|
||||
}
|
||||
|
||||
#cover {opacity: 60%;}
|
||||
#cover {
|
||||
opacity: 60%;
|
||||
}
|
||||
|
||||
.container {
|
||||
position: relative;
|
||||
|
@ -46,25 +63,28 @@ p {padding: 10px;}
|
|||
text-align: center;
|
||||
}
|
||||
|
||||
#MoreButton{
|
||||
#MoreButton {
|
||||
margin: auto;
|
||||
position: relative;
|
||||
height: auto;
|
||||
max-height: max-content;
|
||||
width: auto;
|
||||
max-width: max-content;
|
||||
background-color:#ff8906;
|
||||
background-color: #ff8906;
|
||||
border-radius: 5px;
|
||||
color: #fffffe;
|
||||
font-size: 1.2em;
|
||||
}
|
||||
a {text-decoration: none;}
|
||||
a div p{
|
||||
a {
|
||||
text-decoration: none;
|
||||
}
|
||||
a div p {
|
||||
text-align: center;
|
||||
padding: 20px;
|
||||
}
|
||||
a :hover{scale: 1.06;}
|
||||
|
||||
a :hover {
|
||||
scale: 1.06;
|
||||
}
|
||||
|
||||
.righties {
|
||||
padding-bottom: 30px;
|
||||
|
@ -73,10 +93,17 @@ a :hover{scale: 1.06;}
|
|||
clear: both;
|
||||
}
|
||||
|
||||
@media (max-width: 767px)/*unter handy größe*/{
|
||||
.centered {display: none;}
|
||||
#gone {display: block;}
|
||||
#cover {opacity: 100%;}
|
||||
.righties {width: 100%;}
|
||||
|
||||
@media (max-width: 767px) /*unter handy größe*/ {
|
||||
.centered {
|
||||
display: none;
|
||||
}
|
||||
#gone {
|
||||
display: block;
|
||||
}
|
||||
#cover {
|
||||
opacity: 100%;
|
||||
}
|
||||
.righties {
|
||||
width: 100%;
|
||||
}
|
||||
}
|
Loading…
Add table
Add a link
Reference in a new issue