Commit

Author:

Hash:

Timestamp:

+138 -79 +/-4 browse

Kevin Schoon [me@kevinschoon.com]

42e538b1cbf01a25ec43e421a6c4c3c50d9c4380

Sat, 17 May 2025 14:36:37 +0000 (6 months ago)

more style updates
1diff --git a/ayllu/templates/repo.html b/ayllu/templates/repo.html
2index caeeb3c..fac29ae 100644
3--- a/ayllu/templates/repo.html
4+++ b/ayllu/templates/repo.html
5 @@ -28,7 +28,10 @@
6 </p>
7 {% endif %}
8 </section>
9- <section>
10+ <section class="clone">
11+ <section class="title">
12+ Clone
13+ </section>
14 {% call macros::selectable_text("http", http_clone_url) %}
15 {% if let Some(clone_url) = git_clone_url %}
16 {% call macros::selectable_text("ssh", clone_url) %}
17 @@ -38,80 +41,87 @@
18 </section>
19 <section id="tree" class="raised">
20 <section class="info-bar flex-group">
21- <section>
22- Repository
23+ <section class="title">
24+ Browse
25 </section>
26 <section>
27 {% call macros::rss_links(base.feed_icon, rss_link_all, rss_link_1d, rss_link_1w, rss_link_1m) %}
28 </section>
29 </section>
30- <section id="repo-details-panel" class="flex-group lower-half">
31- <section id="commit-summary">
32+ <section id="repo-details-panel" class="lower-half">
33+ <section id="commit-summary" class="flex-group">
34+ <section>
35 {% if let Some(latest_commit) = latest_commit %}
36 <p class="dense">{{ latest_commit.author_name }}</p>
37- <p class="dense">{{ latest_commit.epoch | friendly_time }}</p>
38- <span {% if let Some(_) = latest_commit.is_verified -%}
39- class="positive"
40- {%- else -%}
41- class="negative"
42- {%- endif -%}><a href="/{{ collection }}/{{ name }}/commit/{{ latest_commit.id }}">{{ latest_commit.id | truncate(12) }}</a></span>
43- <pre>{{ latest_commit.message }} </pre>
44- {% endif %}
45- </section>
46- {% call macros::selectable_text("ref", refname) %}
47+ <p class="dense">
48+ <a href="/{{ collection }}/{{ name }}/commit/{{ latest_commit.id }}">{{ latest_commit.epoch | friendly_time }}</a>
49+ </p>
50+ <section class="badge-group">
51+ {% call macros::selectable_text("ref", refname) %}
52+ {% if let Some(_) = latest_commit.is_verified %}
53+ <div class="positive">
54+ {% else %}
55+ <div class="negative">
56+ {% endif %}
57+ {% call macros::selectable_text("commit", latest_commit.id) %}
58+ </section>
59+ <pre>{{ latest_commit.message }} </pre>
60+ {% endif %}
61 </section>
62- <section class="scrollable lower-half">
63- <table class="data-table">
64- <thead>
65- <tr>
66- <th scope="col">File</th>
67- <th scope="col">Commit</th>
68- <th scope="col">Size</th>
69- <th scope="col">Mode</th>
70- <th scope="col">Time</th>
71- </tr>
72- </thead>
73- <tbody>
74- {% for item in tree %}
75- <tr>
76- <td>
77- <a href="{{ item.0.name | make_object_url(item.0.kind, collection, name, refname, file_path) }}">
78- {{ item.0.name }}
79- {% if item.0.kind == "submodule" %}<span class="tiny">ref</span>{% endif %}
80- {% if item.0.kind == "pointer" %}<span class="tiny">ptr</span>{% endif %}
81- </a>
82- </td>
83- <td>
84- <a href="/{{ collection }}/{{ name }}/commit/{{ item.1.id }}">{{ item.1.summary | truncate(length=60) }}</a>
85- </td>
86- <td>{{ item.0.size | human_bytes_i64 }}</td>
87- <td>{{ item.0.mode | file_mode }}</td>
88- <td>
89- <a href="/{{ collection }}/{{ name }}/commit/{{ item.1.id }}">{{ item.1.epoch | friendly_time }}</a>
90- </td>
91- </tr>
92- {% endfor %}
93- </tbody>
94- </table>
95- </section>
96- </section>
97- {% if let Some(readme) = readme %}
98- <section class="raised">
99- {% if let Some(file_name) = rendered_file_name %}
100- <section class="flex-group info-bar">
101- <section class="title">
102- {{ file_name }}
103+ </section>
104+ </section>
105+ <section class="scrollable lower-half">
106+ <table class="data-table">
107+ <thead>
108+ <tr>
109+ <th scope="col">File</th>
110+ <th scope="col">Commit</th>
111+ <th scope="col">Size</th>
112+ <th scope="col">Mode</th>
113+ <th scope="col">Time</th>
114+ </tr>
115+ </thead>
116+ <tbody>
117+ {% for item in tree %}
118+ <tr>
119+ <td>
120+ <a href="{{ item.0.name | make_object_url(item.0.kind, collection, name, refname, file_path) }}">
121+ {{ item.0.name }}
122+ {% if item.0.kind == "submodule" %}<span class="tiny">ref</span>{% endif %}
123+ {% if item.0.kind == "pointer" %}<span class="tiny">ptr</span>{% endif %}
124+ </a>
125+ </td>
126+ <td>
127+ <a href="/{{ collection }}/{{ name }}/commit/{{ item.1.id }}">{{ item.1.summary | truncate(length=60) }}</a>
128+ </td>
129+ <td>{{ item.0.size | human_bytes_i64 }}</td>
130+ <td>{{ item.0.mode | file_mode }}</td>
131+ <td>
132+ <a href="/{{ collection }}/{{ name }}/commit/{{ item.1.id }}">{{ item.1.epoch | friendly_time }}</a>
133+ </td>
134+ </tr>
135+ {% endfor %}
136+ </tbody>
137+ </table>
138 </section>
139- {% if let Some(rendered_file_size) = rendered_file_size %}
140- <section>
141- {{ rendered_file_size | human_bytes_i64 }}
142+ </section>
143+ {% if let Some(readme) = readme %}
144+ <section class="raised">
145+ {% if let Some(file_name) = rendered_file_name %}
146+ <section class="flex-group info-bar">
147+ <section class="title">
148+ {{ file_name }}
149+ </section>
150+ {% if let Some(rendered_file_size) = rendered_file_size %}
151+ <section>
152+ {{ rendered_file_size | human_bytes_i64 }}
153+ </section>
154+ {% endif %}
155+ </section>
156+ {% endif %}
157+ <section id="readme" class="scrollable lower-half">
158+ {{ readme | safe }}
159 </section>
160 {% endif %}
161 </section>
162- {% endif %}
163- <section id="readme" class="scrollable lower-half">
164- {{ readme | safe }}
165- </section>
166- {% endif %}
167- </section>
168- {% endblock %}
169+ {% endblock %}
170 diff --git a/ayllu/themes/base.css b/ayllu/themes/base.css
171index 8195beb..06c3c56 100644
172--- a/ayllu/themes/base.css
173+++ b/ayllu/themes/base.css
174 @@ -83,12 +83,16 @@ section.info-bar {
175 font-family: monospace;
176 }
177
178- section.info-bar > .title {
179+ .title {
180 font-weight: bold;
181 font-size: large;
182 text-decoration: underline;
183 }
184
185+ section.clone > section.title {
186+ padding-bottom: 10px;
187+ }
188+
189 section.info-bar.single {
190 border-bottom: solid 2px;
191 }
192 @@ -98,6 +102,11 @@ section.info-bar > section {
193 justify-content: center;
194 }
195
196+ section.badge-group > section:first-child {
197+ margin-top: 1em;
198+ margin-bottom: 1em;
199+ }
200+
201 section#code-viewer {
202 padding: 1em;
203 }
204 @@ -110,9 +119,20 @@ span#ref-badge {
205 padding: 2px;
206 }
207
208+ section#commit-summary {
209+ padding: 1em;
210+ border-radius: 5px;
211+ }
212+
213+ section#commit-summary > section > pre {
214+ border-radius: 5px;
215+ padding: 1em;
216+ }
217+
218 section#commit-details {
219 padding: 1em;
220 margin-bottom: 0;
221+ border-radius: 5px;
222 }
223
224 section#commit-message {
225 @@ -222,11 +242,7 @@ section.flex-group {
226 }
227
228 section.selectable-text {
229- display: inline;
230- align-items: center;
231- width: auto;
232 font-size: 14px;
233- cursor: pointer;
234 text-decoration: none;
235 }
236
237 @@ -239,10 +255,13 @@ section.selectable-text > span.protocol-badge {
238 }
239
240 section.selectable-text > span.selectable {
241+ max-width: 300px;
242+ overflow: scroll;
243 border-style: solid;
244 border-width: 3px 3px 3px 0;
245 user-select: text;
246 padding: 2px;
247+ cursor: pointer;
248 }
249
250 footer {
251 @@ -277,11 +296,11 @@ footer.rss {
252 }
253
254 .positive {
255- text-decoration: underline dotted green;
256+ text-decoration: underline dotted;
257 }
258
259 .negative {
260- text-decoration: underline dotted green;
261+ text-decoration: underline dotted;
262 }
263
264 section.lower-half {
265 diff --git a/ayllu/themes/catppuccin.css b/ayllu/themes/catppuccin.css
266index 3cb8c96..3ded025 100644
267--- a/ayllu/themes/catppuccin.css
268+++ b/ayllu/themes/catppuccin.css
269 @@ -113,12 +113,12 @@ section#readme-header {
270
271 .positive {
272 color: var(--ctp-latte-green);
273- border-bottom: 2px solid var(--ctp-latte-green);
274+ text-shadow: 1px 1px 5px var(--ctp-latte-green);
275 }
276
277 .negative {
278 color: var(--ctp-latte-maroon);
279- border-bottom: 2px solid var(--ctp-latte-maroon);
280+ text-shadow: 1px 1px 5px var(--ctp-latte-maroon);
281 }
282
283 section.info-bar {
284 @@ -135,6 +135,14 @@ section.lower-half {
285 border-color: var(--ctp-latte-lavender);
286 }
287
288+ section#commit-summary {
289+ background: var(--ctp-latte-surface0);
290+ }
291+
292+ section#commit-summary > section > pre {
293+ background-color: var(--ctp-latte-mantle);
294+ }
295+
296 /* Syntax Highlighting */
297
298 section#code-viewer {
299 @@ -272,4 +280,12 @@ span.ts_addition {
300 section.lower-half {
301 border-color: var(--ctp-mocha-mauve);
302 }
303+
304+ section#commit-summary {
305+ background-color: var(--ctp-mocha-surface1);
306+ }
307+
308+ section#commit-summary > section > pre {
309+ background-color: var(--ctp-mocha-mantle);
310+ }
311 }
312 diff --git a/ayllu/themes/nord.css b/ayllu/themes/nord.css
313index bbcc218..fc9a5e0 100644
314--- a/ayllu/themes/nord.css
315+++ b/ayllu/themes/nord.css
316 @@ -84,18 +84,24 @@ section.info-bar {
317 border-color: var(--nord2);
318 }
319
320+ section#commit-summary {
321+ background-color: var(--nord4);
322+ }
323+
324+ section#commit-summary > section > pre {
325+ background-color: var(--nord5);
326+ }
327+
328 section.info-bar.single {
329 border-color: var(--nord2);
330 }
331
332 .positive {
333- color: var(--nord14);
334- border-bottom: 2px solid var(--nord14);
335+ text-shadow: 1px 1px 5px var(--nord14);
336 }
337
338 .negative {
339- color: var(--nord11);
340- border-bottom: 2px solid var(--nord11);
341+ text-shadow: 1px 1px 5px var(--nord11);
342 }
343
344 /* Syntax Highlighting */
345 @@ -248,4 +254,12 @@ span.ts_addition {
346 section > a {
347 color: var(--nord5);
348 }
349+
350+ section#commit-summary {
351+ background-color: var(--nord2);
352+ }
353+
354+ section#commit-summary > section > pre {
355+ background-color: var(--nord3);
356+ }
357 }