SergeychWorks/lyng
1
0
Fork 0
Code Issues 5 Pull Requests Actions Packages Projects 1 Releases 16 Wiki Activity

better lang page (ribbon & tg channel)

Browse Source
This commit is contained in:
Sergey Chernov 2025-11-27 12:51:32 +01:00
parent 813ebebddd
commit d9a26dd467
2 changed files with 49 additions and 0 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

14
site/src/jsMain/kotlin/HomePage.kt
View File

@ -67,6 +67,7 @@ fun HomePage() {
I({ classes("bi", "bi-braces", "me-1") })
Text("Try Lyng")
}
// (Telegram button moved to the bottom of the page)
}
}
}
@ -105,4 +106,17 @@ assertEquals([4, 16], evens2)
}
}
}
// Bottom section with a small Telegram button
Div({ classes("text-center", "mt-5", "pb-4") }) {
A(attrs = {
classes("btn", "btn-outline-primary", "btn-sm")
attr("href", "https://t.me/lynglang")
attr("target", "_blank")
attr("rel", "noopener noreferrer")
}) {
I({ classes("bi", "bi-telegram", "me-1") })
Text("Join our Telegram channel")
}
}
}

35
site/src/jsMain/resources/index.html
View File

@ -146,9 +146,44 @@
[data-bs-theme="dark"] .hl-lbl { color: #ffa657; }
[data-bs-theme="dark"] .hl-dir { color: #d2a8ff; }
[data-bs-theme="dark"] .hl-err { color: #ffa198; text-decoration-color: #ffa198; }
/* Top-left corner ribbon for version label */
.corner-ribbon {
position: fixed;
/* Place below the fixed navbar (Bootstrap fixed-top ~ z-index: 1030) */
z-index: 1020; /* above content, below navbar */
top: var(--navbar-offset, 56px);
left: 0;
width: 162px; /* 10% narrower than 180px */
text-align: center;
/* Slightly asymmetric padding to visually center text within rotated band (desktop) */
/* Nudge text a bit lower on large screens */
padding: .42rem 0 .28rem;
font-weight: 600;
font-size: .75rem; /* make text smaller by default */
line-height: 1.1; /* stabilize vertical centering */
transform: translate(-52px, 10px) rotate(-45deg);
box-shadow: 0 0.25rem 0.5rem rgba(0,0,0,.2);
border: 1px solid rgba(0,0,0,.15);
pointer-events: none; /* decorative; don't block clicks underneath */
}
@media (max-width: 576px) {
.corner-ribbon {
width: 135px; /* 10% narrower than 150px */
transform: translate(-50px, 8px) rotate(-45deg);
font-size: .7rem; /* even smaller on phones */
padding: .32rem 0 .28rem; /* keep mobile text centered too */
}
}
</style>
</head>
<body>
<!-- Top-left version ribbon -->
<div class="corner-ribbon bg-danger text-white">
<span class="me-3">
v1.0.1
</span>
</div>
<!-- Fixed top navbar for the whole site -->
<a href="#root" class="visually-hidden-focusable position-absolute top-0 start-0 m-2 px-2 py-1 bg-body border rounded">Skip to content</a>
<nav class="navbar navbar-expand-lg bg-body-tertiary fixed-top border-bottom" role="navigation" aria-label="Primary">