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">
<head>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" type="text/css" href="/static/css/main.css">
<meta charset="utf-8">
<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 {
?>
<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.
<form action="register.php" method="POST">
<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>
</div>
</form>
</article>
<?php
}

40
static/css/main.css
View File

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