Mercurial

annotate mrjunejune/pages/tools/index.css @ 80:d55157451947

Find changesets by keywords (author, files, the commit message), revision number or hash, or revset expression.
[MrJuneJune] Updating my homepage.
author June Park <parkjune1995@gmail.com>
date Thu, 01 Jan 2026 08:23:46 -0800
parents 35b1abc37969
children
Ignore whitespace changes - Everywhere: Within whitespace: At end of lines:
rev   line source
76
35b1abc37969 Updating my website to use seobeo library.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
1 .title {
35b1abc37969 Updating my website to use seobeo library.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
2 color: var(--darkgray);
35b1abc37969 Updating my website to use seobeo library.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
3 }
35b1abc37969 Updating my website to use seobeo library.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
4
35b1abc37969 Updating my website to use seobeo library.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
5 .nav-list {
35b1abc37969 Updating my website to use seobeo library.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
6 list-style: none;
35b1abc37969 Updating my website to use seobeo library.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
7 padding: 0;
35b1abc37969 Updating my website to use seobeo library.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
8 }
35b1abc37969 Updating my website to use seobeo library.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
9
35b1abc37969 Updating my website to use seobeo library.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
10 .nav-list li {
35b1abc37969 Updating my website to use seobeo library.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
11 display: flex;
35b1abc37969 Updating my website to use seobeo library.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
12 align-items: center;
35b1abc37969 Updating my website to use seobeo library.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
13 margin-bottom: 20px;
35b1abc37969 Updating my website to use seobeo library.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
14 cursor: pointer;
35b1abc37969 Updating my website to use seobeo library.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
15 group;
35b1abc37969 Updating my website to use seobeo library.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
16 }
35b1abc37969 Updating my website to use seobeo library.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
17
35b1abc37969 Updating my website to use seobeo library.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
18 /* The Mini Sphere */
35b1abc37969 Updating my website to use seobeo library.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
19 .sphere {
35b1abc37969 Updating my website to use seobeo library.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
20 width: 12px;
35b1abc37969 Updating my website to use seobeo library.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
21 height: 12px;
35b1abc37969 Updating my website to use seobeo library.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
22 border-radius: 50%;
35b1abc37969 Updating my website to use seobeo library.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
23 margin-right: 15px;
35b1abc37969 Updating my website to use seobeo library.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
24 background: var(--darkgray);
35b1abc37969 Updating my website to use seobeo library.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
25 box-shadow: 0 0 10px rgba(68, 136, 255, 0.5);
35b1abc37969 Updating my website to use seobeo library.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
26 transition: all 0.3s ease;
35b1abc37969 Updating my website to use seobeo library.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
27 opacity: 0.5; /* Dim when not active */
35b1abc37969 Updating my website to use seobeo library.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
28 }
35b1abc37969 Updating my website to use seobeo library.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
29
35b1abc37969 Updating my website to use seobeo library.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
30 /* The Text */
35b1abc37969 Updating my website to use seobeo library.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
31 .nav-list a {
35b1abc37969 Updating my website to use seobeo library.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
32 color: var(--darkgray);
35b1abc37969 Updating my website to use seobeo library.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
33 text-decoration: none;
35b1abc37969 Updating my website to use seobeo library.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
34 font-size: 1.2rem;
35b1abc37969 Updating my website to use seobeo library.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
35 transition: color 0.3s ease;
35b1abc37969 Updating my website to use seobeo library.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
36 }
35b1abc37969 Updating my website to use seobeo library.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
37
35b1abc37969 Updating my website to use seobeo library.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
38 /* Hover Effects */
35b1abc37969 Updating my website to use seobeo library.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
39 .nav-list li:hover .sphere {
35b1abc37969 Updating my website to use seobeo library.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
40 opacity: 1;
35b1abc37969 Updating my website to use seobeo library.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
41 transform: scale(1.5);
35b1abc37969 Updating my website to use seobeo library.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
42 box-shadow: 0 0 20px var(--awesome);
35b1abc37969 Updating my website to use seobeo library.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
43 animation: pulse 1.5s infinite; /* Only pulses on hover */
35b1abc37969 Updating my website to use seobeo library.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
44 }
35b1abc37969 Updating my website to use seobeo library.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
45
35b1abc37969 Updating my website to use seobeo library.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
46 .nav-list li:hover a {
35b1abc37969 Updating my website to use seobeo library.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
47 color: var(--awesome);
35b1abc37969 Updating my website to use seobeo library.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
48 }
35b1abc37969 Updating my website to use seobeo library.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
49
35b1abc37969 Updating my website to use seobeo library.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
50 /* Simple pulse animation for the list version */
35b1abc37969 Updating my website to use seobeo library.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
51 @keyframes pulse {
35b1abc37969 Updating my website to use seobeo library.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
52 0% { box-shadow: 0 0 0 0 rgba(68, 136, 255, 0.7); }
35b1abc37969 Updating my website to use seobeo library.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
53 70% { box-shadow: 0 0 0 10px rgba(68, 136, 255, 0); }
35b1abc37969 Updating my website to use seobeo library.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
54 100% { box-shadow: 0 0 0 0 rgba(68, 136, 255, 0); }
35b1abc37969 Updating my website to use seobeo library.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
55 }