better css for mobile

This commit is contained in:
samantha42
2026-09-09 17:07:40 +02:00
parent 63e0cd66bb
commit 6f72af5c81
5 changed files with 31 additions and 22 deletions
BIN
View File
Binary file not shown.
+12 -17
View File
@@ -52,22 +52,17 @@
</p> </p>
</div> </div>
<br> <br>
<div style=" display: flex;"> <div class="exp-flex">
<p class="exp-body"> <p class="exp-body">I love my custom Linux setup. I use Hyprland, which automatically arranges app windows
on my screen so everything stays organized without dragging things around. I also use Quickshell, which
records i have logged as "events" that is the real dated action of the company, this could be a purchase of inventory or sale of finished product. lets me customize menus, shortcuts, and system controls to work exactly how I want.
The underlying "entry" contain the credit or debit value posted into a "account" that is referenced to a book section like liquidity/cash or deprestion of assset and the liabilities the compnay may have. My system is based on Arch Linux or Manjaro Linux, which are versions of Linux that give you more
control and customization than a typical computer setup. The result is a clean, fast, and super
<br> efficient desktop that's hard to go back from.
All this infomation is inserted into sqlite tables. The database is very cheap regarding storage. <a class="outlink" href="https://git.samantha42.xyz/samantha/dotfiles">Git repo</a>
<br>But the attachments to events i have compressed as these mostly pdf are significantly more expensive. </p>
<img src="/static/images/sql.png" style="height: 400px; align-self: center;">
</div>
</p>
<img style="width: 25rem; padding: 10px;" src="/static/images/sql.png">
</div>
</section> </section>
<section id="product"> <section id="product">
@@ -86,7 +81,7 @@
</div> </div>
<br> <br>
<div style=" display: flex;"> <div class="exp-flex">
<img style="width: 25rem; padding: 10px;" src="/static/images/image.png"> <img style="width: 25rem; padding: 10px;" src="/static/images/image.png">
<p class="exp-body"> <p class="exp-body">
This is first look at the testing of the web ui of the bookkeeping software. This is first look at the testing of the web ui of the bookkeeping software.
+5 -4
View File
@@ -93,7 +93,8 @@
<div class="section-head"> <div class="section-head">
<h2>Lunix rice</h2> <h2>Lunix rice</h2>
</div> </div>
<div style="display: flex; align-items: center; gap: 1rem;"> <div class="exp-flex">
<p class="exp-body">I love my custom Linux setup. I use Hyprland, which automatically arranges app windows <p class="exp-body">I love my custom Linux setup. I use Hyprland, which automatically arranges app windows
on my screen so everything stays organized without dragging things around. I also use Quickshell, which on my screen so everything stays organized without dragging things around. I also use Quickshell, which
lets me customize menus, shortcuts, and system controls to work exactly how I want. lets me customize menus, shortcuts, and system controls to work exactly how I want.
@@ -102,13 +103,13 @@
efficient desktop thats hard to go back from. efficient desktop thats hard to go back from.
<a class="outlink" href="https://git.samantha42.xyz/samantha/dotfiles">Git repo</a> <a class="outlink" href="https://git.samantha42.xyz/samantha/dotfiles">Git repo</a>
</p> </p>
<img src="/static/images/rice.png" style="height: 200px; align-self: center;"> <img src="/static/images/rice.png" style="width: 400px; align-self: center;">
</div> </div>
<div class="section-head"> <div class="section-head">
<h2>programing</h2> <h2>programing</h2>
</div> </div>
<div style="display: flex; align-items: center; gap: 1rem;"> <div class="exp-flex">
<img src="/static/images/program.png" style="height: 350px;" alt="program"> <img src="/static/images/program.png" style="height: 500px;" alt="program">
<div> <div>
<p class="exp-body"> <p class="exp-body">
Programming can be a task, but for me it's a source of joy. This is something I do as a hobby, and I Programming can be a task, but for me it's a source of joy. This is something I do as a hobby, and I
+13
View File
@@ -205,6 +205,7 @@ h1 span{color:var(--accent);}
background:var(--surface);border:1px solid var(--border); background:var(--surface);border:1px solid var(--border);
border-radius:6px;padding:1.4rem 1.5rem; border-radius:6px;padding:1.4rem 1.5rem;
transition:border-color 0.2s,box-shadow 0.2s; transition:border-color 0.2s,box-shadow 0.2s;
max-width: 95%;
} }
.exp-card:hover{border-color:var(--border2);box-shadow:0 2px 12px rgba(0,0,0,0.06);} .exp-card:hover{border-color:var(--border2);box-shadow:0 2px 12px rgba(0,0,0,0.06);}
@@ -217,6 +218,17 @@ h1 span{color:var(--accent);}
border-color:var(--accent); border-color:var(--accent);
} }
.exp-flex {
display: block;
gap: 1rem;
}
@media (min-width: 800px) {
.exp-flex {
display: flex;
align-items: center;
}
}
.exp-title{ .exp-title{
font-family: "IBM Plex Serif", serif; font-family: "IBM Plex Serif", serif;
@@ -370,6 +382,7 @@ footer{
justify-content: center; justify-content: center;
gap: 1.5rem; gap: 1.5rem;
padding: 1rem 0; padding: 1rem 0;
max-width: 90%;
} }
.poster-item { .poster-item {
+1 -1
View File
File diff suppressed because one or more lines are too long