web frontend for git (tangled's grandpa)
templates: index rework
+140
-22
+112
static/style.css
+112
static/style.css
···
1
+
:root {
2
+
--light: #f4f4f4;
3
+
--cyan: #509c93;
4
+
--light-gray: #eee;
5
+
--medium-gray: #ddd;
6
+
--gray: #6a6a6a;
7
+
--dark: #444;
8
+
--darker: #222;
9
+
}
10
+
11
+
html {
12
+
background: var(--light);
13
+
-webkit-text-size-adjust: none;
14
+
font-family: "InterVar", -apple-system, BlinkMacSystemFont, "Roboto", "Segoe UI", sans-serif;
15
+
}
16
+
17
+
::selection {
18
+
background: var(--medium-gray);
19
+
opacity: 0.3;
20
+
}
21
+
22
+
* {
23
+
box-sizing: border-box;
24
+
padding: 0;
25
+
margin: 0;
26
+
}
27
+
28
+
body {
29
+
max-width: 750px;
30
+
padding: 0 13px;
31
+
margin: 40px auto;
32
+
}
33
+
34
+
main, footer {
35
+
font-size: 1rem;
36
+
padding: 0;
37
+
line-height: 160%;
38
+
}
39
+
40
+
main h1, h2, h3, .small-heading {
41
+
font-family: "InterDisplay", -apple-system, BlinkMacSystemFont, "Roboto", "Segoe UI", sans-serif;
42
+
font-weight: 500;
43
+
}
44
+
45
+
strong {
46
+
font-weight: 500;
47
+
}
48
+
49
+
main h1 {
50
+
font-size: 20px;
51
+
padding: 10px 0 10px 0;
52
+
}
53
+
54
+
main h2 {
55
+
font-size: 18px;
56
+
}
57
+
58
+
main h2, h3 {
59
+
padding: 20px 0 15px 0;
60
+
}
61
+
62
+
nav {
63
+
padding-top: 1rem;
64
+
}
65
+
66
+
nav ul {
67
+
padding: 0;
68
+
margin: 0;
69
+
list-style: none;
70
+
padding-bottom: 20px;
71
+
}
72
+
73
+
nav ul li {
74
+
padding-right: 10px;
75
+
display: inline-block;
76
+
}
77
+
78
+
a {
79
+
margin: 0;
80
+
padding: 0;
81
+
box-sizing: border-box;
82
+
text-decoration: none;
83
+
word-wrap: break-word;
84
+
}
85
+
86
+
a {
87
+
color: var(--darker);
88
+
border-bottom: 1.5px solid var(--medium-gray);
89
+
}
90
+
91
+
a:hover {
92
+
border-bottom: 1.5px solid var(--gray);
93
+
}
94
+
95
+
.repo-index {
96
+
display: grid;
97
+
grid-template-columns: 6em 1fr 7em;
98
+
grid-row-gap: 0.5em;
99
+
}
100
+
101
+
.repo-index-headings {
102
+
display: grid;
103
+
grid-template-columns: 6em 1fr 7em;
104
+
padding-bottom: 1.2em;
105
+
padding-top: 1.2em;
106
+
}
107
+
108
+
@media (max-width: 385px) {
109
+
.repo-index {
110
+
grid-row-gap: 0.8em;
111
+
}
112
+
}
+5
-1
templates/404.html
+5
-1
templates/404.html
+5
-1
templates/500.html
+5
-1
templates/500.html
+1
templates/head.html
+1
templates/head.html
···
3
3
<meta charset="utf-8">
4
4
<meta name="viewport" content="width=device-width, initial-scale=1">
5
5
<link rel="stylesheet" href="/static/style.css" type="text/css">
6
+
<link rel="stylesheet" href="https://cdn.icyphox.sh/fonts/inter.css" type="text/css">
6
7
<!-- other meta tags here -->
7
8
</head>
8
9
{{ end }}
+12
-15
templates/index.html
+12
-15
templates/index.html
···
7
7
<h2>{{ .meta.Description }}</h2>
8
8
</header>
9
9
<body>
10
-
{{ template "nav" . }}
11
10
<main>
12
-
<table>
13
-
<tr>
14
-
<td>repository</td>
15
-
<td>description</td>
16
-
<td>last active</td>
17
-
</tr>
18
-
{{ range .info }}
19
-
<tr>
20
-
<td><a href="/{{ .Name }}">{{ .Name }}</a></td>
21
-
<td>{{ .Desc }}</td>
22
-
<td>{{ .Idle }}</td>
23
-
</tr>
24
-
{{ end }}
25
-
</table>
11
+
<div class="repo-index-headings small-heading">
12
+
<div>repository</div>
13
+
<div>description</div>
14
+
<div>idle</div>
15
+
</div>
16
+
<div class="repo-index">
17
+
{{ range .info }}
18
+
<div><a href="/{{ .Name }}">{{ .Name }}</a></div>
19
+
<div>{{ .Desc }}</div>
20
+
<div>{{ .Idle }}</div>
21
+
{{ end }}
22
+
</div>
26
23
</main>
27
24
</body>
28
25
</html>