TheThing/filo_caspar
1
0
Fork 0
Code Issues Pull requests Projects Releases Wiki Activity

controller: Made every button larger

Browse source
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
Show stats Download patch file Download diff file Expand all files Collapse all files

22
app/controller/components.js
View file

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

1
public/index.html
View file

@ -2,6 +2,7 @@
<html lang="en"> <html lang="en">
<head> <head>
<title>CasparCG Controller</title> <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="foundation.css" rel="stylesheet" />
<link href="main.css" rel="stylesheet" /> <link href="main.css" rel="stylesheet" />
</head> </head>

63
public/main.css
View file

@ -123,6 +123,10 @@ h4 {
/* Inputs */ /* Inputs */
.panel-graphic-property-item input {
display: inline-block;
}
label { label {
color: #f1f1f1; color: #f1f1f1;
} }
@ -178,9 +182,60 @@ h4 {
box-shadow: none; box-shadow: none;
} }
select
a.button { a.button {
margin: 0 1rem; margin: 0 1rem 0 0;
width: 10rem; 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 {
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;
}
} }