Skip to content

Commit 328ded5

Browse files
softwareengineerprogrammersoftwareengineerprogrammer
committed
userscripts basic nice-ification
1 parent a781959 commit 328ded5

File tree

2 files changed

+123
-17
lines changed

2 files changed

+123
-17
lines changed

‎index.html

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -127,6 +127,10 @@ <h2>GitHub Profile</h2>
127127
<h2>GEOPHIRES Documentation</h2>
128128
<p>Go to GEOPHIRES documentation.</p>
129129
</a>
130+
<a href="https://softwareengineerprogrammer.github.io/userscripts/" class="card" target="_blank" rel="noopener noreferrer">
131+
<h2>Userscripts</h2>
132+
<p>Go to userscripts.</p>
133+
</a>
130134
</section>
131135
</main>
132136

‎userscripts/index.html

Lines changed: 119 additions & 17 deletions
Original file line numberDiff line numberDiff line change
@@ -1,23 +1,125 @@
1+
<!DOCTYPE html>
12
<html lang="en">
23
<head>
3-
<title>userscripts</title>
4+
<meta charset="UTF-8">
5+
<meta name="viewport" content="width=device-width, initial-scale=1.0">
6+
<title>Userscripts</title>
7+
<style>
8+
:root {
9+
--background-color: #f8f9fa;
10+
--text-color: #212529;
11+
--heading-color: #000;
12+
--link-color: #0056b3;
13+
--link-hover-color: #003d82;
14+
--border-color: #dee2e6;
15+
--item-background-color: #fff;
16+
--item-hover-background-color: #f1f3f5;
17+
}
18+
19+
body {
20+
font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto,
21+
Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji",
22+
"Segoe UI Symbol";
23+
line-height: 1.6;
24+
background-color: var(--background-color);
25+
color: var(--text-color);
26+
margin: 0;
27+
padding: 2rem;
28+
}
29+
30+
.container {
31+
max-width: 800px;
32+
margin: 0 auto;
33+
}
34+
35+
h1 {
36+
color: var(--heading-color);
37+
border-bottom: 2px solid var(--border-color);
38+
padding-bottom: 0.5rem;
39+
margin-bottom: 1rem;
40+
}
41+
42+
p {
43+
font-size: 1.1rem;
44+
margin-bottom: 2rem;
45+
}
46+
47+
a {
48+
color: var(--link-color);
49+
text-decoration: none;
50+
font-weight: 500;
51+
}
52+
53+
a:hover {
54+
color: var(--link-hover-color);
55+
text-decoration: underline;
56+
}
57+
58+
.userscript-list {
59+
list-style: none;
60+
padding: 0;
61+
counter-reset: userscript-counter;
62+
}
63+
64+
.userscript-list li {
65+
background-color: var(--item-background-color);
66+
border: 1px solid var(--border-color);
67+
border-radius: 8px;
68+
margin-bottom: 1rem;
69+
transition: background-color 0.2s ease-in-out, transform 0.2s ease-in-out;
70+
counter-increment: userscript-counter;
71+
}
72+
73+
.userscript-list li:hover {
74+
background-color: var(--item-hover-background-color);
75+
transform: translateY(-2px);
76+
box-shadow: 0 4px 12px rgba(0,0,0,0.08);
77+
}
78+
79+
.userscript-list a {
80+
display: block;
81+
padding: 1.25rem 1.5rem;
82+
font-size: 1.1rem;
83+
font-family: inherit;
84+
text-decoration: none;
85+
color: var(--text-color);
86+
font-weight: 600;
87+
}
88+
89+
.userscript-list a::before {
90+
content: counter(userscript-counter) ". ";
91+
color: var(--text-color);
92+
font-weight: 600;
93+
margin-right: 0.75rem;
94+
}
95+
96+
.userscript-list a:hover {
97+
text-decoration: none;
98+
color: var(--link-color);
99+
}
100+
</style>
4101
</head>
5102
<body>
6-
<h1>Userscripts</h1>
7-
<p>
8-
To use, <a href="https://www.tampermonkey.net/" target="_blank">install Tampermonkey</a>, then click a userscript
9-
link below.
10-
</p>
11-
<ol style="font-family: monospace;">
12-
<li>
13-
<a href="aws-console-favorites-short-service-names.user.js">aws-console-favorites-short-service-names.user.js</a>
14-
</li>
15-
<li>
16-
<a href="gh-issue-title-in-url.user.js">gh-issue-title-in-url.user.js</a>
17-
</li>
18-
<li>
19-
<a href="gh-autoload-large-diffs.user.js">gh-autoload-large-diffs.user.js</a>
20-
</li>
21-
</ol>
103+
104+
<main class="container">
105+
<h1>Userscripts</h1>
106+
<p>
107+
To use, <a href="https://www.tampermonkey.net/" target="_blank" rel="noopener noreferrer">install Tampermonkey</a>, then click a userscript
108+
link below.
109+
</p>
110+
111+
<ol class="userscript-list">
112+
<li>
113+
<a href="aws-console-favorites-short-service-names.user.js">AWS Console Favorites Short Service Names</a>
114+
</li>
115+
<li>
116+
<a href="gh-issue-title-in-url.user.js">GitHub Issue Title in URL</a>
117+
</li>
118+
<li>
119+
<a href="gh-autoload-large-diffs.user.js">GitHub Autoload Large Diffs</a>
120+
</li>
121+
</ol>
122+
</main>
123+
22124
</body>
23125
</html>

0 commit comments

Comments
 (0)