tristan/capitalismkills.net
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

fix mobile view- hopefully

Browse source
This commit is contained in:
Tristan 2024-12-17 00:20:42 -05:00
parent aecb1472f7
commit 10d3202cda
1 changed files with 34 additions and 11 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

43
styles.css
View file

@ -1,3 +1,4 @@
/* Base Styles */
html, body {
height: 100%;
margin: 0;
@ -8,8 +9,8 @@ html, body {
}
.container {
width: 60%;
max-width: 950px;
width: 90%; /* Make it responsive and fit within the screen */
max-width: 950px; /* Set a max width */
margin: auto;
display: flex;
flex-direction: column;
@ -18,7 +19,8 @@ html, body {
height: 100vh;
text-align: center;
position: relative;
z-index: 1;
padding: 1rem; /* Add breathing room for small screens */
box-sizing: border-box;
}
.background-image {
@ -27,15 +29,15 @@ html, body {
left: 50%;
transform: translate(-50%, -50%);
width: 100%;
max-width: 600px; /* Limit size */
height: auto;
opacity: 0.2;
opacity: 0.15; /* Light transparency for clarity */
z-index: 0;
pointer-events: none;
}
blockquote {
font-size: 1.8rem;
font-size: clamp(1.2rem, 2vw, 1.8rem); /* Responsive font size */
font-style: italic;
margin: 0;
line-height: 1.5;
@ -43,16 +45,16 @@ blockquote {
}
.author {
margin-top: 1.5rem;
font-size: 1.2rem;
margin-top: 1rem;
font-size: clamp(1rem, 1.5vw, 1.2rem); /* Responsive font size */
font-style: italic;
color: #bbbbbb;
z-index: 1;
}
.source {
margin-top: 1rem;
font-size: 1rem;
margin-top: 0.5rem;
font-size: clamp(0.9rem, 1.2vw, 1rem);
color: #999999;
z-index: 1;
}
@ -69,3 +71,24 @@ blockquote {
color: #d1d1d1;
border-color: #d1d1d1;
}
/* Mobile Responsive Styles */
@media (max-width: 768px) {
.container {
width: 95%;
height: auto; /* Allow the container to grow naturally */
padding: 2rem 1rem;
}
.background-image {
max-width: 400px;
opacity: 0.1;
}
}
@media (max-width: 480px) {
.background-image {
max-width: 300px;
opacity: 0.08;
}
}