Rework centering

orgatalk · May 15, 2024 · 8ade0ff · 8ade0ff
1 parent 57d227a
commit 8ade0ff
Show file tree

Hide file tree

Showing 4 changed files with 24 additions and 18 deletions.
diff --git a/src/lanpartydb_website/blueprints/homepage/templates/homepage/index.html b/src/lanpartydb_website/blueprints/homepage/templates/homepage/index.html
@@ -2,7 +2,7 @@
 
 {% block body %}
 
-<div class="block block--centered">
+<div class="block is-centered-h">
   <p class="text--centered">This database covers:</p>
   <div class="row row--collapsible row--center">
     <div class="column text--centered">
@@ -28,13 +28,16 @@
   </div>
 </div>
 
-<div class="block" style="margin-top: 3rem;">
+<div class="block is-centered-h" style="margin-top: 3rem;">
   <p>A bunch of people were so kind to collect and submit data:</p>
-  <div class="block--centered">
-    <a href="https://github.com/orgatalk/lanpartydb-data/contributors" class="contributors">
-      <img src="https://contrib.rocks/image?repo=orgatalk/lanpartydb-data&columns=5">
-    </a>
-  </div>
+</div>
+<div class="block is-centered-h">
+  <a href="https://github.com/orgatalk/lanpartydb-data/contributors" class="contributors">
+    <img src="https://contrib.rocks/image?repo=orgatalk/lanpartydb-data&columns=5">
+  </a>
+</div>
+
+<div class="block is-centered-h" style="margin-top: 3rem;">
   <p>Check out the <a href="https://github.com/orgatalk/lanpartydb-data/blob/main/CONTRIBUTING.md">Contribution Guide</a> to see how you can help improving this database.</p>
 </div>
 

diff --git a/src/lanpartydb_website/blueprints/series/templates/series/index.html b/src/lanpartydb_website/blueprints/series/templates/series/index.html
@@ -4,7 +4,7 @@
 
 <h1>Series <small>{{ series_and_party_counts|length }}</small></h1>
 
-<table class="table--index">
+<table class="table--index is-centered-h">
   <thead>
     <tr>
       <th>{{ _('Name') }}</th>

diff --git a/src/lanpartydb_website/blueprints/series/templates/series/view.html b/src/lanpartydb_website/blueprints/series/templates/series/view.html
@@ -13,7 +13,7 @@ <h1>{{ series.name }}</h1>
 {%- if parties %}
 <h2>{{ _('Parties') }}</h2>
 {% include 'party/_list.html' %}
-<div class="block block--centered">{{ parties|length }} items</div>
+<div class="block is-centered-h">{{ parties|length }} items</div>
 {%- endif %}
 
 {%- endblock %}
diff --git a/src/lanpartydb_website/static/style/style.css b/src/lanpartydb_website/static/style/style.css
@@ -130,15 +130,6 @@ a:not(:hover) {
   }
 }
 
-.block--centered {
-  margin-inline: auto;
-  width: fit-content;
-}
-
-.text--centered {
-  text-align: center;
-}
-
 
 h1,
 h2,
@@ -148,6 +139,14 @@ table,
   margin-bottom: 1.5rem;
 }
 
+:is(
+  .block,
+  table,
+).is-centered-h {
+  margin-inline: auto;
+  width: fit-content;
+}
+
 
 /* grid */
 
@@ -423,3 +422,7 @@ table.table--wide {
 .contributors img {
   display: block;
 }
+
+.text--centered {
+  text-align: center;
+}