Mercurial

comparison mrjunejune/src/tools/index.css @ 84:bcc76a156aea

Find changesets by keywords (author, files, the commit message), revision number or hash, or revset expression.
Updated to be called src instead of pages.
author June Park <parkjune1995@gmail.com>
date Thu, 01 Jan 2026 13:01:10 -0800
parents mrjunejune/pages/tools/index.css@d55157451947
children 3bdfffaad162
comparison
equal deleted inserted replaced
83:49b611c808e7 84:bcc76a156aea
1 .title {
2 color: var(--darkgray);
3 }
4
5 .nav-list {
6 list-style: none;
7 padding: 0;
8 }
9
10 .nav-list li {
11 display: flex;
12 align-items: center;
13 margin-bottom: 20px;
14 cursor: pointer;
15 group;
16 }
17
18 /* The Mini Sphere */
19 .sphere {
20 width: 12px;
21 height: 12px;
22 border-radius: 50%;
23 margin-right: 15px;
24 background: var(--darkgray);
25 box-shadow: 0 0 10px rgba(68, 136, 255, 0.5);
26 transition: all 0.3s ease;
27 opacity: 0.5; /* Dim when not active */
28 }
29
30 /* The Text */
31 .nav-list a {
32 color: var(--darkgray);
33 text-decoration: none;
34 font-size: 1.2rem;
35 transition: color 0.3s ease;
36 }
37
38 /* Hover Effects */
39 .nav-list li:hover .sphere {
40 opacity: 1;
41 transform: scale(1.5);
42 box-shadow: 0 0 20px var(--awesome);
43 animation: pulse 1.5s infinite; /* Only pulses on hover */
44 }
45
46 .nav-list li:hover a {
47 color: var(--awesome);
48 }
49
50 /* Simple pulse animation for the list version */
51 @keyframes pulse {
52 0% { box-shadow: 0 0 0 0 rgba(68, 136, 255, 0.7); }
53 70% { box-shadow: 0 0 0 10px rgba(68, 136, 255, 0); }
54 100% { box-shadow: 0 0 0 0 rgba(68, 136, 255, 0); }
55 }