Candle/suchergebnisse.css

106 lines
2.1 KiB
CSS
Raw Normal View History

2023-06-01 14:12:32 +02:00
/*TODO: Hintergrundfarben entfernen*/
.hauptcontainer {
/*Einzelne Elemente untereinander anzeigen.*/
flex-direction: column;
}
#searchResult_heading {
/* background-color: #70AD47; */
2023-06-01 14:12:32 +02:00
margin-top: 30px;
margin-left: 30px;
margin-bottom: 25px;
margin-right: 50px;
font-weight: 500;
2023-06-01 14:12:32 +02:00
}
/*Container wird mit Daten aus der Datenbank gefüllt.*/
#searchResult_container {
padding-left: 45px;
padding-right: 50px;
padding-bottom: 50px;
}
.book_container {
/* background-color: blueviolet; */
2023-06-01 14:12:32 +02:00
display: flex;
/*Einzelne Elemente nebeneinander anzeigen.*/
flex-direction: row;
cursor: pointer;
2023-06-01 14:12:32 +02:00
}
.bookCover_container {
/*background-color: blue;*/
2023-06-01 14:12:32 +02:00
display: flex;
/*Verbietet dem Container, seine Standardgröße (px) zu ändern.*/
flex: 0 0 150px;
2023-06-01 14:12:32 +02:00
align-items: center;
height: auto;
}
.bookCover {
/*Bild passt sich seinem Container an.*/
max-width:100%;
max-height:100%;
}
.bookDetails_container {
/* background-color: aquamarine; */
2023-06-01 14:12:32 +02:00
width: 100%;
display: flex;
flex-direction: column;
padding-left: 15px;
padding-right: 15px;
}
.bookTitle {
margin-bottom: 10px;
font-weight: 400;
}
.bookDetails {
margin-bottom: 10px;
2023-06-01 14:12:32 +02:00
}
.available_container {
width: fit-content;
/*Hintergrundfarbe wird an Inhalt angepasst.*/
background-color: #70AD47;
/*background-color: #F34343;*/
/*Element immer an der unteren Seite des Containers platzieren.*/
margin-top: auto;
}
.available {
color: white;
margin: 10px 25px;
}
.shoppingCart_container {
/* background-color: chartreuse; */
2023-06-01 14:12:32 +02:00
margin-left: auto;
margin-top: auto;
flex: 0 0 40px;
}
.shoppingCart {
background-image: url('pictures/shopping_cart.png');
width: 40px;
height: 40px;
background-size: contain;
background-repeat: no-repeat;
}
.shoppingCart:hover {
background-image: url('pictures/shopping_cart_hover.png');
cursor: pointer;
}
.divider {
margin-top: 15px;
margin-bottom: 15px;
background-color: #987554;
width: 100%;
height: 1px;
}