Shrink calendar widget to half width

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
This commit is contained in:
sultan 2026-05-22 20:11:40 +05:00
parent ba7369eeaf
commit cc05070714
2 changed files with 8 additions and 4 deletions

View File

@ -11,7 +11,7 @@
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin> <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&display=swap" rel="stylesheet"> <link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&display=swap" rel="stylesheet">
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/flatpickr@4.6.13/dist/flatpickr.min.css"> <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/flatpickr@4.6.13/dist/flatpickr.min.css">
<link rel="stylesheet" href="styles.css?v=28" /> <link rel="stylesheet" href="styles.css?v=29" />
</head> </head>
<body> <body>
<header class="topbar"> <header class="topbar">

View File

@ -832,7 +832,10 @@ input.flatpickr-input {
.news-empty-sub { font-size: 15px; color: var(--muted); line-height: 1.5; max-width: 480px; margin: 0 auto; } .news-empty-sub { font-size: 15px; color: var(--muted); line-height: 1.5; max-width: 480px; margin: 0 auto; }
/* ---------- Calendar widget ---------- */ /* ---------- Calendar widget ---------- */
.home-calendar { } .home-calendar {
max-width: 50%;
padding: 24px 28px;
}
.cal-head { .cal-head {
display: flex; display: flex;
justify-content: space-between; justify-content: space-between;
@ -841,7 +844,7 @@ input.flatpickr-input {
gap: 12px; gap: 12px;
flex-wrap: wrap; flex-wrap: wrap;
} }
.cal-head h2 { margin: 0; } .cal-head h2 { margin: 0; font-size: 18px; }
.cal-nav { display: flex; align-items: center; gap: 10px; } .cal-nav { display: flex; align-items: center; gap: 10px; }
.cal-btn { .cal-btn {
width: 34px; height: 34px; width: 34px; height: 34px;
@ -893,7 +896,7 @@ input.flatpickr-input {
align-items: center; align-items: center;
justify-content: center; justify-content: center;
border-radius: var(--r-sm); border-radius: var(--r-sm);
font-size: 14px; font-size: 12px;
font-weight: 500; font-weight: 500;
color: var(--ink); color: var(--ink);
cursor: pointer; cursor: pointer;
@ -925,6 +928,7 @@ input.flatpickr-input {
.cal-hint { margin-top: 18px; margin-bottom: 0; } .cal-hint { margin-top: 18px; margin-bottom: 0; }
@media (max-width: 900px) { @media (max-width: 900px) {
.home-calendar { max-width: 100%; }
.home-grid { grid-template-columns: 1fr; } .home-grid { grid-template-columns: 1fr; }
.clock-time { font-size: 64px; } .clock-time { font-size: 64px; }
.weather-temp { font-size: 64px; } .weather-temp { font-size: 64px; }