Cyper/CyBySide
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Fixed mobile placeholders / CSS support
All checks were successful
Deploy Blog to Folder / deploy (push) Successful in 2s
Details

Browse Source
This commit is contained in:
Cyper
2025-07-19 02:30:47 -04:00
parent 5c9a3c3aa7
commit 6c1af5a098
2 changed files with 16 additions and 7 deletions
Download Patch File Download Diff File Expand all files Collapse all files

18
public/css/home.css
View File

@ -25,31 +25,36 @@
.fill-teal { .fill-teal {
--fill-color: rgba(var(--teal), 0.86); --fill-color: rgba(var(--teal), 0.86);
} }
.fill-teal:hover { .fill-teal:hover,
.fill-teal:active {
--fill-color: rgba(var(--teal), 0.96); --fill-color: rgba(var(--teal), 0.96);
} }
.fill-black { .fill-black {
--fill-color: rgba(var(--black), 0.86); --fill-color: rgba(var(--black), 0.86);
} }
.fill-black:hover { .fill-black:hover,
.fill-black:active {
--fill-color: rgba(var(--black), 0.96); --fill-color: rgba(var(--black), 0.96);
} }
.fill-lightblue { .fill-lightblue {
--fill-color: rgba(var(--lightblue), 0.86); --fill-color: rgba(var(--lightblue), 0.86);
} }
.fill-lightblue:hover { .fill-lightblue:hover,
.fill-lightblue:active {
--fill-color: rgba(var(--lightblue), 0.96); --fill-color: rgba(var(--lightblue), 0.96);
} }
.fill-brown { .fill-brown {
--fill-color: rgba(var(--brown), 0.86); --fill-color: rgba(var(--brown), 0.86);
} }
.fill-brown:hover { .fill-brown:hover,
.fill-brown:active {
--fill-color: rgba(var(--brown), 0.96); --fill-color: rgba(var(--brown), 0.96);
} }
.fill-tan { .fill-tan {
--fill-color: rgba(var(--tan), 0.86); --fill-color: rgba(var(--tan), 0.86);
} }
.fill-tan:hover { .fill-tan:hover,
.fill-tan:active {
--fill-color: rgba(var(--tan), 0.96); --fill-color: rgba(var(--tan), 0.96);
} }
@ -173,7 +178,8 @@ main > :last-child {
.home-grid > * { .home-grid > * {
animation: spin-out 0.5s cubic-bezier(0.67, -0.02, 0.23, 0.99); animation: spin-out 0.5s cubic-bezier(0.67, -0.02, 0.23, 0.99);
} }
.home-grid > *:hover { .home-grid > *:hover,
.home-grid > *:active {
animation: spin-in 0.5s cubic-bezier(0.67, -0.02, 0.23, 0.99); animation: spin-in 0.5s cubic-bezier(0.67, -0.02, 0.23, 0.99);
} }
.home-grid svg { .home-grid svg {

5
src/_includes/layout.html
View File

@ -54,7 +54,7 @@
<div class="nav-hyperlinks"> <div class="nav-hyperlinks">
<ul> <ul>
<li data-mobile> <li data-mobile>
<button class="hamburger" aria-label="Toggle menu"> <button id="mobile-nav-btn" class="hamburger" aria-label="Toggle menu">
<ion-icon name="menu-sharp"></ion-icon> <ion-icon name="menu-sharp"></ion-icon>
</button> </button>
</li> </li>
@ -175,5 +175,8 @@
<script type="module" src="https://unpkg.com/ionicons@7.1.0/dist/ionicons/ionicons.esm.js"></script> <script type="module" src="https://unpkg.com/ionicons@7.1.0/dist/ionicons/ionicons.esm.js"></script>
<script nomodule src="https://unpkg.com/ionicons@7.1.0/dist/ionicons/ionicons.js"></script> <script nomodule src="https://unpkg.com/ionicons@7.1.0/dist/ionicons/ionicons.js"></script>
<script>
document.getElementById('mobile-nav-btn').addEventListener('click', () => alert('Not yet implemented!'));
</script>
</body> </body>
</html> </html>