YouHaveTrouble/youhavetrouble.github.io
1
0
Fork 0
mirror of https://github.com/YouHaveTrouble/youhavetrouble.github.io.git synced 2026-05-11 22:06:56 +00:00
Code Issues Packages Projects Releases Wiki Activity

improve responsive flow

Browse Source
This commit is contained in:
YouHaveTrouble
2025-06-23 20:28:03 +02:00
parent a99f8d188c
commit 765386640b
1 changed files with 13 additions and 4 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/pages/index.astro
+13 -4
View File
@@ -22,7 +22,7 @@ const permalink = Astro?.site?.href ?? '/';
<div class="window visitor-counter" data-title="Visitors counter" aria-label="Visitors counter"> <div class="window visitor-counter" data-title="Visitors counter" aria-label="Visitors counter">
<ViewCounter /> <ViewCounter />
</div> </div>
<div class="window" data-title="Activity" aria-label="Activity" style="flex: 1; min-width: min(100%, 16rem); "> <div class="window activity" data-title="Activity" aria-label="Activity">
<ActivityWidget /> <ActivityWidget />
</div> </div>
</div> </div>
@@ -65,18 +65,26 @@ const permalink = Astro?.site?.href ?? '/';
} }
.visitor-counter { .visitor-counter {
padding: 1.5rem 1rem 0 1rem; padding: 1.5rem 2rem 0 2rem;
display: flex; display: flex;
justify-content: center; justify-content: center;
align-items: center; align-items: center;
min-width: min(15rem, 100%);
flex: 1;
width: 100%;
} }
.socials { .socials {
padding: 2rem 1rem 0 1rem; padding: 2rem 1rem 0 1rem;
flex: 1; flex: 2;
min-width: min(25rem, 100%); min-width: min(25rem, 100%);
} }
.activity {
min-width: min(100%, 16rem);
flex: 2;
}
.blog { .blog {
padding: 2rem 1rem 0 1rem; padding: 2rem 1rem 0 1rem;
display: flex; display: flex;
@@ -85,7 +93,7 @@ const permalink = Astro?.site?.href ?? '/';
align-items: center; align-items: center;
min-width: min(25rem, 100%); min-width: min(25rem, 100%);
width: 100%; width: 100%;
max-width: min(25rem, 100%); flex: 1;
} }
.window-row { .window-row {
@@ -110,6 +118,7 @@ const permalink = Astro?.site?.href ?? '/';
display: flex; display: flex;
width: 100%; width: 100%;
padding-top: 3rem; padding-top: 3rem;
padding-inline: 0.5rem;
h1 { h1 {
font-weight: 700; font-weight: 700;