Author:
Hash:
Timestamp:
+21 -11 +/-6 browse
Kevin Schoon [me@kevinschoon.com]
9327e9a0a9302df1af23e81db85869b163091726
Fri, 17 Oct 2025 09:56:46 +0000 (5 months ago)
| 1 | diff --git a/ayllu/src/web2/template.rs b/ayllu/src/web2/template.rs |
| 2 | index 60404f3..dbb9746 100644 |
| 3 | --- a/ayllu/src/web2/template.rs |
| 4 | +++ b/ayllu/src/web2/template.rs |
| 5 | @@ -135,7 +135,7 @@ pub mod components { |
| 6 | #[template( |
| 7 | ext = "html", |
| 8 | source = r#" |
| 9 | - <section class="info-bar flex-group {%- if single %} single {%- endif -%}"> |
| 10 | + <section class="info-bar {%- if single %} single {%- endif -%}"> |
| 11 | <section class="title"> |
| 12 | {% if let Some(link) = link %} |
| 13 | <a href="{{link}}">{{title}}</a> |
| 14 | diff --git a/ayllu/templates/blob.html b/ayllu/templates/blob.html |
| 15 | index c0547f4..8b064ac 100644 |
| 16 | --- a/ayllu/templates/blob.html |
| 17 | +++ b/ayllu/templates/blob.html |
| 18 | @@ -3,7 +3,7 @@ |
| 19 | {% block content %} |
| 20 | <section id="blob" class="raised"> |
| 21 | <section class="raised"> |
| 22 | - <section class="flex-group info-bar"> |
| 23 | + <section class="info-bar"> |
| 24 | <section class="title"> |
| 25 | {%- if let Some((hint, color)) = hint -%} |
| 26 | <span class="hint" style="color: {{ color }}">{{ hint }}</span> |
| 27 | diff --git a/ayllu/templates/build.html b/ayllu/templates/build.html |
| 28 | index 4c9ad9d..504a7d4 100644 |
| 29 | --- a/ayllu/templates/build.html |
| 30 | +++ b/ayllu/templates/build.html |
| 31 | @@ -10,7 +10,7 @@ |
| 32 | </section> |
| 33 | {% for workflow in workflows %} |
| 34 | <section class="scrollable"> |
| 35 | - <section class="info-bar flex-group"> |
| 36 | + <section class="info-bar"> |
| 37 | <section class="title"> |
| 38 | <a href="/{{collection}}/{{name}}/builds/{{manifest.id}}/{{workflow.0.id}}">{{ workflow.0.name }} {%- if workflow.0.id == current_workflow %} <{%- endif -%}</a> |
| 39 | </section> |
| 40 | @@ -50,7 +50,7 @@ |
| 41 | {%- if let Some(current_step) = current_step -%} |
| 42 | {%- if current_step.0 == workflow.0.id -%} |
| 43 | <section class="scrollable raised inner"> |
| 44 | - <section class="info-bar flex-group selected"> |
| 45 | + <section class="info-bar selected"> |
| 46 | <section class="title"> |
| 47 | {{ current_step.1.name }} |
| 48 | </section> |
| 49 | diff --git a/ayllu/templates/collection.html b/ayllu/templates/collection.html |
| 50 | index fbdb2e3..dc8a16c 100644 |
| 51 | --- a/ayllu/templates/collection.html |
| 52 | +++ b/ayllu/templates/collection.html |
| 53 | @@ -1,7 +1,7 @@ |
| 54 | {% extends "base.html" %} |
| 55 | {% block content %} |
| 56 | <section class="raised"> |
| 57 | - <section class="info-bar flex-group"> |
| 58 | + <section class="info-bar"> |
| 59 | <section class="title"> |
| 60 | <a href="/{{ collection.name }}">{{ collection.name }}</a> |
| 61 | {%- if is_hidden %} <span class="negative">[hidden]</span> {%- endif -%} |
| 62 | diff --git a/ayllu/templates/repo.html b/ayllu/templates/repo.html |
| 63 | index 78915d7..b1e3e4e 100644 |
| 64 | --- a/ayllu/templates/repo.html |
| 65 | +++ b/ayllu/templates/repo.html |
| 66 | @@ -90,7 +90,7 @@ |
| 67 | {% if let Some(readme) = readme %} |
| 68 | <section class="raised"> |
| 69 | {% if let Some(file_name) = rendered_file_name %} |
| 70 | - <section class="flex-group info-bar"> |
| 71 | + <section class="info-bar"> |
| 72 | <section class="title"> |
| 73 | {{ file_name }} |
| 74 | </section> |
| 75 | diff --git a/ayllu/themes/base.css b/ayllu/themes/base.css |
| 76 | index 367c4be..16004e8 100644 |
| 77 | --- a/ayllu/themes/base.css |
| 78 | +++ b/ayllu/themes/base.css |
| 79 | @@ -106,14 +106,18 @@ header { |
| 80 | |
| 81 | /* Info Bar */ |
| 82 | |
| 83 | + .info-bar { |
| 84 | + display: flex; |
| 85 | + justify-content: space-between; |
| 86 | + } |
| 87 | |
| 88 | - section.info-bar>.title { |
| 89 | + .info-bar>.title { |
| 90 | font-weight: bold; |
| 91 | font-size: large; |
| 92 | padding-left: 15px; |
| 93 | } |
| 94 | |
| 95 | - section.info-bar { |
| 96 | + .info-bar { |
| 97 | margin-top: 8px; |
| 98 | border-radius: revert; |
| 99 | border-top: 2px solid; |
| 100 | @@ -123,18 +127,18 @@ section.info-bar { |
| 101 | font-family: monospace; |
| 102 | } |
| 103 | |
| 104 | - section.info-bar::before { |
| 105 | + .info-bar::before { |
| 106 | content: ""; |
| 107 | height: 20px; |
| 108 | width: 10px; |
| 109 | position: absolute; |
| 110 | } |
| 111 | |
| 112 | - section.info-bar.single { |
| 113 | + .info-bar.single { |
| 114 | border-bottom: solid 2px; |
| 115 | } |
| 116 | |
| 117 | - section.info-bar>section { |
| 118 | + .info-bar>section { |
| 119 | align-content: center; |
| 120 | justify-content: center; |
| 121 | } |
| 122 | @@ -417,6 +421,12 @@ li.active { |
| 123 | max-width: 100px; |
| 124 | } |
| 125 | |
| 126 | + @media (max-width: 450px) { |
| 127 | + .info-bar { |
| 128 | + flex-direction: column; |
| 129 | + } |
| 130 | + } |
| 131 | + |
| 132 | @media (max-width: 600px) { |
| 133 | |
| 134 | section.info-bar> :nth-child(2) { |