Fix advanced input bugs

This commit is contained in:
Dennis Eichhorn 2019-02-23 19:09:06 +01:00
parent 1ddc980162
commit 5689734940
8 changed files with 38 additions and 38 deletions

View File

@ -88,7 +88,8 @@ input[type="datetime-local"] {
input ~ .dropdown { input ~ .dropdown {
position: absolute; position: absolute;
display: none; } display: none;
z-index: 3; }
input:focus ~ .dropdown, input ~ .dropdown.active { input:focus ~ .dropdown, input ~ .dropdown.active {
display: inline-block; } display: inline-block; }

View File

@ -46,6 +46,7 @@ input[type="datetime-local"] {
input ~ .dropdown { input ~ .dropdown {
position: absolute; position: absolute;
display: none; display: none;
z-index: 3;
} }
input:focus ~ .dropdown, input ~ .dropdown.active { input:focus ~ .dropdown, input ~ .dropdown.active {

View File

@ -59,19 +59,17 @@
background-position: 0 0; } background-position: 0 0; }
100% { 100% {
background-position: 50px 50px; } } background-position: 50px 50px; } }
.orange > span { .meter.orange > span {
background-color: #f1a165; background-color: #f1a165;
background-image: -moz-linear-gradient(top, #f1a165, #f36d0a); background-image: -moz-linear-gradient(top, #f1a165, #f36d0a);
background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0, #f1a165), color-stop(1, #f36d0a)); background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0, #f1a165), color-stop(1, #f36d0a));
background-image: -webkit-linear-gradient(#f1a165, #f36d0a); } background-image: -webkit-linear-gradient(#f1a165, #f36d0a); }
.meter.blue > span {
.blue > span {
background-color: #96c2f1; background-color: #96c2f1;
background-image: -moz-linear-gradient(top, #96c2f1, #4394f3); background-image: -moz-linear-gradient(top, #96c2f1, #4394f3);
background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0, #96c2f1), color-stop(1, #4394f3)); background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0, #96c2f1), color-stop(1, #4394f3));
background-image: -webkit-linear-gradient(#96c2f1, #4394f3); } background-image: -webkit-linear-gradient(#96c2f1, #4394f3); }
.meter.red > span {
.red > span {
background-color: #f0a3a3; background-color: #f0a3a3;
background-image: -moz-linear-gradient(top, #f0a3a3, #f42323); background-image: -moz-linear-gradient(top, #f0a3a3, #f42323);
background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0, #f0a3a3), color-stop(1, #f42323)); background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0, #f0a3a3), color-stop(1, #f42323));

View File

@ -62,26 +62,27 @@
} }
} }
.orange > span { .meter {
background-color: #f1a165; &.orange > span {
background-image: -moz-linear-gradient(top, #f1a165, #f36d0a); background-color: #f1a165;
background-image: -webkit-gradient(linear,left top,left bottom,color-stop(0, #f1a165),color-stop(1, #f36d0a)); background-image: -moz-linear-gradient(top, #f1a165, #f36d0a);
background-image: -webkit-linear-gradient(#f1a165, #f36d0a); background-image: -webkit-gradient(linear,left top,left bottom,color-stop(0, #f1a165),color-stop(1, #f36d0a));
} background-image: -webkit-linear-gradient(#f1a165, #f36d0a);
}
.blue > span { &.blue > span {
background-color: #96c2f1; background-color: #96c2f1;
background-image: -moz-linear-gradient(top, #96c2f1, #4394f3); background-image: -moz-linear-gradient(top, #96c2f1, #4394f3);
background-image: -webkit-gradient(linear,left top,left bottom,color-stop(0, #96c2f1),color-stop(1, #4394f3)); background-image: -webkit-gradient(linear,left top,left bottom,color-stop(0, #96c2f1),color-stop(1, #4394f3));
background-image: -webkit-linear-gradient(#96c2f1, #4394f3); background-image: -webkit-linear-gradient(#96c2f1, #4394f3);
} }
&.red > span {
.red > span { background-color: #f0a3a3;
background-color: #f0a3a3; background-image: -moz-linear-gradient(top, #f0a3a3, #f42323);
background-image: -moz-linear-gradient(top, #f0a3a3, #f42323); background-image: -webkit-gradient(linear,left top,left bottom,color-stop(0, #f0a3a3),color-stop(1, #f42323));
background-image: -webkit-gradient(linear,left top,left bottom,color-stop(0, #f0a3a3),color-stop(1, #f42323)); background-image: -webkit-linear-gradient(#f0a3a3, #f42323);
background-image: -webkit-linear-gradient(#f0a3a3, #f42323); }
} }
.noanimation > span > span, .noanimation > span:after { .noanimation > span > span, .noanimation > span:after {

View File

@ -3386,7 +3386,7 @@ p {
/* pre */ /* pre */
/* tag */ /* tag */
.tooltip > i { .tooltip > i {
font-size: 0.9rem; font-size: 0.85rem;
position: relative; position: relative;
z-index: 2; z-index: 2;
cursor: pointer; } cursor: pointer; }
@ -3810,7 +3810,8 @@ input[type="datetime-local"] {
input ~ .dropdown { input ~ .dropdown {
position: absolute; position: absolute;
display: none; } display: none;
z-index: 3; }
input:focus ~ .dropdown, input ~ .dropdown.active { input:focus ~ .dropdown, input ~ .dropdown.active {
display: inline-block; } display: inline-block; }
@ -4660,19 +4661,17 @@ main {
background-position: 0 0; } background-position: 0 0; }
100% { 100% {
background-position: 50px 50px; } } background-position: 50px 50px; } }
.orange > span { .meter.orange > span {
background-color: #f1a165; background-color: #f1a165;
background-image: -moz-linear-gradient(top, #f1a165, #f36d0a); background-image: -moz-linear-gradient(top, #f1a165, #f36d0a);
background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0, #f1a165), color-stop(1, #f36d0a)); background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0, #f1a165), color-stop(1, #f36d0a));
background-image: -webkit-linear-gradient(#f1a165, #f36d0a); } background-image: -webkit-linear-gradient(#f1a165, #f36d0a); }
.meter.blue > span {
.blue > span {
background-color: #96c2f1; background-color: #96c2f1;
background-image: -moz-linear-gradient(top, #96c2f1, #4394f3); background-image: -moz-linear-gradient(top, #96c2f1, #4394f3);
background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0, #96c2f1), color-stop(1, #4394f3)); background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0, #96c2f1), color-stop(1, #4394f3));
background-image: -webkit-linear-gradient(#96c2f1, #4394f3); } background-image: -webkit-linear-gradient(#96c2f1, #4394f3); }
.meter.red > span {
.red > span {
background-color: #f0a3a3; background-color: #f0a3a3;
background-image: -moz-linear-gradient(top, #f0a3a3, #f42323); background-image: -moz-linear-gradient(top, #f0a3a3, #f42323);
background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0, #f0a3a3), color-stop(1, #f42323)); background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0, #f0a3a3), color-stop(1, #f42323));
@ -4896,9 +4895,9 @@ section > h2 {
display: inline-block; } display: inline-block; }
.tabview .tab-content > input { .tabview .tab-content > input {
display: none; } display: none; }
.tabview .tab-content input + div { .tabview .tab-content > input + div {
display: none; } display: none; }
.tabview .tab-content input:checked + div { .tabview .tab-content > input:checked + div {
display: inherit; } display: inherit; }
.tab-1 .tab-links { .tab-1 .tab-links {

View File

@ -30,9 +30,9 @@
display: inline-block; } display: inline-block; }
.tabview .tab-content > input { .tabview .tab-content > input {
display: none; } display: none; }
.tabview .tab-content input + div { .tabview .tab-content > input + div {
display: none; } display: none; }
.tabview .tab-content input:checked + div { .tabview .tab-content > input:checked + div {
display: inherit; } display: inherit; }
.tab-1 .tab-links { .tab-1 .tab-links {

View File

@ -24,11 +24,11 @@
display: none; display: none;
} }
input + div { > input + div {
display: none; display: none;
} }
input:checked + div { > input:checked + div {
display: inherit; display: inherit;
} }
} }

View File

@ -19,7 +19,7 @@
/* pre */ /* pre */
/* tag */ /* tag */
.tooltip > i { .tooltip > i {
font-size: 0.9rem; font-size: 0.85rem;
position: relative; position: relative;
z-index: 2; z-index: 2;
cursor: pointer; } cursor: pointer; }