fix: responsive layout

This commit is contained in:
sador 2023-09-15 20:15:26 +02:00
parent c40fac021d
commit dc17d1557a
3 changed files with 24 additions and 28 deletions

6
.idea/vcs.xml Normal file
View File

@ -0,0 +1,6 @@
<?xml version="1.0" encoding="UTF-8"?>
<project version="4">
<component name="VcsDirectoryMappings">
<mapping directory="" vcs="Git" />
</component>
</project>

View File

@ -10,27 +10,27 @@
<title>sador.dev - projekty</title> <title>sador.dev - projekty</title>
</head> </head>
<body> <body>
<div id="content"> <div id="content">
<h1>Sador</h1> <h1>Sador</h1>
<button onclick="toggleTheme()">Zmień motyw</button> <button onclick="toggleTheme()">Zmień motyw</button>
<button><a href="/">Powrót</a></button> <button><a href="/">Powrót</a></button>
<h4>Moje projekty</h4> <h4>Moje projekty</h4>
<div id="projects"> <div id="projects">
<div class="project-card"> <div class="project-card">
<img src="thumbnails/zine.png" alt="Zine thumbnail"/> <img src="thumbnails/zine.png" alt="Zine thumbnail"/>
<div class="description"> <div class="description">
<h3>Zine</h3> <h3>Zine</h3>
<p>Mój własny bot na platformę Guilded napisany w języku Rust.</p> <p>Mój własny bot na platformę Guilded napisany w języku Rust.</p>
</div>
</div> </div>
</div> <div class="project-card">
<div class="project-card"> <img src="thumbnails/website.png" alt="Website thumbnail"/>
<img src="thumbnails/website.png" alt="Website thumbnail"/> <div class="description">
<div class="description"> <h3>Personalna strona</h3>
<h3>Personalna strona</h3> <p>Moja własna strona internetowa, ta, którą teraz przeglądasz.</p>
<p>Moja własna strona internetowa, ta, którą teraz przeglądasz.</p> </div>
</div> </div>
</div> </div>
</div> </div>
</div>
</body> </body>
</html> </html>

View File

@ -268,16 +268,6 @@ body:not(.dark) #age {
/* MOBILE */ /* MOBILE */
@media screen and (max-width: 798px) { @media screen and (max-width: 798px) {
#content {
display: block;
top: 0;
left: 0;
transform: none;
padding: 10px;
width: 100%;
height: 100%;
}
#projects { #projects {
flex-direction: column; flex-direction: column;
} }