diff --git a/macrovision.css b/macrovision.css index cbdb74ec..5b19b892 100644 --- a/macrovision.css +++ b/macrovision.css @@ -104,6 +104,7 @@ body.toggle-entity-glow .entity-box:not(.selected) > img{ background: #444; overflow-x: hidden; overflow-y: auto; + width: 100%; height: 100%; scrollbar-color: #e1e1e1 #888; } @@ -165,6 +166,7 @@ body.toggle-entity-glow .entity-box:not(.selected) > img{ .options-row { position: relative; flex-direction: column; + flex-wrap: wrap; display: flex; text-align: center; align-items: center; @@ -172,7 +174,6 @@ body.toggle-entity-glow .entity-box:not(.selected) > img{ margin-right: auto; margin-top: 8px; margin-bottom: 8px; - max-width: 90%; } .options-row.full { @@ -285,6 +286,11 @@ body.show-extra-options .options-block.options-block-optional { flex-direction: row; } +.menubar-group button { + width: 48pt; + height: 48pt; +} + .popout-group { margin: 20px; display: flex; @@ -331,22 +337,35 @@ select.menu-item { #options .options-banner { width: calc(100% - 20px); } + +input { + padding: 2px; +} + +select { + padding: 2px; +} + .options-row .options-field-numeric { - flex: 1 1 100%; - max-width: 90%; + flex: 0 1 50%; font-size: 150%; + width: calc(90% - 12px); + padding-left: 4px; + padding-right: 4px; } .options-row .options-field-text { flex: 1 0 90%; - max-width: 90%; font-size: 150%; + width: 90%; } .options-row .options-field-unit { - flex: 1 1 10%; - max-width: 90%; + flex: 0 1 50%; font-size: 150%; + width: 90%; + padding-left: 4px; + padding-right: 4px; } .options-row .options-field-picker { @@ -508,33 +527,6 @@ a { transition: 0s !important; } -.corner-ribbon { - width: 200px; - background: #e43; - position: fixed; - top: 25px; - left: -50px; - text-align: center; - padding: 10px; - letter-spacing: 1px; - color: #f0f0f0; - transform: rotate(-45deg); - -webkit-transform: rotate(-45deg); -} - -.corner-ribbon.bottom-right{ - top: auto; - right: -50px; - bottom: 25px; - left: auto; - transform: rotate(-45deg); - -webkit-transform: rotate(-45deg); - } - -a.corner-ribbon { - text-decoration: none; -} - input[type=checkbox] { transform: scale(2); margin-left: 10px; @@ -647,6 +639,10 @@ i.far { font-size: 200%; } +#entity-view option { + font-weight: normal; +} + #spawners > select, #spawners > button, #filters > select, @@ -684,10 +680,11 @@ option.filtered { } .scroll-button { + transition: 0.2s; position: absolute; height: 20%; width: 50px; - font-size: 40px; + font-size: 28px; background: #ffffff33; border: 0px; z-index: 1002; @@ -698,11 +695,15 @@ option.filtered { } .scroll-button:hover { + transition: 0.2s; + font-size: 32px; background: #ffffff44; } .scroll-button:disabled { + transition: 0s; background: #ffffff11; + font-size: 28px; } .ratio-info { diff --git a/macrovision.js b/macrovision.js index bbd008fe..64999558 100644 --- a/macrovision.js +++ b/macrovision.js @@ -632,7 +632,7 @@ function drawRulers() { ctx.moveTo(start.x, start.y); ctx.lineTo(end.x, end.y); ctx.lineWidth = 5; - ctx.strokeStyle = "#f2f"; + ctx.strokeStyle = "#f8f"; ctx.stroke(); const center = { x: (start.x + end.x) / 2, y: (start.y + end.y) / 2 }; ctx.fillStyle = "#eeeeee"; diff --git a/reset.css b/reset.css index e29c0f5f..ea0fe5dc 100644 --- a/reset.css +++ b/reset.css @@ -23,6 +23,15 @@ time, mark, audio, video { font: inherit; vertical-align: baseline; } + +input, select { + margin: 0; + padding: 4px; + border-width: 1px; + font-size: 100%; + font: inherit; + vertical-align: baseline; +} /* HTML5 display-role reset for older browsers */ article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {