4sp-dv 1.0.28 → 1.0.29

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -6,7 +6,7 @@
6
6
  <title>4SP - VERSION 5 CLIENT</title>
7
7
  <link rel="icon" type="image/png" href="https://cdn.jsdelivr.net/npm/4sp-dv@latest/images/logo.png">
8
8
 
9
- <base href="https://cdn.jsdelivr.net/npm/4sp-dv@1.0.28/logged-in/">
9
+ <base href="https://cdn.jsdelivr.net/npm/4sp-dv@1.0.29/logged-in/">
10
10
  <script src="https://cdn.tailwindcss.com"></script>
11
11
  <link href="https://fonts.googleapis.com/css2?family=Geist:wght@100..900&display=swap" rel="stylesheet">
12
12
 
@@ -778,7 +778,7 @@
778
778
  const displayUsername = document.getElementById('display-username');
779
779
  const displayEmail = document.getElementById('display-email');
780
780
 
781
- const BASE_URL = 'https://cdn.jsdelivr.net/npm/4sp-dv@1.0.28/logged-in/';
781
+ const BASE_URL = 'https://cdn.jsdelivr.net/npm/4sp-dv@1.0.29/logged-in/';
782
782
 
783
783
  // Preload Logos
784
784
  const preloadImgs = [
@@ -126,7 +126,7 @@
126
126
  width: 1px;
127
127
  height: 100px;
128
128
  background-color: #262626;
129
- transition: opacity 0.5s ease, width 0.5s ease;
129
+ transition: opacity 0.5s ease, width 0.5s ease, margin 0.5s ease;
130
130
  }
131
131
  .vertical-divider.hidden-anim {
132
132
  opacity: 0;
@@ -141,21 +141,25 @@
141
141
  flex-direction: column;
142
142
  justify-content: center;
143
143
  gap: 0.5rem;
144
- transition: opacity 0.5s ease, transform 0.5s ease;
144
+ transition: opacity 0.5s ease, transform 0.5s ease, width 0.5s ease, margin 0.5s ease;
145
145
  opacity: 1;
146
146
  transform: translateY(0);
147
+ overflow: visible;
147
148
  }
148
149
  .weather-section.hidden-anim {
149
150
  opacity: 0;
151
+ width: 0;
152
+ margin: 0;
150
153
  transform: translateY(10px);
151
154
  pointer-events: none;
152
- position: absolute; /* Take out of flow when hidden */
155
+ overflow: hidden;
153
156
  }
154
157
 
155
158
  .weather-main {
156
159
  display: flex;
157
160
  align-items: center;
158
161
  gap: 1.2rem;
162
+ min-width: 150px; /* Keep width during animation if possible */
159
163
  }
160
164
 
161
165
  .weather-icon {
@@ -231,34 +235,35 @@
231
235
 
232
236
  /* Retry Button */
233
237
  #retry-weather-btn {
234
- position: fixed;
235
- bottom: 2rem;
236
- right: 2rem;
237
- width: 40px;
238
- height: 40px;
239
- border-radius: 14px;
240
- border: 1px solid #4b5563;
241
- background: transparent;
242
- color: #d1d5db;
243
- display: flex;
244
- align-items: center;
245
- justify-content: center;
246
- cursor: pointer;
247
- z-index: 100;
248
- opacity: 0;
249
- pointer-events: none;
250
- transition: opacity 0.5s ease, transform 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275), background-color 0.2s;
251
- transform: scale(0.8) translateY(20px);
238
+ position: fixed !important;
239
+ bottom: 2rem !important;
240
+ right: 2rem !important;
241
+ width: 40px !important;
242
+ height: 40px !important;
243
+ border-radius: 14px !important;
244
+ border: 1px solid #4b5563 !important;
245
+ background-color: #040404 !important;
246
+ color: #d1d5db !important;
247
+ display: flex !important;
248
+ align-items: center !important;
249
+ justify-content: center !important;
250
+ cursor: pointer !important;
251
+ z-index: 99999 !important;
252
+ opacity: 0 !important;
253
+ pointer-events: none !important;
254
+ transition: opacity 0.3s ease, transform 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275), background-color 0.2s, border-color 0.2s !important;
255
+ transform: scale(0.8) !important;
252
256
  }
253
257
  #retry-weather-btn:hover {
254
- background-color: #374151;
255
- color: white;
256
- transform: scale(1.1) translateY(0);
258
+ background-color: #374151 !important;
259
+ border-color: #ffffff !important;
260
+ color: white !important;
261
+ transform: scale(1.1) !important;
257
262
  }
258
263
  #retry-weather-btn.visible {
259
- opacity: 1;
260
- pointer-events: auto;
261
- transform: scale(1) translateY(0);
264
+ opacity: 1 !important;
265
+ pointer-events: auto !important;
266
+ transform: scale(1) !important;
262
267
  }
263
268
 
264
269
  /* Font Awesome's base spin animation (needed for custom speed) */
@@ -349,16 +354,16 @@ body:not(.no-animations) .btn-toolbar-style:active, body:not(.no-animations) .bt
349
354
  </div>
350
355
  </div>
351
356
 
352
- <button id="retry-weather-btn" onclick="retryWeather()" title="Retry Weather">
353
- <i class="fa-solid fa-cloud-sun"></i>
354
- </button>
355
-
356
357
  <div id="weather-loader">
357
358
  <i class="fa-solid fa-circle-notch fa-spin-slow"></i>
358
359
  </div>
359
360
  </div>
360
361
  </div>
361
362
 
363
+ <button id="retry-weather-btn" onclick="retryWeather()" title="Retry Weather">
364
+ <i class="fa-solid fa-cloud-sun"></i>
365
+ </button>
366
+
362
367
  <script type="module">
363
368
  import { firebaseConfig } from '../firebase-config.js';
364
369
 
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "4sp-dv",
3
- "version": "1.0.28",
3
+ "version": "1.0.29",
4
4
  "description": "",
5
5
  "keywords": [],
6
6
  "homepage": "https://github.com/v5-4simpleproblems/v5-4simpleproblems-dv#readme",