[fix] wrap categories on small screens ++ some code formatting - closes #647

This commit is contained in:
Adam Tauber
2016-07-27 02:08:24 +02:00
parent 350a84520d
commit bf92aa3fdd
10 changed files with 58 additions and 47 deletions
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
@@ -1,7 +1,8 @@
#advanced-search-container {
display:none;
text-align:left;
margin-bottom:1rem;
display: none;
text-align: left;
margin-bottom: 1rem;
clear: both;
label, .input-group-addon {
font-size: 1.2rem;
@@ -11,9 +12,8 @@
border-right: none;
color: @dark-gray;
padding-bottom: 0.4rem;
padding-top: 0.4rem;
padding-left: 0.5rem;
padding-right: 0.5rem;
padding-right: 0.7rem;
padding-left: 0.7rem;
}
label:last-child, .input-group-addon:last-child {
@@ -26,7 +26,7 @@
input[type="radio"]:checked + label{
color: @black;
font-weight:bold;
font-weight: bold;
border-bottom: @light-green 5px solid;
}
select {
@@ -59,10 +59,11 @@ Ny0yNFQxMToxNTowMCswMjowMP7RDgQAAAAZdEVYdFNvZnR3YXJlAHd3dy5pbmtzY2FwZS5vcmeb
}
#check-advanced:checked ~ #advanced-search-container {
display:block;
display: block;
}
.advanced {
margin-top:1rem;
text-align:right;
padding: 0;
margin-top: 0.3rem;
text-align: right;
}
@@ -1,18 +1,23 @@
.search_categories, #categories {
text-transform: capitalize;
margin-bottom: 0.5rem;
display: flex;
flex-wrap: wrap;
flex-flow: row wrap;
align-content: stretch;
label, .input-group-addon {
flex-grow: 1;
flex-basis: auto;
font-size: 1.2rem;
font-weight:normal;
font-weight: normal;
background-color: white;
border: @mild-gray 1px solid;
border-right: none;
color: @dark-gray;
padding-bottom: 0.4rem;
padding-top: 0.4rem;
padding-left: 0.5rem;
padding-right: 0.5rem;
text-align: center;
}
label:last-child, .input-group-addon:last-child {
border-right: @mild-gray 1px solid;
@@ -20,7 +25,7 @@
input[type="checkbox"]:checked + label {
color: @black;
font-weight:bold;
font-weight: bold;
border-bottom: @light-green 5px solid;
}
}
@@ -1,7 +1,8 @@
#advanced-search-container {
display:none;
text-align:center;
margin-bottom:1rem;
display: none;
text-align: center;
margin-bottom: 1rem;
clear: both;
label, .input-group-addon {
font-size: 1.3rem;
@@ -11,7 +12,6 @@
border-right: none;
color: #333;
padding-bottom: 0.8rem;
padding-top: 0.8rem;
padding-left: 1.2rem;
padding-right: 1.2rem;
}
@@ -19,14 +19,14 @@
label:last-child, .input-group-addon:last-child {
border-right: #DDD 1px solid;
}
input[type="radio"] {
display: none;
}
input[type="radio"]:checked + label{
input[type="radio"]:checked + label {
color: black;
font-weight:bold;
font-weight: bold;
background-color: #EEE;
}
}
@@ -36,10 +36,11 @@
}
#check-advanced:checked ~ #advanced-search-container {
display:block;
display: block;
}
.advanced {
margin-top:1rem;
text-align:right;
padding: 0;
margin-top: 0.3rem;
text-align: right;
}
@@ -1,19 +1,23 @@
.search_categories, #categories {
text-transform: capitalize;
margin-bottom:1.5rem;
margin-top:1.5rem;
margin-bottom: 1.5rem;
margin-top: 1.5rem;
display: flex;
flex-wrap: wrap;
align-content: stretch;
label, .input-group-addon {
flex-grow: 1;
flex-basis: auto;
font-size: 1.3rem;
font-weight:normal;
font-weight: normal;
background-color: white;
border: #DDD 1px solid;
border-right: none;
color: #333;
padding-bottom: 0.8rem;
padding-top: 0.8rem;
padding-left: 1.2rem;
padding-right: 1.2rem;
text-align: center;
}
label:last-child, .input-group-addon:last-child {
@@ -22,7 +26,7 @@
input[type="checkbox"]:checked + label{
color: black;
font-weight:bold;
font-weight: bold;
background-color: #EEE;
}
}