Skip to content

Commit 2886a8f

Browse files
perguthperguth
authored
Nicer styling / add missing translation links
1 parent 10cac08 commit 2886a8f

File tree

1 file changed

+185
-23
lines changed

1 file changed

+185
-23
lines changed

‎index.html‎

Lines changed: 185 additions & 23 deletions
Original file line numberDiff line numberDiff line change
@@ -1,23 +1,185 @@
1-
<h1>Ideas</h1>
2-
3-
<h2>Politik</h2>
4-
<ol>
5-
<li><a href='130528-Better-Life-Deutschland'>130528 Betterlifedeutschland</a></li>
6-
<li><a href='101004-Buerger-Politik-Interface-Deutschland'>101004 Buerger-Politik Interface Deutschland</a></li>
7-
<li><a href='010101-d3v_system'>010101 d3v_system</a></li>
8-
</ol>
9-
10-
<h2>Wirtschaft</h2>
11-
<ol>
12-
<li><a href='070201-Open-Calculation-and-Open-Assembly'>070201 Open Calculation and Open Assembly</a></li>
13-
</ol>
14-
15-
<h2>Philosophie</h2>
16-
<ol>
17-
<li><a href='120420-Erisisch-Woran-glauben-Sie-denn/'>120420 Erisisch - Woran glauben Sie denn?</a></li>
18-
</ol>
19-
20-
<h2>Mashups</h2>
21-
<ol>
22-
<li><a href='090715-Jedi-Commons'>090715 Jedi Commons</a></li>
23-
</ol>
1+
<!DOCTYPE html>
2+
<html lang="en">
3+
<head>
4+
<meta charset="UTF-8">
5+
<meta name="viewport" content="width=device-width, initial-scale=1.0">
6+
<title>Ideas</title>
7+
<style>
8+
:root {
9+
--primary-color: #2a4b8d;
10+
--secondary-color: #f0f4f8;
11+
--accent-color: #6d28d9;
12+
--text-color: #333;
13+
--link-color: #4361ee;
14+
--link-hover-color: #3730a3;
15+
--tag-bg: #e5e7eb;
16+
}
17+
18+
@media (prefers-color-scheme: dark) {
19+
:root {
20+
--primary-color: #4361ee;
21+
--secondary-color: #1f2937;
22+
--accent-color: #8b5cf6;
23+
--text-color: #e5e7eb;
24+
--link-color: #60a5fa;
25+
--link-hover-color: #93c5fd;
26+
--tag-bg: #374151;
27+
}
28+
}
29+
30+
body {
31+
font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
32+
line-height: 1.6;
33+
color: var(--text-color);
34+
max-width: 800px;
35+
margin: 0 auto;
36+
padding: 2rem 1rem;
37+
background-color: var(--secondary-color);
38+
}
39+
40+
h1 {
41+
font-size: 2.5rem;
42+
margin-bottom: 0.5rem;
43+
color: var(--primary-color);
44+
border-bottom: 2px solid var(--primary-color);
45+
padding-bottom: 0.5rem;
46+
}
47+
48+
h2 {
49+
font-size: 1.8rem;
50+
margin-top: 2rem;
51+
margin-bottom: 1rem;
52+
color: var(--primary-color);
53+
}
54+
55+
blockquote {
56+
border-left: 4px solid var(--accent-color);
57+
padding-left: 1rem;
58+
margin-left: 0;
59+
font-style: italic;
60+
color: var(--accent-color);
61+
}
62+
63+
ul {
64+
list-style-type: none;
65+
padding-left: 0;
66+
}
67+
68+
li {
69+
margin-bottom: 1rem;
70+
padding-left: 1.5rem;
71+
position: relative;
72+
}
73+
74+
li::before {
75+
content: "•";
76+
position: absolute;
77+
left: 0;
78+
color: var(--accent-color);
79+
}
80+
81+
a {
82+
color: var(--link-color);
83+
text-decoration: none;
84+
transition: color 0.2s ease;
85+
}
86+
87+
a:hover {
88+
color: var(--link-hover-color);
89+
text-decoration: underline;
90+
}
91+
92+
.tag {
93+
display: inline-block;
94+
background-color: var(--tag-bg);
95+
padding: 0.2rem 0.5rem;
96+
border-radius: 4px;
97+
font-size: 0.8rem;
98+
margin-right: 0.5rem;
99+
}
100+
101+
.date-code {
102+
font-family: monospace;
103+
color: var(--accent-color);
104+
margin-right: 0.5rem;
105+
}
106+
107+
.lang-tag {
108+
display: inline-block;
109+
background-color: var(--tag-bg);
110+
padding: 0.1rem 0.4rem;
111+
border-radius: 3px;
112+
font-size: 0.75rem;
113+
margin-right: 0.5rem;
114+
text-transform: uppercase;
115+
}
116+
117+
.featured {
118+
font-weight: bold;
119+
}
120+
</style>
121+
</head>
122+
<body>
123+
<h1>Ideas</h1>
124+
125+
<blockquote>🤔 • Political, sociological, philosophical ideas and mashups.</blockquote>
126+
127+
<h2>Politics</h2>
128+
<ul>
129+
<li>
130+
<span class="date-code">`130528`</span>
131+
<span class="lang-tag">[de]</span>
132+
<a href="https://perguth.de/ideas/130528-Better-Life-Deutschland/">Betterlifedeutschland</a>
133+
</li>
134+
<li>
135+
<span class="date-code">`101004`</span>
136+
<span class="lang-tag">[de]</span>
137+
<a href="https://perguth.de/ideas/101004-Buerger-Politik-Interface-Deutschland/">Buerger-Politik Interface Deutschland</a>
138+
</li>
139+
<li>
140+
<span class="date-code">`010101`</span>
141+
<span class="lang-tag">[de]</span>
142+
<a href="https://perguth.de/ideas/010101-d3v_system/">d3v_system</a>
143+
</li>
144+
</ul>
145+
146+
<h2>Economics</h2>
147+
<ul>
148+
<li>
149+
<span class="date-code">`070201`</span>
150+
<span class="lang-tag">[de]</span>
151+
<a href="https://perguth.de/ideas/070201-Open-Calculation-and-Open-Assembly/">Open Calculation and Open Assembly</a>
152+
</li>
153+
</ul>
154+
155+
<h2>Philosophy</h2>
156+
<ul>
157+
<li>
158+
<span class="date-code">`120420`</span>
159+
<span class="featured">
160+
<a href="https://perguth.de/ideas/120420-Erisisch-Woran-glauben-Sie-denn/index.en.html">What do you believe?</a>
161+
</span>
162+
</li>
163+
<li>
164+
<span class="date-code">`120420`</span>
165+
<span class="lang-tag">[de]</span>
166+
<a href="https://perguth.de/ideas/120420-Erisisch-Woran-glauben-Sie-denn/">Woran glauben Sie denn?</a>
167+
</li>
168+
</ul>
169+
170+
<h2>Mashups</h2>
171+
<ul>
172+
<li>
173+
<span class="date-code">`090715`</span>
174+
<span class="featured">
175+
<a href="https://perguth.de/ideas/090715-Jedi-Commons/en/">Jedi Commons</a>
176+
</span>
177+
</li>
178+
<li>
179+
<span class="date-code">`090715`</span>
180+
<span class="lang-tag">[de]</span>
181+
<a href="https://perguth.de/ideas/090715-Jedi-Commons/">Jedi Commons</a>
182+
</li>
183+
</ul>
184+
</body>
185+
</html>

0 commit comments

Comments
 (0)