Browse Source

Html Änderung

tags/LEDFlickr
Pupsmuckel 3 years ago
parent
commit
bb3a735d37
2 changed files with 19 additions and 45 deletions
  1. 3
    2
      data/index.html
  2. 16
    43
      data/style.css

+ 3
- 2
data/index.html View File

@@ -20,12 +20,13 @@
<div class="slider">
<input type="range" class="regler" value="50" min="1" max="100"
oninput="this.nextElementSibling.value = this.value">

<output>50</output>
</div>
</div>
<div class="ueberschrift">
Helligkeit bei Dunkelheit
<!--<label id="label_geschwindigkeit">
<!--<label id="label_pwm_dark">
</label>-->
<div class="slider">
<input type="range" class="regler" value="50" min="1" max="100"
@@ -47,7 +48,7 @@

<div class="ueberschrift">
Licht-An-Zeit
<!-- <label id="label_geschwindigkeit">
<!-- <label id="label_time">
</label>-->
<div class="slider">
<input type="range" class="regler" value="50" min="1" max="100"

+ 16
- 43
data/style.css View File

@@ -2,26 +2,24 @@ html {
font-size: 16px;
font-family: sans-serif, Arial, Helvetica;
background-color: #d4d4d4;
height: 100%;
background-image: url('Background.png');
background-repeat: no-repeat;
background-size: 150% 150%;
}

.topbar {
padding: 1em;
background-color: #1f1f1f;

color: white;
font-size: x-large;
text-align: center;
}

.control {
padding: 1em;
}

.ueberschrift{
color: #ffffff;
font-size: 50px;
width: 100%;

text-align: center;
}

@@ -49,33 +47,29 @@ input[type=range]::-webkit-slider-thumb{
width: 4%;
border-radius: 30px;
}
.slider {
width: 100%;
}

.kopfzeile{
color: #1f1f1f;
font-size: 50px;
width: 100%;
background-color: #8d8a8a;

}
p, li {
font-size: 16px;
line-height: 2;
letter-spacing: 1px;
}


body {
height: 100%;
margin: 0 auto;
border: none;
border-radius: 3;
background-image: url('Background.png');
background-repeat: no-repeat;
background-size: 100% 100%;
}


/*-------------------------------------------------------*/

/* The switch - the box around the slider */

/*Switch:
.switch {
position: relative;
display: inline-block;
@@ -83,48 +77,27 @@ body {
height: 34px;
}

/* Hide default HTML checkbox */
Hide default HTML checkbox
.switch input {
opacity: 0;
width: 0;
height: 0;
}
*/
/* The slider */
.slider {
width: 100%;
}

/*.slider:before {
position: absolute;
content: "";
height: 26px;
width: 26px;
left: 4px;
bottom: 4px;
background-color: white;
-webkit-transition: .4s;
transition: .4s;
}*/

input:checked + .slider {
/*input:checked + .slider {
background-color: #04AA6D;
}

input:focus + .slider {
box-shadow: 0 0 1px #04AA6D;
}
}*/
/*
input:checked + .slider:before {
-webkit-transform: translateX(26px);
-ms-transform: translateX(26px);
transform: translateX(26px);
}
/* Rounded sliders */
.slider.round {
border-radius: 34px;
}
.slider.round:before {
border-radius: 50%;
}


Loading…
Cancel
Save