tylda-public/main
3
0
Fork 1
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

media chaos

Browse Source 
* dodane media na desktop (900+)
* dodane media na 480px
* dodane media dla telefonow (max-device-width)
This commit is contained in:
Smoorg 2025-10-03 22:42:17 +02:00
parent 8cfc95535d
commit 2c21a866b1
3 changed files with 32 additions and 11 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
header.php
View File

@ -1,5 +1,6 @@
<html lang="pl"> <html lang="pl">
<head> <head>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" type="text/css" href="/static/css/main.css"> <link rel="stylesheet" type="text/css" href="/static/css/main.css">
<meta charset="utf-8"> <meta charset="utf-8">
<title>~tylda.org~ polskie tildeverse</title> <title>~tylda.org~ polskie tildeverse</title>

2
register.php
View File

@ -41,6 +41,7 @@ Otrzymaliśmy twój formularz rejestracji. Oczekuj na dalsze informacje na swoje
} else { } else {
?> ?>
<article>
Poniższy formularz trafi do naszych administratorów, którzy go ocenią. Potraktuj go częściowo jako antyspam. Chcemy sensownych odpowiedzi na poniższe pytania. Posiadanie własnej strony też jest na duży plus. Poniższy formularz trafi do naszych administratorów, którzy go ocenią. Potraktuj go częściowo jako antyspam. Chcemy sensownych odpowiedzi na poniższe pytania. Posiadanie własnej strony też jest na duży plus.
<form action="register.php" method="POST"> <form action="register.php" method="POST">
<div class="form-row"> <div class="form-row">
@ -78,6 +79,7 @@ Poniższy formularz trafi do naszych administratorów, którzy go ocenią. Potra
<button type="submit">Submit</button> <button type="submit">Submit</button>
</div> </div>
</form> </form>
</article>
<?php <?php
} }

40
static/css/main.css
View File

@ -17,17 +17,17 @@ body {
font-family: "Helvetica", "Arial", sans-serif; font-family: "Helvetica", "Arial", sans-serif;
} }
div.main-content { div.main-content {
display: flex; display: flex;
flex-direction: column; flex-direction: column;
width: 60%;
margin: 0 auto; margin: 0 auto;
padding: 1rem; padding: 1rem;
} }
header#menu { header#menu {
display: flex; display: flex;
flex-direction: row; flex-direction: column;
border-width: 5px; border-width: 5px;
border-color: var(--main); border-color: var(--main);
border-style: double; border-style: double;
@ -35,13 +35,6 @@ header#menu {
margin-bottom: 2rem; margin-bottom: 2rem;
} }
@media (max-width: 850px) {
header#menu {
flex-direction: column;
}
}
header#menu a { header#menu a {
padding: 12px; padding: 12px;
color: var(--main); color: var(--main);
@ -74,7 +67,7 @@ article#content {
border-radius: 5px; border-radius: 5px;
margin-top: 2rem; margin-top: 2rem;
padding: 1rem; padding: 1rem;
gap: 8px; gap: .5rem;
padding-block: 2rem; padding-block: 2rem;
} }
@ -104,7 +97,8 @@ footer#footer > *:not(:last-child)::after {
pre.ascii { pre.ascii {
margin-bottom: 2rem; margin-bottom: 2rem;
font-size: 15px; font-size: 1rem;
overflow: auto;
} }
.user_home { .user_home {
@ -116,6 +110,7 @@ pre.ascii {
.form-row { .form-row {
display: flex; display: flex;
flex-direction: column;
justify-content: flex-end; justify-content: flex-end;
padding: .5em; padding: .5em;
} }
@ -151,3 +146,26 @@ ul li {
padding: 0.5rem; padding: 0.5rem;
margin-left: 2rem; margin-left: 2rem;
} }
@media only screen and (min-width: 900px) {
div.main-content {
width: 60%;
}
}
@media only screen
and (min-width: 480px)
and (max-width: 900px) {
header#menu {
flex-direction: row;
}
.form-row {
flex-direction: row;
}
}
@media only screen and (max-device-width: 480px) {
article {
font-size: 1em;
}
}