Minor style fixes

This commit is contained in:
Dennis Eichhorn 2019-01-20 12:04:51 +01:00
parent d71b1605a1
commit 885494dc66
8 changed files with 158 additions and 153 deletions

88
nav.css
View File

@ -88,6 +88,9 @@
.nav-trigger { .nav-trigger {
position: absolute; position: absolute;
clip: rect(0, 0, 0, 0); } clip: rect(0, 0, 0, 0); }
.nav-trigger:checked ~ main {
width: calc(100% - 175px);
left: 175px; }
label[for="nav-trigger"] { label[for="nav-trigger"] {
font-size: 2.0em; font-size: 2.0em;
@ -95,10 +98,6 @@ label[for="nav-trigger"] {
width: 30px; width: 30px;
cursor: pointer; } cursor: pointer; }
.nav-trigger:checked ~ main {
width: calc(100% - 175px);
left: 175px; }
.nav-top { .nav-top {
user-select: none; user-select: none;
margin-top: 5px; margin-top: 5px;
@ -111,55 +110,46 @@ label[for="nav-trigger"] {
.nav-top > li { .nav-top > li {
-moz-box-shadow: inset 0px 1px 0px 0px #fff; -moz-box-shadow: inset 0px 1px 0px 0px #fff;
-webkit-box-shadow: inset 0px 1px 0px 0px #fff; -webkit-box-shadow: inset 0px 1px 0px 0px #fff;
box-shadow: inset 0px 1px 0px 0px #fff; box-shadow: inset 0px 1px 0px 0px #fff; }
text-shadow: 1px 1px 1px #fff; }
.nav-top > li:first-child { .nav-top > li:first-child {
-moz-box-shadow: inset 1px 1px 0px 0px #fff; -moz-box-shadow: inset 1px 1px 0px 0px #fff;
-webkit-box-shadow: inset 1px 1px 0px 0px #fff; -webkit-box-shadow: inset 1px 1px 0px 0px #fff;
box-shadow: inset 1px 1px 0px 0px #fff; } box-shadow: inset 1px 1px 0px 0px #fff; }
.nav-top > li > a {
.nav-top li { display: inline-block;
background: #fff; padding: 10px 10px; }
display: inline-block; .nav-top li {
margin-right: -4px; background: #fff;
position: relative; display: inline-block;
cursor: pointer; } position: relative;
cursor: pointer; }
.nav-top > li > a { .nav-top li:hover {
display: inline-block; background: #FBA026;
padding: 10px 10px; } color: #252525; }
.nav-top li:hover > ul {
.nav-top li:hover { display: block;
background: #555; opacity: 1;
color: #fff; visibility: visible; }
text-shadow: 0 -1px 0 #000; } .nav-top li > ul {
padding: 0;
.nav-top li > ul { z-index: 5;
padding: 0; position: absolute;
position: absolute; top: 36px;
top: 36px; left: 0;
left: 0; width: 150px;
width: 150px; display: none;
-webkit-box-shadow: none; opacity: 0;
-moz-box-shadow: none; visibility: hidden;
box-shadow: none; border-left: 1px solid #b7b7b7;
display: none; border-bottom: 1px solid #b7b7b7;
opacity: 0; border-right: 1px solid #b7b7b7; }
visibility: hidden; } .nav-top li > ul li {
display: block;
.nav-top li > ul li { color: #000;
background: #555; padding: 7px; }
display: block; .nav-top li > ul li:hover {
color: #fff; color: #252525;
text-shadow: 0 -1px 0 #000; } background: #FBA026; }
.nav-top li > ul li:hover {
background: #666; }
.nav-top li:hover > ul {
display: block;
opacity: 1;
visibility: visible; }
@media screen and (max-width: 600px) { @media screen and (max-width: 600px) {
.nav-trigger:checked ~ main { .nav-trigger:checked ~ main {

View File

@ -122,6 +122,11 @@
.nav-trigger { .nav-trigger {
position: absolute; position: absolute;
clip: rect(0, 0, 0, 0); clip: rect(0, 0, 0, 0);
&:checked ~ main {
width: calc(100% - 175px);
left: 175px;
}
} }
label[for="nav-trigger"] { label[for="nav-trigger"] {
@ -131,11 +136,6 @@ label[for="nav-trigger"] {
cursor: pointer; cursor: pointer;
} }
.nav-trigger:checked ~ main {
width: calc(100% - 175px);
left: 175px;
}
.nav-top { .nav-top {
user-select: none; user-select: none;
margin-top: 5px; margin-top: 5px;
@ -147,59 +147,60 @@ label[for="nav-trigger"] {
> li { > li {
@include box-shadow-top(#fff); @include box-shadow-top(#fff);
text-shadow: 1px 1px 1px #fff;
&:first-child { &:first-child {
@include box-shadow-out(#fff); @include box-shadow-out(#fff);
} }
> a {
display: inline-block;
padding: 10px 10px;
}
} }
}
.nav-top li { li {
background: #fff; background: #fff;
display: inline-block; display: inline-block;
margin-right: -4px; position: relative;
position: relative; cursor: pointer;
cursor: pointer;
}
.nav-top > li > a { &:hover {
display: inline-block; background: $default-highlighter;
padding: 10px 10px; color: #252525;
}
.nav-top li:hover { > ul {
background: #555; display: block;
color: #fff; opacity: 1;
text-shadow: 0 -1px 0 #000; visibility: visible;
} }
}
.nav-top li > ul { > ul {
padding: 0; padding: 0;
position: absolute; z-index: 5;
top: 36px; position: absolute;
left: 0; top: 36px;
width: 150px; left: 0;
-webkit-box-shadow: none; width: 150px;
-moz-box-shadow: none; display: none;
box-shadow: none; opacity: 0;
display: none; visibility: hidden;
opacity: 0; border-left: 1px solid $content-border-color;
visibility: hidden; border-bottom: 1px solid $content-border-color;
} border-right: 1px solid $content-border-color;
.nav-top li > ul li { li {
background: #555; display: block;
display: block; color: #000;
color: #fff; padding: 7px;
text-shadow: 0 -1px 0 #000;
}
.nav-top li > ul li:hover { background: #666; } &:hover {
.nav-top li:hover > ul { color: #252525;
display: block; background: $default-highlighter;
opacity: 1; }
visibility: visible; }
}
}
} }
@media screen and (max-width: 600px) { @media screen and (max-width: 600px) {

View File

@ -4443,6 +4443,9 @@ ul.h-list li {
.nav-trigger { .nav-trigger {
position: absolute; position: absolute;
clip: rect(0, 0, 0, 0); } clip: rect(0, 0, 0, 0); }
.nav-trigger:checked ~ main {
width: calc(100% - 175px);
left: 175px; }
label[for="nav-trigger"] { label[for="nav-trigger"] {
font-size: 2.0em; font-size: 2.0em;
@ -4450,10 +4453,6 @@ label[for="nav-trigger"] {
width: 30px; width: 30px;
cursor: pointer; } cursor: pointer; }
.nav-trigger:checked ~ main {
width: calc(100% - 175px);
left: 175px; }
.nav-top { .nav-top {
user-select: none; user-select: none;
margin-top: 5px; margin-top: 5px;
@ -4466,55 +4465,46 @@ label[for="nav-trigger"] {
.nav-top > li { .nav-top > li {
-moz-box-shadow: inset 0px 1px 0px 0px #fff; -moz-box-shadow: inset 0px 1px 0px 0px #fff;
-webkit-box-shadow: inset 0px 1px 0px 0px #fff; -webkit-box-shadow: inset 0px 1px 0px 0px #fff;
box-shadow: inset 0px 1px 0px 0px #fff; box-shadow: inset 0px 1px 0px 0px #fff; }
text-shadow: 1px 1px 1px #fff; }
.nav-top > li:first-child { .nav-top > li:first-child {
-moz-box-shadow: inset 1px 1px 0px 0px #fff; -moz-box-shadow: inset 1px 1px 0px 0px #fff;
-webkit-box-shadow: inset 1px 1px 0px 0px #fff; -webkit-box-shadow: inset 1px 1px 0px 0px #fff;
box-shadow: inset 1px 1px 0px 0px #fff; } box-shadow: inset 1px 1px 0px 0px #fff; }
.nav-top > li > a {
.nav-top li { display: inline-block;
background: #fff; padding: 10px 10px; }
display: inline-block; .nav-top li {
margin-right: -4px; background: #fff;
position: relative; display: inline-block;
cursor: pointer; } position: relative;
cursor: pointer; }
.nav-top > li > a { .nav-top li:hover {
display: inline-block; background: #FBA026;
padding: 10px 10px; } color: #252525; }
.nav-top li:hover > ul {
.nav-top li:hover { display: block;
background: #555; opacity: 1;
color: #fff; visibility: visible; }
text-shadow: 0 -1px 0 #000; } .nav-top li > ul {
padding: 0;
.nav-top li > ul { z-index: 5;
padding: 0; position: absolute;
position: absolute; top: 36px;
top: 36px; left: 0;
left: 0; width: 150px;
width: 150px; display: none;
-webkit-box-shadow: none; opacity: 0;
-moz-box-shadow: none; visibility: hidden;
box-shadow: none; border-left: 1px solid #b7b7b7;
display: none; border-bottom: 1px solid #b7b7b7;
opacity: 0; border-right: 1px solid #b7b7b7; }
visibility: hidden; } .nav-top li > ul li {
display: block;
.nav-top li > ul li { color: #000;
background: #555; padding: 7px; }
display: block; .nav-top li > ul li:hover {
color: #fff; color: #252525;
text-shadow: 0 -1px 0 #000; } background: #FBA026; }
.nav-top li > ul li:hover {
background: #666; }
.nav-top li:hover > ul {
display: block;
opacity: 1;
visibility: visible; }
@media screen and (max-width: 600px) { @media screen and (max-width: 600px) {
.nav-trigger:checked ~ main { .nav-trigger:checked ~ main {
@ -4884,7 +4874,7 @@ section > h2 {
/* pre */ /* pre */
/* tag */ /* tag */
.tabview .tab-links { .tabview .tab-links {
padding: 0.3rem 0 0 0.3rem; } padding: 0.3rem 0 0 0; }
.tabview .tab-links label { .tabview .tab-links label {
text-shadow: 1px 1px 1px #fff; text-shadow: 1px 1px 1px #fff;
font-size: 0.9em; font-size: 0.9em;
@ -4975,6 +4965,13 @@ section > h2 {
/* pagination */ /* pagination */
/* pre */ /* pre */
/* tag */ /* tag */
table.fixed {
table-layout: fixed; }
table.fixed td {
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis; }
table:not([id]) > thead .sort-asc, table:not([id]) > thead .sort-desc { table:not([id]) > thead .sort-asc, table:not([id]) > thead .sort-desc {
display: none; } display: none; }

View File

@ -19,7 +19,7 @@
/* pre */ /* pre */
/* tag */ /* tag */
.tabview .tab-links { .tabview .tab-links {
padding: 0.3rem 0 0 0.3rem; } padding: 0.3rem 0 0 0; }
.tabview .tab-links label { .tabview .tab-links label {
text-shadow: 1px 1px 1px #fff; text-shadow: 1px 1px 1px #fff;
font-size: 0.9em; font-size: 0.9em;

View File

@ -2,7 +2,7 @@
.tabview { .tabview {
.tab-links { .tab-links {
padding: 0.3rem 0 0 0.3rem; padding: 0.3rem 0 0 0;
label { label {
text-shadow: 1px 1px 1px #fff; text-shadow: 1px 1px 1px #fff;
@ -91,7 +91,7 @@
border-bottom: 1px solid $content-border-color; border-bottom: 1px solid $content-border-color;
} }
} }
.tab-content { .tab-content {
width: 100%; width: 100%;
border-top: 1px solid $content-border-color; border-top: 1px solid $content-border-color;
@ -104,11 +104,11 @@
label { label {
padding: 5px 10px 5px 10px; padding: 5px 10px 5px 10px;
} }
li { li {
margin: 0 5px 15px 0; margin: 0 5px 15px 0;
} }
.active a, .active label { .active a, .active label {
border: 1px solid $content-border-color; border: 1px solid $content-border-color;
@include gradient-top-bottom(#fff, 0, $content-background-color, 100, #fff); @include gradient-top-bottom(#fff, 0, $content-background-color, 100, #fff);

View File

@ -18,6 +18,13 @@
/* pagination */ /* pagination */
/* pre */ /* pre */
/* tag */ /* tag */
table.fixed {
table-layout: fixed; }
table.fixed td {
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis; }
table:not([id]) > thead .sort-asc, table:not([id]) > thead .sort-desc { table:not([id]) > thead .sort-asc, table:not([id]) > thead .sort-desc {
display: none; } display: none; }

View File

@ -1,5 +1,15 @@
@import "_mixins", "_vars"; @import "_mixins", "_vars";
table.fixed {
table-layout: fixed;
td {
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
}
}
table:not([id]) > thead .sort-asc, table:not([id]) > thead .sort-desc { table:not([id]) > thead .sort-asc, table:not([id]) > thead .sort-desc {
display: none; display: none;
} }

View File

@ -37,8 +37,8 @@
<tr> <tr>
<td colspan="2"><label>Special</label></td> <td colspan="2"><label>Special</label></td>
<tr> <tr>
<td colspan="2"><span class="input"><button type="button"><i class="fa fa-pencil"></i></button><input type="text"></span></td> <td colspan="2">
<span class="input"><button type="button"><i class="fa fa-pencil"></i></button><input type="text"></span></td>
<tr> <tr>
<td colspan="2"><label>Number</label></td> <td colspan="2"><label>Number</label></td>
<tr> <tr>