Mira/flask_blog
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

no idea now

Browse Source
This commit is contained in:
m
2026-03-14 20:25:07 +01:00
parent ee20eed70a
commit c6c9eeb4bc
2 changed files with 35 additions and 26 deletions
Download Patch File Download Diff File Expand all files Collapse all files

59
static/css/components/timeline.css
View File

@@ -55,32 +55,41 @@ ol.tw-border-l-2 {
color: #6b7280; color: #6b7280;
} }
/* 4. The Sizing & Expansion Fix */ /* 1. Scale up the Typography */
li.tw-relative { #Tailscaleipdoesntwork h3,
width: 100% !important; /* Forces the item to take up available space */ .tw-text-lg {
display: block !important; font-size: 1.5rem !important; /* Larger Heading */
box-sizing: border-box; line-height: 1.2 !important;
} }
/* Ensure the text content doesn't wrap too early */ #Tailscaleipdoesntwork p,
#Tailscaleipdoesntwork p {
width: 100%;
max-width: 100%;
line-height: 1.6 !important; /* Makes the 'small' text feel more readable */
}
/* Increase the 'hitbox' of the button if it feels too small to click */
.timeline-button {
transform: scale(
1.2
); /* Physically makes the dot 20% larger without breaking alignment */
box-shadow: 0 0 0 4px white; /* Cleaner 'gap' than a border */
}
/* 5. Handle Bootstrap's 'Small' Text */
.tw-text-sm {
font-size: 0.875rem !important;
}
.tw-text-base { .tw-text-base {
font-size: 1rem !important; font-size: 1.15rem !important; /* Larger Body Text */
line-height: 1.6 !important;
color: #374151 !important; /* Slightly darker for better readability */
}
time,
.tw-text-sm {
font-size: 1rem !important; /* Larger Date */
margin-bottom: 0.5rem !important;
}
/* 2. Scale the Dot and Line */
.timeline-button {
width: 1rem !important; /* Bigger dot */
height: 1rem !important;
left: -2.05rem !important; /* Re-center the bigger dot on the line */
top: 0.4rem;
}
ol.tw-border-l-2 {
border-left-width: 3px !important; /* Thicker vertical line */
margin-left: 2rem !important; /* Push away from the edge */
}
/* 3. Ensure it expands to the full container width */
li.tw-mb-10 {
margin-bottom: 3rem !important; /* More breathing room between items */
width: 100% !important;
} }

2
templates/components/timeline.html
View File

@@ -1,4 +1,4 @@
<div class="tw-mx-auto tw-px-8 tw-py-16 tw-w-full tw-max-w-4xl"> <div class="tw-w-full tw-mx-auto tw-px-4 tw-py-12 tw-text-lg">
<ol <ol
class="tw-relative tw-border-l-2 tw-border-gray-300 tw-list-none tw-p-0 tw-m-0 tw-ml-8" class="tw-relative tw-border-l-2 tw-border-gray-300 tw-list-none tw-p-0 tw-m-0 tw-ml-8"
> >