From b7aa6a760d297bebf0d99e405346ee88e5082115 Mon Sep 17 00:00:00 2001 From: Felix Rieseberg Date: Mon, 19 Aug 2019 17:37:35 -0400 Subject: [PATCH] build: Move to less for styles --- src/less/emulator.less | 16 ++++ src/less/floppy.less | 15 ++++ src/less/info.less | 7 ++ src/less/root.less | 77 ++++++++++++++++++ src/{renderer/style => less}/start.png | Bin .../style/status.css => less/status.less} | 0 src/{renderer/style => less}/vendor/95.ttf | Bin src/{renderer/style => less}/vendor/95css.css | 0 src/{renderer/style => less}/vendor/LICENSE | 0 .../style => less}/vendor/bg-pattern.png | Bin .../style => less}/vendor/dropdown.png | Bin .../style => less}/vendor/windows.woff | Bin .../style => less}/vendor/windows.woff2 | Bin src/renderer/style/resets.css | 33 -------- src/renderer/style/style.css | 75 ----------------- 15 files changed, 115 insertions(+), 108 deletions(-) create mode 100644 src/less/emulator.less create mode 100644 src/less/floppy.less create mode 100644 src/less/info.less create mode 100644 src/less/root.less rename src/{renderer/style => less}/start.png (100%) rename src/{renderer/style/status.css => less/status.less} (100%) rename src/{renderer/style => less}/vendor/95.ttf (100%) rename src/{renderer/style => less}/vendor/95css.css (100%) rename src/{renderer/style => less}/vendor/LICENSE (100%) rename src/{renderer/style => less}/vendor/bg-pattern.png (100%) rename src/{renderer/style => less}/vendor/dropdown.png (100%) rename src/{renderer/style => less}/vendor/windows.woff (100%) rename src/{renderer/style => less}/vendor/windows.woff2 (100%) delete mode 100644 src/renderer/style/resets.css delete mode 100644 src/renderer/style/style.css diff --git a/src/less/emulator.less b/src/less/emulator.less new file mode 100644 index 0000000..c457743 --- /dev/null +++ b/src/less/emulator.less @@ -0,0 +1,16 @@ +#emulator { + height: 100vh; + width: 100vw; + display: flex; + + > div { + white-space: pre; + font: 14px monospace; + line-height: 14px + } + + > canvas { + display: none; + margin: auto; + } +} diff --git a/src/less/floppy.less b/src/less/floppy.less new file mode 100644 index 0000000..1318db4 --- /dev/null +++ b/src/less/floppy.less @@ -0,0 +1,15 @@ +#floppy-path { + font-size: .6rem; + width: 100%; + height: 30px; + padding-left: 8px; + border-color: #000 #fff #fff #000; + border-style: solid; + border-width: 2px; + background-color: #c3c3c3; + line-height: 27px; +} + +#file-input { + display: none; +} diff --git a/src/less/info.less b/src/less/info.less new file mode 100644 index 0000000..de264f1 --- /dev/null +++ b/src/less/info.less @@ -0,0 +1,7 @@ +#information { + text-align: center; + position: absolute; + width: 100vw; + bottom: 50px; + font-size: 18px; +} diff --git a/src/less/root.less b/src/less/root.less new file mode 100644 index 0000000..9061eb0 --- /dev/null +++ b/src/less/root.less @@ -0,0 +1,77 @@ +@import "./status.less"; +@import "./emulator.less"; +@import "./info.less"; +@import "./floppy.less"; + +/* GENERAL RESETS */ + +html, body { + margin: 0; + padding: 0; +} + +body { + background: #000; +} + +body.paused > #emulator { + display: none; +} + +body.paused { + background: #008080; + font-family: Courier; +} + +#buttons { + user-select: none; +} + +section { + display: flex; + position: absolute; + width: 100vw; + height: 100vh; + align-items: center; + justify-content: center; +} + +.card { + width: 75%; + max-width: 700px; + min-width: 400px; +} + +.windows95 { + nav .nav-link, + nav .nav-logo { + height: 30px; + line-height: 1.5; + } + + nav .nav-logo img { + margin-left: 2px; + max-height: 20px; + } + + nav .nav-logo > span { + position: absolute; + top: 9px; + left: 37px; + font-weight: bold; + } + + .btn:focus { + border-color: #fff #000 #000 #fff; + outline: 5px auto -webkit-focus-ring-color; + } + + .btn.active:before, + .btn:focus:before, + button.active:before, + button:focus:before, + input[type=submit].active:before, + input[type=submit]:focus:before { + border-color: #dedede grey grey #dedede; + } +} diff --git a/src/renderer/style/start.png b/src/less/start.png similarity index 100% rename from src/renderer/style/start.png rename to src/less/start.png diff --git a/src/renderer/style/status.css b/src/less/status.less similarity index 100% rename from src/renderer/style/status.css rename to src/less/status.less diff --git a/src/renderer/style/vendor/95.ttf b/src/less/vendor/95.ttf similarity index 100% rename from src/renderer/style/vendor/95.ttf rename to src/less/vendor/95.ttf diff --git a/src/renderer/style/vendor/95css.css b/src/less/vendor/95css.css similarity index 100% rename from src/renderer/style/vendor/95css.css rename to src/less/vendor/95css.css diff --git a/src/renderer/style/vendor/LICENSE b/src/less/vendor/LICENSE similarity index 100% rename from src/renderer/style/vendor/LICENSE rename to src/less/vendor/LICENSE diff --git a/src/renderer/style/vendor/bg-pattern.png b/src/less/vendor/bg-pattern.png similarity index 100% rename from src/renderer/style/vendor/bg-pattern.png rename to src/less/vendor/bg-pattern.png diff --git a/src/renderer/style/vendor/dropdown.png b/src/less/vendor/dropdown.png similarity index 100% rename from src/renderer/style/vendor/dropdown.png rename to src/less/vendor/dropdown.png diff --git a/src/renderer/style/vendor/windows.woff b/src/less/vendor/windows.woff similarity index 100% rename from src/renderer/style/vendor/windows.woff rename to src/less/vendor/windows.woff diff --git a/src/renderer/style/vendor/windows.woff2 b/src/less/vendor/windows.woff2 similarity index 100% rename from src/renderer/style/vendor/windows.woff2 rename to src/less/vendor/windows.woff2 diff --git a/src/renderer/style/resets.css b/src/renderer/style/resets.css deleted file mode 100644 index 077fe1f..0000000 --- a/src/renderer/style/resets.css +++ /dev/null @@ -1,33 +0,0 @@ -/* GENERAL RESETS */ - -.windows95 nav .nav-link, -.windows95 nav .nav-logo { - height: 30px; - line-height: 1.5; -} - -.windows95 nav .nav-logo img { - margin-left: 2px; - max-height: 20px; -} - -.windows95 nav .nav-logo > span { - position: absolute; - top: 9px; - left: 37px; - font-weight: bold; -} - -.windows95 .btn:focus { - border-color: #fff #000 #000 #fff; - outline: 5px auto -webkit-focus-ring-color; -} - -.windows95 .btn.active:before, -.windows95 .btn:focus:before, -.windows95 button.active:before, -.windows95 button:focus:before, -.windows95 input[type=submit].active:before, -.windows95 input[type=submit]:focus:before { - border-color: #dedede grey grey #dedede; -} diff --git a/src/renderer/style/style.css b/src/renderer/style/style.css deleted file mode 100644 index ab853c5..0000000 --- a/src/renderer/style/style.css +++ /dev/null @@ -1,75 +0,0 @@ -@import "./resets.css"; -@import "./status.css"; - -html, body { - margin: 0; - padding: 0; -} - -body { - background: #000; -} - -body.paused > #emulator { - display: none; -} - -body.paused { - background: #008080; - font-family: Courier; -} - -#buttons { - user-select: none; -} - -#floppy-path { - font-size: .6rem; - width: 100%; - height: 30px; - padding-left: 8px; - border-color: #000 #fff #fff #000; - border-style: solid; - border-width: 2px; - background-color: #c3c3c3; - line-height: 27px; -} - -#information { - text-align: center; - position: absolute; - width: 100vw; - bottom: 50px; - font-size: 18px; -} - -#emulator { - display: flex -} - -#emulator canvas { - margin: auto; -} - -#file-input { - display: none; -} - -section { - display: none; -} - -section.visible { - display: flex; - position: absolute; - width: 100vw; - height: 100vh; - align-items: center; - justify-content: center; -} - -.card { - width: 75%; - max-width: 700px; - min-width: 400px; -}