diff --git a/src/fellchensammlung/static/fellchensammlung/css/bulma-styles.css b/src/fellchensammlung/static/fellchensammlung/css/bulma-styles.css deleted file mode 100644 index f7421f8..0000000 --- a/src/fellchensammlung/static/fellchensammlung/css/bulma-styles.css +++ /dev/null @@ -1,125 +0,0 @@ -/***************/ -/* MAIN COLORS */ -/***************/ - -:root { - --primary-light-one: #5daa68; - --primary-light-two: #4a9455; - --primary-semidark-one: #356c3c; - --primary-dark-one: #17311b; - --secondary-light-one: #faf1cf; - --secondary-light-two: #e1d7b5; - --background-one: var(--primary-light-one); - --background-two: var(--primary-light-two); - --background-three: var(--secondary-light-one); - --background-four: var(--primary-dark-one); - --highlight-one: var(--primary-dark-one); - --highlight-one-text: var(--secondary-light-one); - --highlight-two: var(--primary-semidark-one); - --text-one: var(--secondary-light-one); - --shadow-one: var(--primary-dark-one); - --text-two: var(--primary-dark-one); - --text-three: var(--primary-light-one); - --shadow-three: var(--primary-dark-one); -} - -.content { - padding: 10px; -} - -/*******/ -/* MAP */ -/*******/ - -.map { - border-radius: 8px; - width: 100%; - height: 100% -} - -.marker { - background-image: url('../img/logo_transparent.png'); - background-size: cover; - width: 50px; - height: 50px; - cursor: pointer; -} - -.animal-shelter-marker { - background-image: url('../img/animal_shelter.png'); -!important; -} - -.map-in-content #map { - max-height: 500px; - width: 90%; -} - -@media only screen and (min-width: 768px) { - .maplibregl-popup { - max-width: 280px !important; - } -} - -@media only screen and (max-width: 768px) { - .maplibregl-popup { - max-width: 150px !important; - } -} - -.maplibregl-popup-close-button { - all: unset; /* Remove all inherited styles */ - font-size: 1.2rem; - background: none; - border: none; - color: black; - cursor: pointer; - position: absolute; - top: 0.25rem; - right: 0.5rem; - padding: 0.25rem; -} - -.popup-content { - line-height: 1.4; -} - - -/***** -IMAGES - *****/ - -.gallery .main-photo img { - width: 100%; - height: 150px; - object-fit: cover; /* Crops the images */ - border-radius: 6px; -} - -.thumbnail-row { - display: flex; - gap: 10px; - margin-top: 10px; -} - -.thumbnail img { - width: 100%; - height: 50px; - object-fit: cover; /* Crops the images */ - border-radius: 4px; -} - -/* Ensure each thumbnail takes equal width */ -.thumbnail { - flex: 1; -} - - -/** -AN Cards - */ - -.an-card { - width: 100%; - height: 100%; -} \ No newline at end of file diff --git a/src/fellchensammlung/static/fellchensammlung/css/main.scss b/src/fellchensammlung/static/fellchensammlung/css/main.scss index 77bf680..a848ce8 100644 --- a/src/fellchensammlung/static/fellchensammlung/css/main.scss +++ b/src/fellchensammlung/static/fellchensammlung/css/main.scss @@ -21,6 +21,7 @@ $confirm: hsl(133deg ,100%,calc(41% + 0%)); .content { margin: auto; max-width: 80em; + padding: 10px; } p > a { @@ -126,6 +127,105 @@ p > a.button { filter: brightness(0.9); } +/*******/ +/* MAP */ +/*******/ + +.map { + border-radius: 8px; + width: 100%; + height: 100% +} + +.marker { + background-image: url('../img/logo_transparent.png'); + background-size: cover; + width: 50px; + height: 50px; + cursor: pointer; +} + +.animal-shelter-marker { + background-image: url('../img/animal_shelter.png'); +!important; +} + +.map-in-content #map { + max-height: 500px; + width: 90%; +} + +@media only screen and (min-width: 768px) { + .maplibregl-popup { + max-width: 280px !important; + } +} + +@media only screen and (max-width: 768px) { + .maplibregl-popup { + max-width: 150px !important; + } +} + +.maplibregl-popup-close-button { + all: unset; /* Remove all inherited styles */ + font-size: 1.2rem; + background: none; + border: none; + color: black; + cursor: pointer; + position: absolute; + top: 0.25rem; + right: 0.5rem; + padding: 0.25rem; +} + +.popup-content { + line-height: 1.4; +} + + +/***** +IMAGES + *****/ + +.gallery .main-photo img { + width: 100%; + height: 150px; + object-fit: cover; /* Crops the images */ + border-radius: 6px; +} + +.thumbnail-row { + display: flex; + gap: 10px; + margin-top: 10px; +} + +.thumbnail img { + width: 100%; + height: 50px; + object-fit: cover; /* Crops the images */ + border-radius: 4px; +} + +/* Ensure each thumbnail takes equal width */ +.thumbnail { + flex: 1; +} + + +/** +AN Cards + */ + +.an-card { + width: 100%; + height: 100%; +} + + +// Fonts @font-face { font-family: 'Nunito'; diff --git a/src/fellchensammlung/templates/fellchensammlung/base.html b/src/fellchensammlung/templates/fellchensammlung/base.html index 2bf6ebb..752b053 100644 --- a/src/fellchensammlung/templates/fellchensammlung/base.html +++ b/src/fellchensammlung/templates/fellchensammlung/base.html @@ -10,7 +10,6 @@ -