diff options
| author | UltraQbik <no1skill@yandex.ru> | 2024-08-21 22:55:05 +0300 |
|---|---|---|
| committer | UltraQbik <no1skill@yandex.ru> | 2024-08-21 22:55:05 +0300 |
| commit | 76ac2995b1c460f852816a3271fc7777d12b632d (patch) | |
| tree | 5a381cbc06bda11c4416acc6a5d09baa07defc34 | |
| parent | 08a46199086b119cb731d4f78425354ba85a80d9 (diff) | |
| download | httpy-76ac2995b1c460f852816a3271fc7777d12b632d.tar.gz httpy-76ac2995b1c460f852816a3271fc7777d12b632d.zip | |
Update about page and style changes
| -rw-r--r-- | css/styles.css | 18 | ||||
| -rw-r--r-- | www/about.html | 33 | ||||
| -rw-r--r-- | www/index.html | 5 |
3 files changed, 48 insertions, 8 deletions
diff --git a/css/styles.css b/css/styles.css index c35da80..970fbe7 100644 --- a/css/styles.css +++ b/css/styles.css @@ -4,10 +4,14 @@ background: transparent; } -p { +p, li { padding-top: 4px; } +ul { + padding-left: 16px; +} + body { font-family: Arial, Helvetica, sans-serif; color: white; @@ -17,6 +21,12 @@ body { min-height: 100vh; } +button { + padding: 10px; + color: white; + background: #2a2a2a; +} + header { background: #202020; padding: 30px; @@ -26,11 +36,13 @@ header { #section-div { align-self: center; - width: 50vw; + width: 70vw; + min-height: 100vh; + background: #1a1a1a; } section { - padding: 20px 10px 10px; + padding: 20px 24px 24px; font-size: 20px; } diff --git a/www/about.html b/www/about.html index 41810e3..30698e6 100644 --- a/www/about.html +++ b/www/about.html @@ -5,16 +5,43 @@ <link rel="stylesheet" href="css/styles.css"> </head> <body> - <header> <b> About The Mighty HTML Page </b> </header> + <header> + <div style="float: left; font-size: 20px"> <button onclick="window.location.href='/';"> sh%t go back </button> </div> + <div style="margin: 0 auto; width: fit-content;"> <b> About The Mighty HTML Page </b> </div> + </header> <div id="section-div"> <section> + <h1> Who are you? </h1> + <p> I am Qubane or Qubik, I am 19 years old and I just do some small projects in my free time </p> + <p> I primarily try to do things on my own, and create things from scratch, with as few additional libraries as possible </p> + <p> This page will be an example of that, as it was created using python and standard libs </p> + <p> I have 2 YouTube channels: </p> + <ul> + <li> Main one (<a href="https://www.youtube.com/@qubane" target="_blank">@qubane</a>) - russian channel that focuses on education on topics like programming / math </li> + <li> Second one (<a href="https://www.youtube.com/@thealmightyqubik1501" target="_blank">@thealmightyqubik1501</a>) - english channel that doesn't really have a specific topic, I just post random stuff on there </li> + </ul> + <p> I mostly code in Python, but also know a bit of C++, Lua, and currently learn the webpage stuff (HTML, CSS, JS?) </p> + <p> I love "coding" using Scratch (kids visual block coding language), and made some demo Ray Tracing, Ray Casting and such projects </p> + </section> + <section> <h1> Why does this exist? </h1> <p> This page exists because I wanted to: </p> <ul> <li> First - learn how to write own simple HTTP server using python and standard libs </li> - <li> Second - finally create a page for myself, where I can share my projects without filesize limit and such </li> - <li> Third - I am interested on how safe my code and my safety practices are, so try to hack the page, and report on how you did it </li> + <li> Second - finally create a page for myself, where I can share my projects without filesize limits and such </li> + <li> Third - I am interested on how good my code and my safety practices are, so feel free to try to hack the page, and report on how you did it </li> + </ul> + <p style="font-size: small"> P.S. I just saw a <a href="https://www.youtube.com/watch?v=7GBlCinu9yg" target="_blank">Computerphile video</a> on this topic, and decided <i>"why not do that?"</i> :> </p> + </section> + <section> + <h1> How to contact you? </h1> + <p> I mostly use discord for communication, so you have higher chance of contacting me there </p> + <ul> + <li> Discord username - <b>qubane</b> </li> + <li> [EN] Discord server - <a href="https://discord.gg/W3DRNP3Wq6" target="_blank">https://discord.gg/W3DRNP3Wq6</a> </li> + <li> [RU] Discord server - <a href="https://discord.gg/fYmvvGG28C" target="_blank">https://discord.gg/fYmvvGG28C</a> </li> </ul> + <p> I've realized I don't have many other ways, I might set up an email server for this domain in the future, but for now that's it </p> </section> </div> <footer> diff --git a/www/index.html b/www/index.html index e7dfd8c..e787340 100644 --- a/www/index.html +++ b/www/index.html @@ -5,7 +5,9 @@ <link rel="stylesheet" href="css/styles.css"> </head> <body> - <header> <b> Welcome To The Mighty HTML Page </b> </header> + <header> + <div style="margin: 0 auto; width: fit-content;"> <b> Welcome To The Mighty HTML Page </b> </div> + </header> <div id="section-div"> <section style="padding-top: 10px"> <h1> What is this? </h1> @@ -35,7 +37,6 @@ </div> <footer> <p> Hehe <i>foot</i>er </p> - <p> P.S. CSS is a mess :< </p> </footer> </body> </html> |