Buttons are taller on mobile so that you can get your finger on them

main2
Bob Mottram 2019-09-24 11:48:57 +01:00
parent 5be718fc0f
commit 7962de5667
1 changed files with 23 additions and 20 deletions

View File

@ -25,6 +25,9 @@
--button-selected-highlighted: darkgreen;
--button-approve: darkgreen;
--button-deny: darkred;
--button-height: 10px;
--button-height-padding-mobile: 20px;
--button-height-padding: 10px;
}
body, html {
@ -805,7 +808,7 @@ input[type=checkbox]
color: var(--button-text);
text-align: center;
font-size: 18px;
padding: 10px;
padding: var(--button-height-padding);
width: 10%;
max-width: 100px;
min-width: 80px;
@ -820,7 +823,7 @@ input[type=checkbox]
color: var(--button-text);
text-align: center;
font-size: 18px;
padding: 10px;
padding: var(--button-height-padding);
width: 10%;
max-width: 100px;
min-width: 80px;
@ -835,7 +838,7 @@ input[type=checkbox]
color: var(--button-text);
text-align: center;
font-size: 18px;
padding: 10px;
padding: var(--button-height-padding);
width: 10%;
max-width: 100px;
min-width: 80px;
@ -850,7 +853,7 @@ input[type=checkbox]
color: var(--button-text);
text-align: center;
font-size: 18px;
padding: 10px;
padding: var(--button-height-padding);
width: 10%;
max-width: 100px;
min-width: 80px;
@ -865,7 +868,7 @@ input[type=checkbox]
color: #FFFFFF;
text-align: center;
font-size: 18px;
padding: 10px;
padding: var(--button-height-padding);
width: 20%;
max-width: 200px;
min-width: 80px;
@ -880,7 +883,7 @@ input[type=checkbox]
color: #FFFFFF;
text-align: center;
font-size: 18px;
padding: 10px;
padding: var(--button-height-padding);
width: 20%;
max-width: 200px;
min-width: 80px;
@ -913,7 +916,7 @@ input[type=checkbox]
background-color: var(--button-background);
color: var(--button-text);
float: right;
padding: 10px;
padding: var(--button-height-padding);
margin: 15px;
border: none;
border-radius: 4px;
@ -925,7 +928,7 @@ input[type=checkbox]
background-color: var(--button-background);
color: var(--button-text);
float: left;
padding: 10px;
padding: var(--button-height-padding);
margin: 15px;
border: none;
border-radius: 4px;
@ -948,7 +951,7 @@ input[type=checkbox]
background-color: var(--button-background);
color: var(--button-text);
float: right;
padding: 10px;
padding: var(--button-height-padding);
margin: 15px;
border: none;
border-radius: 4px;
@ -966,7 +969,7 @@ input[type=checkbox]
color: var(--button-text);
text-align: center;
font-size: 18px;
padding: 10px;
padding: var(--button-height-padding);
width: 20%;
max-width: 200px;
min-width: 100px;
@ -1030,7 +1033,7 @@ input[type=checkbox]
color: var(--button-text);
text-align: center;
font-size: 32px;
padding: 10px;
padding: var(--button-height-padding-mobile);
width: 20%;
max-width: 400px;
min-width: 80px;
@ -1045,7 +1048,7 @@ input[type=checkbox]
color: var(--button-text);
text-align: center;
font-size: 32px;
padding: 10px;
padding: var(--button-height-padding-mobile);
width: 20%;
max-width: 400px;
min-width: 80px;
@ -1060,7 +1063,7 @@ input[type=checkbox]
color: var(--button-text);
text-align: center;
font-size: 32px;
padding: 10px;
padding: var(--button-height-padding-mobile);
width: 20%;
max-width: 400px;
min-width: 80px;
@ -1075,7 +1078,7 @@ input[type=checkbox]
color: var(--button-text);
text-align: center;
font-size: 32px;
padding: 10px;
padding: var(--button-height-padding-mobile);
width: 20%;
max-width: 400px;
min-width: 80px;
@ -1090,7 +1093,7 @@ input[type=checkbox]
color: #FFFFFF;
text-align: center;
font-size: 32px;
padding: 10px;
padding: var(--button-height-padding-mobile);
width: 20%;
max-width: 400px;
min-width: 80px;
@ -1105,7 +1108,7 @@ input[type=checkbox]
color: #FFFFFF;
text-align: center;
font-size: 32px;
padding: 10px;
padding: var(--button-height-padding-mobile);
width: 20%;
max-width: 400px;
min-width: 80px;
@ -1138,7 +1141,7 @@ input[type=checkbox]
background-color: var(--button-background);
color: var(--button-text);
float: right;
padding: 10px;
padding: var(--button-height-padding-mobile);
margin: 15px;
border: none;
border-radius: 4px;
@ -1150,7 +1153,7 @@ input[type=checkbox]
background-color: var(--button-background);
color: var(--button-text);
float: left;
padding: 10px;
padding: var(--button-height-padding-mobile);
margin: 15px;
border: none;
border-radius: 4px;
@ -1173,7 +1176,7 @@ input[type=checkbox]
background-color: var(--button-background);
color: var(--button-text);
float: right;
padding: 10px;
padding: var(--button-height-padding-mobile);
margin: 15px;
border: none;
border-radius: 4px;
@ -1191,7 +1194,7 @@ input[type=checkbox]
color: var(--button-text);
text-align: center;
font-size: 30px;
padding: 10px;
padding: var(--button-height-padding-mobile);
width: 20%;
max-width: 200px;
min-width: 100px;