From 8d2cb1fb7394c225c99bed71aa670cbeef2ed3de Mon Sep 17 00:00:00 2001 From: root Date: Mon, 21 Apr 2025 03:17:47 -0700 Subject: [PATCH] u --- deathclock/assets/style.css | 116 ++++++++++++++++++++++++++---------- 1 file changed, 84 insertions(+), 32 deletions(-) diff --git a/deathclock/assets/style.css b/deathclock/assets/style.css index 9594417..d013051 100644 --- a/deathclock/assets/style.css +++ b/deathclock/assets/style.css @@ -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 {