Compare commits
No commits in common. "583b0fb49f1a001a267b02c0379f9bc67507e7e6" and "7167d275b64302ad5733dad21a1eab8d9acf9448" have entirely different histories.
583b0fb49f
...
7167d275b6
@ -47,7 +47,6 @@ h1, h2 {
|
|||||||
|
|
||||||
label {
|
label {
|
||||||
font-weight: bold;
|
font-weight: bold;
|
||||||
word-break: break-word;;
|
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|
||||||
@ -114,67 +113,4 @@ label {
|
|||||||
border: 1px solid #ccc;
|
border: 1px solid #ccc;
|
||||||
background-color: var(--secondary-light-one);
|
background-color: var(--secondary-light-one);
|
||||||
height: 36px;
|
height: 36px;
|
||||||
}
|
|
||||||
|
|
||||||
.cage-selector{
|
|
||||||
gap: 15px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.card {
|
|
||||||
text-align: center;
|
|
||||||
color: var(--text-two);
|
|
||||||
}
|
|
||||||
.card-photo {
|
|
||||||
height: 200px;
|
|
||||||
width: 200px;
|
|
||||||
background-color: #ffffff;
|
|
||||||
box-shadow: 0 0 25px rgba(17, 1, 68, 0.08);
|
|
||||||
border-radius: 8px;
|
|
||||||
position: relative;
|
|
||||||
cursor: pointer;
|
|
||||||
}
|
|
||||||
|
|
||||||
.card-photo img {
|
|
||||||
width: 70%;
|
|
||||||
height: 95%;
|
|
||||||
position: absolute;
|
|
||||||
margin: auto;
|
|
||||||
left: 0;
|
|
||||||
right: 0;
|
|
||||||
top: 0;
|
|
||||||
bottom: 0;
|
|
||||||
cursor: pointer;
|
|
||||||
}
|
|
||||||
|
|
||||||
.cage-selector {
|
|
||||||
display: flex;
|
|
||||||
flex-wrap: wrap;
|
|
||||||
}
|
|
||||||
|
|
||||||
input[type="checkbox"] {
|
|
||||||
-webkit-appearance: none;
|
|
||||||
position: relative;
|
|
||||||
width: 100%;
|
|
||||||
cursor: pointer;
|
|
||||||
}
|
|
||||||
input[type="checkbox"]:after {
|
|
||||||
position: absolute;
|
|
||||||
font-weight: 400;
|
|
||||||
content: "0";
|
|
||||||
font-size: 18px;
|
|
||||||
color: #478bfb;
|
|
||||||
right: 10px;
|
|
||||||
top: -5px;
|
|
||||||
}
|
|
||||||
input[type="checkbox"]:checked:after {
|
|
||||||
font-weight: 900;
|
|
||||||
content: "X";
|
|
||||||
color: #478bfb;
|
|
||||||
}
|
|
||||||
|
|
||||||
.form-measurements {
|
|
||||||
max-height: 90%;
|
|
||||||
}
|
|
||||||
input.measurement {
|
|
||||||
margin-top: 5%;
|
|
||||||
}
|
}
|
Binary file not shown.
Before Width: | Height: | Size: 3.2 MiB |
Binary file not shown.
Before Width: | Height: | Size: 25 KiB |
Binary file not shown.
Before Width: | Height: | Size: 68 KiB |
@ -1,5 +1,5 @@
|
|||||||
<!DOCTYPE html>
|
<!DOCTYPE html>
|
||||||
<html lang="en" xmlns="http://www.w3.org/1999/html">
|
<html lang="en">
|
||||||
<head>
|
<head>
|
||||||
<meta charset="UTF-8">
|
<meta charset="UTF-8">
|
||||||
<title>Knastrechner</title>
|
<title>Knastrechner</title>
|
||||||
@ -11,57 +11,6 @@
|
|||||||
<h1>Käfigrechner</h1>
|
<h1>Käfigrechner</h1>
|
||||||
<div class="content">
|
<div class="content">
|
||||||
<div class="container-form">
|
<div class="container-form">
|
||||||
<div class="cage-selector">
|
|
||||||
<div class="card">
|
|
||||||
<div class="card-photo">
|
|
||||||
<input type="checkbox" id="savic-xl"/>
|
|
||||||
<div>
|
|
||||||
<img src="assets/img/savic-xl.jpeg">
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<label for="savic-xl"> Savic Suite Royale XL</label>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
|
|
||||||
<div class="card">
|
|
||||||
<div class="card-photo">
|
|
||||||
<input type="checkbox" id="savic-95"/>
|
|
||||||
<div>
|
|
||||||
<img src="assets/img/savic-95-double.jpg">
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<label for="savic-95">Savic Suite Royale 95 Double</label>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
|
|
||||||
<div class="card">
|
|
||||||
<div class="card-photo">
|
|
||||||
<input type="checkbox" id="tiaki"/>
|
|
||||||
<div>
|
|
||||||
<img src="assets/img/tiaki.jpeg">
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<label>TIAKI Kleintierkäfig Étagère</label>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="card">
|
|
||||||
<div class="card-photo">
|
|
||||||
<input type="checkbox" id="tiaki"/>
|
|
||||||
<form class="form-measurements">
|
|
||||||
<input class="measurement" type="number" id="width">
|
|
||||||
<label for="width">Breite</label>
|
|
||||||
|
|
||||||
<input class="measurement" type="number" id="depth">
|
|
||||||
<label for="depth">Tiefe</label>
|
|
||||||
|
|
||||||
<input class="measurement" type="number" id="height">
|
|
||||||
<label for="height">Höhe</label>
|
|
||||||
</form>
|
|
||||||
</div>
|
|
||||||
<label>Anderer Käfig</label>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
</div>
|
|
||||||
<div class="input-element">
|
<div class="input-element">
|
||||||
<div class="slidecontainer">
|
<div class="slidecontainer">
|
||||||
<label for="numRats" id="labelNumRats">Anzahl an Ratten ?</label>
|
<label for="numRats" id="labelNumRats">Anzahl an Ratten ?</label>
|
||||||
|
Loading…
Reference in New Issue
Block a user