add icon buttons, misc styling on venue pages

2024-06-20 20:35:52 +02:00
parent 7e5f82ce76
commit 9b3eb3c4a6
12 changed files with 110 additions and 41 deletions
--- a/web/src/css/button.scss
+++ b/web/src/css/button.scss
@ -0,0 +1,38 @@
+button,
+.button {
+  display: inline-flex;
+  align-items: center;
+  gap: 1rem;
+  border-radius: 10rem;
+  background: var(--color-cta-background);
+  color: var(--color-cta-text);
+  border: none;
+  padding: .5rem 1rem;
+  margin: 0 0 .5rem;
+  font-family: var(--font-main);
+  font-size: var(--font-size-body);
+  font-weight: 500;
+  text-decoration: none;
+  transition: opacity var(--transition-easing);
+  cursor: pointer;
+
+  &:hover {
+    opacity: .8;
+  }
+
+  a {
+    text-decoration: none;
+  }
+
+  &.secondary {
+    color: var(--color-deepBrick);
+    background: var(--color-goldenBeige);
+  }
+
+  &.tertiary {
+    color: currentColor;
+    background: transparent;
+    border: 2px solid currentColor;
+    padding: .25rem .75rem;
+  }
+}