Skip to content

Commit 3f6c2de

Browse files
[RTY-32-260032-handle-invalid-and-valid-url]: fix scroll width on home page
1 parent c13ea0b commit 3f6c2de

2 files changed

Lines changed: 19 additions & 77 deletions

File tree

app/static/css/tiny.css

Lines changed: 15 additions & 73 deletions
Original file line numberDiff line numberDiff line change
@@ -16,29 +16,21 @@ body {
1616
background-image: radial-gradient(circle at 50% -20%, #1e1e2e 0%, transparent 50%);
1717
}
1818

19-
/* Light theme overrides */
19+
2020
body.light-theme {
21-
/* background + glass */
2221
--bg: #f9fafb;
2322
--glass: rgba(0, 0, 0, 0.03);
2423
--glass-border: rgba(0, 0, 0, 0.07);
25-
26-
/* main card + text */
2724
--card: #ffffff;
2825
--text-primary: #111827;
2926
--text-secondary: #4b5563;
3027
--text-color: #111827;
31-
32-
/* accent */
3328
--accent: #2563eb;
34-
35-
/* Remove the dark radial gradient */
3629
background-image: none;
3730
}
3831

39-
/* Layout */
4032
.main-layout {
41-
max-width: 900px;
33+
max-width: 940px;
4234
margin: 0 auto;
4335
padding: 6rem 1rem 4rem;
4436
display: flex;
@@ -69,9 +61,7 @@ body.light-theme {
6961

7062
body.light-theme .app-header {
7163
background: #ffffff;
72-
/* solid background */
7364
border-bottom: 1px solid #e5e7eb;
74-
/* clear separation */
7565
box-shadow: 0 2px 10px rgba(0, 0, 0, 0.06);
7666
}
7767

@@ -250,7 +240,7 @@ body.dark-theme .app-header {
250240
cursor: pointer;
251241
}
252242

253-
/* Result card */
243+
254244
.result-card {
255245
width: 100%;
256246
background: linear-gradient(145deg, rgba(99, 102, 241, 0.1), rgba(0, 0, 0, 0));
@@ -323,10 +313,10 @@ body.dark-theme .app-header {
323313
color: var(--accent);
324314
}
325315

326-
/* Recent tray */
327316
.recent-tray {
328317
width: 100%;
329318
margin-top: 2rem;
319+
overflow: visible;
330320
}
331321

332322
.recent-header {
@@ -337,19 +327,23 @@ body.dark-theme .app-header {
337327
align-items: center;
338328
}
339329

330+
340331
.scroll-container {
341332
display: flex;
342333
gap: 1rem;
343334
overflow-x: auto;
344-
padding: 1rem 0;
335+
padding: 1rem 16px;
336+
scroll-padding-right: 16px;
337+
box-sizing: border-box;
345338
}
346339

347340
.scroll-container::-webkit-scrollbar {
348341
display: none;
349342
}
350343

351344
.recent-item {
352-
min-width: 220px;
345+
width: 260px;
346+
flex: 0 0 auto;
353347
background: var(--glass);
354348
border: 1px solid var(--glass-border);
355349
padding: 1rem;
@@ -360,6 +354,10 @@ body.dark-theme .app-header {
360354
flex-shrink: 0;
361355
}
362356

357+
.recent-item:last-child {
358+
margin-right: 16px;
359+
}
360+
363361
.short-code {
364362
color: var(--accent);
365363
font-weight: bold;
@@ -378,23 +376,16 @@ body.dark-theme .app-header {
378376
/* ===============================
379377
MODERN GLASS RECENT TABLE
380378
================================= */
381-
/* PAGE CONTAINER */
382379
.recent-page-container {
383380
width: 100%;
384381
max-width: 1200px;
385-
/* controls table width */
386382
margin: 0 auto;
387-
/* centers */
388383
padding: 0 24px;
389-
/* space left & right */
390384
box-sizing: border-box;
391385
}
392386

393-
/* Wrapper */
394387
.recent-table-wrapper {
395388
width: 100%;
396-
/*margin-top: 20px;
397-
margin-bottom: 20px;*/
398389
overflow-x: auto;
399390
}
400391

@@ -411,7 +402,6 @@ body.dark-theme .app-header {
411402
min-width: 800px;
412403
}
413404

414-
/* Header */
415405
.recent-table thead {
416406
background: var(--glass);
417407
}
@@ -428,7 +418,6 @@ body.dark-theme .app-header {
428418
white-space: nowrap;
429419
}
430420

431-
/* Body cells */
432421
.recent-table td {
433422
padding: 14px;
434423
font-size: 14px;
@@ -439,7 +428,6 @@ body.dark-theme .app-header {
439428
white-space: nowrap;
440429
}
441430

442-
/* Row hover */
443431
.recent-table tbody tr:hover {
444432
background: rgba(255, 255, 255, 0.05);
445433
}
@@ -448,7 +436,6 @@ body.dark-theme .app-header {
448436
COLUMN WIDTH CONTROL
449437
================================= */
450438

451-
/* # column */
452439
.recent-table th:nth-child(1),
453440
.recent-table td:nth-child(1) {
454441
width: 45px;
@@ -457,26 +444,22 @@ body.dark-theme .app-header {
457444
padding-right: 6px;
458445
}
459446

460-
/* Short URL */
461447
.recent-table th:nth-child(2),
462448
.recent-table td:nth-child(2) {
463449
width: 170px;
464450
}
465451

466-
/* Original URL (main space owner) */
467452
.recent-table th:nth-child(3),
468453
.recent-table td:nth-child(3) {
469454
width: 45%;
470455
min-width: 0;
471456
}
472457

473-
/* Created */
474458
.recent-table th:nth-child(4),
475459
.recent-table td:nth-child(4) {
476460
width: 170px;
477461
}
478462

479-
/* Visits */
480463
.recent-table th:nth-child(5),
481464
.recent-table td:nth-child(5) {
482465
width: 80px;
@@ -485,7 +468,6 @@ body.dark-theme .app-header {
485468
color: var(--accent-2);
486469
}
487470

488-
/* Actions */
489471
.recent-table th:nth-child(6),
490472
.recent-table td:nth-child(6) {
491473
width: 120px;
@@ -506,7 +488,6 @@ body.dark-theme .app-header {
506488
text-decoration: underline;
507489
}
508490

509-
/* Original URL truncate */
510491
.original-url {
511492
word-break: break-all;
512493
}
@@ -523,7 +504,6 @@ body.dark-theme .app-header {
523504
color: var(--accent);
524505
}
525506

526-
/* Created time */
527507
.created-time {
528508
font-size: 13px;
529509
color: var(--muted);
@@ -572,21 +552,19 @@ body.dark-theme .app-header {
572552
border-bottom: 1px solid var(--glass-border);
573553
}
574554

575-
/* Tablet */
555+
576556
@media (max-width: 1024px) {
577557
.recent-page-container {
578558
padding: 0 18px;
579559
}
580560
}
581561

582-
/* Mobile */
583562
@media (max-width: 768px) {
584563
.recent-page-container {
585564
padding: 0 12px;
586565
}
587566
}
588567

589-
/* Small phones */
590568
@media (max-width: 480px) {
591569
.recent-page-container {
592570
padding: 0 8px;
@@ -739,60 +717,24 @@ body.dark-theme .footer-bottom a {
739717
}
740718
}
741719

742-
743-
744-
745-
/* allow wrapping */
746-
/*.recent-tray .recent-item .original-url,
747-
.recent-tray .recent-item .original-url a {*/
748-
/*display: -webkit-box;*/
749-
/*-webkit-box-orient: vertical;
750-
751-
-webkit-line-clamp: 3;*/
752-
/* ⭐ change 2 or 3 lines here */
753-
/*line-clamp: 3;
754-
755-
overflow: hidden;
756-
text-overflow: ellipsis;
757-
text-wrap: balance;
758-
759-
white-space: normal;
760-
word-break: break-word;
761-
overflow-wrap: anywhere;
762-
}*/
763-
764-
/* IMPORTANT — remove width restriction */
765-
/*.recent-tray .recent-item {
766-
min-width: 0;*/
767-
/* allows shrinking inside flex/grid */
768-
/*max-width: 100%;
769-
}*/
770-
771720
.recent-tray .recent-item .original-url {
772721
max-width: 350px;
773-
/* control width of text block */
774722
min-width: 0;
775723
}
776724

777725
.recent-tray .recent-item .original-url,
778726
.recent-tray .recent-item .original-url a {
779727

780728
display: -webkit-box;
781-
/* REQUIRED for line clamp */
782729
-webkit-box-orient: vertical;
783730
-webkit-line-clamp: 2;
784-
/* show only 2 lines */
785-
786731
overflow: hidden;
787732
text-overflow: ellipsis;
788-
789733
white-space: normal;
790734
word-break: break-all;
791-
/* break long URLs */
792735
overflow-wrap: anywhere;
793736
}
794737

795-
/* container */
796738
.recent-tray .recent-item {
797739
min-width: 0;
798740
max-width: 100%;

app/utils/helper.py

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -15,21 +15,21 @@ def is_valid_url(url: str) -> bool:
1515
try:
1616
parsed = urlparse(url)
1717

18-
# 1️⃣ Allow only http/https
18+
# Allow only http/https
1919
if parsed.scheme not in ("http", "https"):
2020
return False
2121

22-
# 2️⃣ Must have hostname
22+
# Must have hostname
2323
if not parsed.netloc:
2424
return False
2525

2626
hostname = parsed.hostname
2727

28-
# 3️⃣ Block localhost
28+
# Block localhost
2929
if hostname in ("localhost",):
3030
return False
3131

32-
# 4️⃣ Block private / loopback IPs
32+
# Block private / loopback IPs
3333
try:
3434
ip = ipaddress.ip_address(hostname)
3535
if ip.is_private or ip.is_loopback:

0 commit comments

Comments
 (0)