display club links on club main page

2026-05-14 04:58:06 +00:00 · 2026-05-05 22:43:59 +02:00
parent 2b0c36c085
commit f5eac164ec
5 changed files with 127 additions and 23 deletions
@@ -0,0 +1,66 @@
+#club-detail {
+  img.club-logo {
+    display: block;
+    max-height: 200px;
+    max-width: 200px;
+  }
+  #club-attributes {
+    ul {
+      list-style: none;
+      margin-left: 0;
+      display: flex;
+      flex-direction: column;
+      gap: .75rem;
+
+      li i {
+        margin-right: .5rem;
+      }
+    }
+  }
+
+  &:not(.has-links) {
+    #club-attributes {
+      float: right;
+      margin: 1em 0 1em 2em;
+
+      @media screen and (max-width: 650px) {
+        margin-left: 1em;
+      }
+      @media screen and (max-width: 400px) {
+        float: unset;
+        img.club-logo {
+          margin: auto;
+        }
+      }
+    }
+  }
+
+  &.has-links {
+    display: flex;
+    flex-direction: row-reverse;
+    gap: 2em;
+
+    @media screen and (max-width: 650px) {
+      flex-direction: column;
+      gap: 1em;
+    }
+
+    #club-attributes {
+      display: flex;
+      flex-direction: column;
+      gap: 1em;
+      min-width: 200px;
+      @media screen and (max-width: 650px) {
+        margin-top: 1em;
+        flex-direction: row-reverse;
+        justify-content: flex-end;
+        h4 {
+          margin: 0;
+        }
+        img.club-logo {
+          margin-left: auto;
+        }
+      }
+    }
+  }
+}