::-webkit-scrollbar { display: none; } ::-webkit-progress-bar { background: map-get($colors, grey); } ::-webkit-progress-value { background-color: map-get($colors, primary); } html { height: 100%; background-size: cover; -webkit-overflow-scrolling: touch; } body { font-size: 2rem; font-family: Arial; color: map-get($colors, font); margin: 0 5%; height: 100%; a { color: map-get($colors, font); text-decoration: none; font-size: 2.5rem; } .button { &[value="true"] { color: map-get($colors, primary); .disabled { display: none; } .enabled { display: block; } } &[value="false"] { color: map-get($colors, grey); .disabled { display: block; } .enabled { display: none; } } } .page { display: flex; flex-direction: column; flex-wrap: wrap; justify-content: center; height: 100%; &.hide { display: none; } .header { text-align: center; margin: 0; } .entry { height: 120px; line-height: 120px; border-bottom: 1px solid map-get($colors, grey); &:last-child { border-bottom: none2; } .icon { width: 10%; position: relative; float: left; text-align: center; } .label { position: relative; float: left; text-align: left; width: 80%; } .control { width: 10%; position: relative; float: left; text-align: right; font-size: 5rem; .icon-toggle_on { color: map-get($colors, primary); } } } .confirm { position: absolute; bottom: 5%; text-align: center; height: 120px; line-height: 120px; width: 90%; background: map-get($colors, primary); border-radius: 20px; } } .log { display: none; position: absolute; bottom: 0; left: 0; width: 1080px; background: white; font-size: 1.5rem; } }