diff --git a/src/css/main.css b/src/css/main.css index bbaf675..5ad39e3 100644 --- a/src/css/main.css +++ b/src/css/main.css @@ -9,6 +9,7 @@ body { height: 100%; display: flex; flex-direction: column; + overflow: auto; } .theme-button { @@ -19,7 +20,7 @@ body { .card{ padding: 10px; border: 1px solid darkblue; - background-color: #ffffffcc; + background-color: #ddddddcc; border-radius: 0.5em; box-shadow: 3px 3px 3px #30303090; margin: 1em 0.5em; @@ -34,16 +35,57 @@ html { background-image: linear-gradient(-30deg, #C0E0FF6F 70%, #FFE0C04F); } -main { +.flex{ + display: flex; + flex-direction: column; +} + +.content { + /* display: inline-block; */ margin: auto; /* margin-top: 1em; */ min-width: 80%; - min-height: 40%; - overflow: auto; + /* min-height: 40%; */ padding-right: 8px; } -main>div { +.block-photo { + padding: 10px; + border-top: 1px solid black; + border-bottom: 1px solid black; + /* border: 1px solid darkblue; */ + background-image: url('../img/sunnyclouds.jpg'); + background-repeat: no-repeat; + background-attachment: fixed; + background-size: 100% 100%; + box-shadow: inset 0px 0px 6px #30303090; + margin-top: 1em; + margin-bottom: 1em; +} + +.block-darker { + padding: 10px; + /* border: 1px solid darkblue; */ + /* background-color: #80808040; */ + background-image: linear-gradient(#00000000, #d0e08030, #d0e08030, #00000000 ); + /* box-shadow: 3px 3px 3px #30303090; */ + /* border-radius: 4px; */ + margin-top: 1em; + margin-bottom: 1em; +} + +.block-alert { + display: inline-block; + padding: 10px; + border: 1px solid darkblue; + background-color: #ffaaaadd; + box-shadow: 3px 3px 3px #30303090; + border-radius: 4px; + margin-top: 1em; + margin-bottom: 1em; +} + +.block-white { padding: 10px; border: 1px solid darkblue; background-color: #ffffffcc; @@ -52,7 +94,7 @@ main>div { margin-bottom: 1em; } -main>div>h1 { +.content>h1 { font-family: "Raleway", sans-serif; font-size: 3em; margin-top: 0px; @@ -61,23 +103,21 @@ main>div>h1 { text-shadow: 0px 0px 4px white, 2px 2px 6px; } -main>p, -main>div>p { +.content>p{ margin-left: 1em; } -main>h2, -main>div>h2 { +.content>h2 { margin-left: 0.2em; } -main>h2{ +.content>h2{ margin-top: 1.5em; } -main>div>h2 { +.content>h2 { margin-top: 0.2em; } -main>h3{ +.content>h3{ margin-left: 0.8em; margin-top: 0.5em; margin-bottom: 0.5em; @@ -104,14 +144,13 @@ html.theme-dark { color: white; } -.theme-dark>body>main>div { +.theme-dark>body>main>.block-white { border: 1px solid darkgray; background-color: black; box-shadow: 3px 3px 5px #101010C0; } -.theme-dark>body>main>h1, -.theme-dark>body>main>div>h1 { +.theme-dark>body>main>.content>h1 { text-shadow: 0px 0px 3px blue, 2px 2px 6px; } diff --git a/src/img/sunnyclouds.jpg b/src/img/sunnyclouds.jpg new file mode 100644 index 0000000..fa80a95 Binary files /dev/null and b/src/img/sunnyclouds.jpg differ diff --git a/src/index.html b/src/index.html index 6023563..f6de54b 100644 --- a/src/index.html +++ b/src/index.html @@ -9,8 +9,8 @@ -
-
+
+

Ward Truyen

Wie ben ik:

@@ -33,73 +33,93 @@

Voor meer informatie bekijk mijn cv.

-

Zelf gemaakt 2024:

-

Deze website

-

Deze server heb ik kunnen - opzetten met - Arch Linux als OS. -
Daarop staat Traefik als reverse - proxy en de vele subdomeinen - zijn - m.b.v. Docker beheerd. -

-

Familie website

-

Op tds.truyen.network staat mijn gezin data beheer site. - Deze is gemaakt met als backend Java, Spring en REST, als frontend is er Angular.

- - - - - - - -

Op sf.truyen.network staat een kopie van diezelfde site, - waar u op kan inloggen en inspecteren (login gegevens staan in mijn CV).
Mocht er hier iets fout lopen, stuur - me a.u.b. een e-mail of bel me, en ik los het ASAP op.

-

WTerminal

-

Op wterminal.truyen.network kan u mijn - browser-addon of website-tooltje WTerminal vinden.

-

Zelf gemaakt vroeger:

-
-

Ronny

-

Gemaakt in VB.net 2004-2006
Direct draw rendering

-
-
-

Minesweeper

-

Gemaakt in C/C++ 2006-2013
OpenGL rendering

- +
+

Zelf gemaakt 2024:

+

Deze website

+

Deze server heb ik + kunnen + opzetten met + Arch Linux als OS. +
Daarop staat Traefik als reverse + proxy en de vele subdomeinen + zijn + m.b.v. Docker beheerd. +

+

Familie website

+

Op tds.truyen.network staat mijn gezin data beheer + site. + Deze is gemaakt met als backend Java, Spring en REST, als frontend is er Angular.

-
+
+
+ + + + + + + +
+
+
+

Op sf.truyen.network staat een kopie van diezelfde + site, waar u op kan inloggen en inspecteren (login gegevens staan in mijn CV).
Mocht er hier iets fout + lopen, + stuur me a.u.b. een e-mail of bel me, en ik los het ASAP op.

+

WTerminal

+

Op wterminal.truyen.network kan u mijn + browser-addon of website-tooltje WTerminal vinden.

+
+
+
+

Zelf gemaakt vroeger:

+
+

Ronny

+

Gemaakt in VB.net 2004-2006
Direct draw rendering

+ +
+
+

Minesweeper

+

Gemaakt in C/C++ 2006-2013
OpenGL rendering

+ +
+
+
+

Links naar de verschillende domeinen op deze server: