This commit is contained in:
root 2025-04-21 03:17:47 -07:00
parent 92ed012c4d
commit 8d2cb1fb73

View file

@ -23,7 +23,7 @@ h2 {
#main-content-container {
display: flex;
flex-wrap: wrap;
gap: 20px;
gap: 10px; /* Reduced gap */
width: 100%;
justify-content: center;
}
@ -31,14 +31,14 @@ h2 {
#nba-container,
#mlb-container {
flex: 1;
min-width: 300px;
min-width: 220px; /* Reduced min-width */
}
/* Individual Score Containers */
.score-container {
width: 100%;
padding: 0; /* Remove padding from score container */
margin: 0; /* remove margin from score container */
padding: 0;
margin: 0;
}
#mlb-scores-display {
@ -47,27 +47,32 @@ h2 {
.score-box {
background-color: #232338;
padding: 2px 5px; /* Reduced padding on score boxes */
margin-bottom: 2px; /* Reduced margin on score boxes */
padding: 2px 5px;
margin-bottom: 2px;
border-radius: 6px;
border: 1px solid #4a4a82;
display: flex; /* Use flexbox for inner alignment */
flex-direction: column; /* Stack the game-score and game-period vertically */
justify-content: center; /* Center vertically */
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
}
.game-score {
font-size: 0.9em;
color: #e6e6fa;
text-align: center;
margin: 2px 0; /* Add a small top/bottom margin */
margin: 2px 0;
white-space: nowrap;
}
.game-score span {
display: inline;
}
.game-period {
font-size: 0.8em;
color: #b39ddb;
text-align: center;
margin: 2px 0; /* Add a small top/bottom margin */
margin: 2px 0;
white-space: nowrap;
}
/* Weather Styles */
@ -81,6 +86,7 @@ h2 {
border: 1px solid #4a4a82;
transition: all 0.3s ease;
flex: 1;
min-width: 220px;
}
#weather-display:hover {
@ -124,7 +130,65 @@ h2 {
}
/* Media Queries */
@media (min-width: 750px) {
@media (min-width: 750px) and (max-width: 800px) {
body {
padding: 10px; /* Reduced padding */
font-size: 14px; /* Reduced font-size */
max-width: none; /* Removed max-width */
margin: 0; /* Removed margin */
}
h1{
font-size: 1.5rem;
}
h2{
font-size: 1.2rem;
}
#main-content-container {
flex-wrap: nowrap; /* No wrapping */
justify-content: space-around;
gap: 5px; /* Further reduced gap */
}
#nba-container,
#mlb-container {
min-width: 220px; /* Adjusted min-width */
}
#mlb-scores-display {
column-count: 1; /* Changed to 1 column */
}
#weather-display {
padding: 10px; /* Reduced padding */
margin: 0; /* Remove margin */
max-width: none; /* Removed max-width */
min-width: 220px; /* Adjusted min-width */
}
.score-box {
padding: 1px 3px; /* Reduced padding on score boxes */
margin-bottom: 1px; /* Reduced margin on score boxes */
}
.game-score {
font-size: 0.7em; /* Reduced font-size */
margin: 1px 0; /* Reduced margin */
}
.game-period {
font-size: 0.6em; /* Reduced font-size */
margin: 1px 0; /* Reduced margin */
}
.ticker {
padding: 10px; /* Reduced padding */
}
.news-item {
padding-right: 25px; /* Reduced padding */
}
}
@media (min-width: 801px) {
/* Landscape layout */
body {
padding: 20px;
@ -136,22 +200,13 @@ h2 {
#main-content-container {
flex-wrap: nowrap;
justify-content: space-around;
gap: 20px;
}
#mlb-scores-display {
column-count: 2;
}
.score-container {
padding: 0; /* Remove padding from score container */
margin: 0; /* remove margin from score container */
}
.score-box {
padding: 2px 5px; /* Reduced padding on score boxes */
margin-bottom: 2px; /* Reduced margin on score boxes */
}
#weather-display {
padding: 20px;
margin: 0;
@ -195,23 +250,20 @@ h2 {
#mlb-container {
min-width: 0;
}
.score-container {
padding: 0; /* Remove padding from score container */
margin: 0; /* remove margin from score container */
}
.score-box {
padding: 2px 5px; /* Reduced padding on score boxes */
margin-bottom: 2px; /* Reduced margin on score boxes */
padding: 2px 5px;
margin-bottom: 2px;
}
.game-score {
font-size: 0.8em;
margin: 2px 0; /* Add a small top/bottom margin */
margin: 2px 0;
}
.game-period {
font-size: 0.7em;
margin: 2px 0; /* Add a small top/bottom margin */
margin: 2px 0;
}
.ticker {