gerrit/Kitchen-Radio
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

flex 2 inline-box 4 controls

Browse Source
This commit is contained in:
Gerrit Linnemann 2015-11-16 21:51:21 +01:00
parent 42b236bb39
commit 147cc15e6d
2 changed files with 26 additions and 2 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

14
kitchenradio/public/stylesheets/style.css
View File

@ -135,6 +135,7 @@ body {
background-size: auto 100%; background-size: auto 100%;
background-repeat: no-repeat; background-repeat: no-repeat;
background-position: left top; background-position: left top;
overflow: hidden;
} }
.clearboth { .clearboth {
clear: both; clear: both;
@ -210,7 +211,7 @@ a {
flex-grow: 1; flex-grow: 1;
flex-basis: auto; flex-basis: auto;
align-self: flex-start; align-self: flex-start;
height: 100%; height: auto;
text-align: center; text-align: center;
text-decoration: none; text-decoration: none;
font-size: 50px; font-size: 50px;
@ -221,3 +222,14 @@ a {
#controls .control.empty { #controls .control.empty {
visibility: hidden; visibility: hidden;
} }
@media screen and (max-width: 320px) {
#controls {
display: block;
text-align: center;
}
#controls .control {
display: inline-block;
width: 25%;
margin: 0;
}
}

14
kitchenradio/public/stylesheets/style.less
View File

@ -66,6 +66,7 @@ body {
background-size: auto 100%; background-size: auto 100%;
background-repeat: no-repeat; background-repeat: no-repeat;
background-position: left top; background-position: left top;
overflow: hidden;
} }
.clearboth { .clearboth {
@ -155,7 +156,7 @@ a {
flex-grow: 1; flex-grow: 1;
flex-basis: auto; flex-basis: auto;
align-self: flex-start; align-self: flex-start;
height: 100%; height: auto;
text-align: center; text-align: center;
text-decoration: none; text-decoration: none;
font-size: 50px; font-size: 50px;
@ -168,4 +169,15 @@ a {
visibility: hidden; visibility: hidden;
} }
} }
@media screen and (max-width: 320px) {
display: block;
text-align: center;
.control {
display: inline-block;
width: 25%;
margin: 0;
}
}
} }