moanos/Notfellchen
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

refactor: Move all css to main

Browse Source
This commit is contained in:
moanos [he/him]
2025-06-23 20:39:41 +02:00
parent 7dfcbfe38f
commit 8ab38cc71b
3 changed files with 100 additions and 126 deletions
Download Patch File Download Diff File Expand all files Collapse all files

125
src/fellchensammlung/static/fellchensammlung/css/bulma-styles.css
View File

@@ -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%;
}

100
src/fellchensammlung/static/fellchensammlung/css/main.scss
View File

@@ -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';

1
src/fellchensammlung/templates/fellchensammlung/base.html
View File

@@ -10,7 +10,6 @@
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta name="description" content="{% translate "Farbratten aus dem Tierschutz finden und adoptieren" %}">
<!-- Add additional CSS in static file -->
<link rel="stylesheet" href="{% static 'fellchensammlung/css/bulma-styles.css' %}">
<link rel="stylesheet" href="{% static 'fellchensammlung/css/main.css' %}">
<link rel="stylesheet" href="{% static 'fellchensammlung/css/photoswipe.css' %}">
<link href="{% static 'fontawesomefree/css/fontawesome.css' %}" rel="stylesheet" type="text/css">