controller: Made every button larger

This commit is contained in:
Jonatan Nilsson 2016-07-17 10:44:57 +00:00
parent 9826256ffb
commit 5f1c92c837
3 changed files with 71 additions and 15 deletions

View file

@ -10,10 +10,10 @@ exports.presetList = function(vm) {
return [
m('a.panel-graphic-preset-add.button', {
onclick: vm.addPreset.bind(vm),
}, 'Save to preset list'),
}, 'Save Preset'),
m('a.panel-graphic-display.success.button', {
onclick: vm.displayCurrent.bind(vm),
}, 'Display'),
}, 'Display Live'),
m('label', 'Presets'),
m('ul.panel-graphic-preset', vm.presets.map((item, index) =>
m('li', { key: index }, [
@ -24,15 +24,15 @@ exports.presetList = function(vm) {
value: item.values[graphic.settings.main],
})
),
m('div', { class: 'small-2 columns' },
m('div', { class: 'small-4 columns' },
[
m('a.panel-graphic-preset-remove.button.success', {
onclick: vm.displayPreset.bind(vm, item),
}, 'Display')
),
m('div', { class: 'small-2 columns' },
}, 'Display'),
m('a.panel-graphic-preset-remove.button.alert', {
onclick: vm.removePreset.bind(vm, item),
}, 'Remove')
}, 'X')
]
),
])
])

View file

@ -2,6 +2,7 @@
<html lang="en">
<head>
<title>CasparCG Controller</title>
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
<link href="foundation.css" rel="stylesheet" />
<link href="main.css" rel="stylesheet" />
</head>

View file

@ -123,6 +123,10 @@ h4 {
/* Inputs */
.panel-graphic-property-item input {
display: inline-block;
}
label {
color: #f1f1f1;
}
@ -178,9 +182,60 @@ h4 {
box-shadow: none;
}
select
a.button {
margin: 0 1rem 0 0;
width: 7rem;
}
/* Media queries */
body {
font-size: 1.5rem;
}
@media only screen and (max-device-width: 1280px) {
.header-item-hide {
width: 9rem;
line-height: 0rem;
}
a.button {
margin: 0 1rem;
width: 10rem;
font-size: 2rem;
line-height: 0;
width: auto;
}
.panel-graphic-preset {
margin: 0;
}
.panel-graphic-display,
.panel-graphic-preset-add {
margin-bottom: 3rem !important;
}
.panel-graphic-preset-remove {
padding-right: 0.5rem;
padding-left: 0.5rem;
}
.panel-graphic-preset-remove.alert {
padding-right: 1rem;
padding-left: 1rem;
}
.panel-graphic-settings {
font-size: 1.3rem !important;
}
.header-item-display {
font-size: 2rem;
margin-right: 12.5rem;
padding: 0.2rem 1rem;
}
.panel-graphic-property-item input {
font-size: 2rem;
height: 3.5rem;
}
}