strip emotes for language detection

[alttp.git] / resources / sass / tracker.scss

diff --git a/resources/sass/tracker.scss b/resources/sass/tracker.scss
index 01704b75f3f69e33ac4c696604798a349bc1a99c..cf6cb6df77302212fcdb64902b93f2b04ac017f7 100644 (file)
--- a/resources/sass/tracker.scss
+++ b/resources/sass/tracker.scss
@@ -1,68 +1,46 @@
 .tracker {
+       display: flex;
+       flex-direction: column;
+       height: 100vh;
+       align-items: stretch;
+       justify-content: flex-start;
+
        .auto-tracking {
                .custom-toggle {
                        vertical-align: middle;
                }
        }
-       .count-display,
-       .med-display {
-               background: black;
-               font-weight: bold;
-               text-align: center;
+       .canvas {
+               width: 100%;
+               height: auto;
+               max-height: 100%;
        }
-       .dungeon {
-               display: flex;
-               flex-direction: row;
-               align-items: stretch;
-               justify-content: flex-start;
-               gap: 1ex;
-               > * {
-                       width: 2em;
-                       height: 2em;
-               }
-               .dungeon-smalls .count-display,
+       .dungeons {
+               .count-display,
                .dungeon-tag {
-                       background: black;
-                       font-family: monospace;
-                       font-size: 115%;
+                       font-size: 0.5px;
                        font-weight: bold;
-                       text-align: center;
-               }
-               .dungeon-checks,
-               .dungeon-smalls {
-                       position: relative;
-                       .count-display {
-                               pointer-events: none;
-                               position: absolute;
-                               top: .3ex;
-                               left: .3ex;
-                               bottom: .3ex;
-                               right: .3ex;
-                               &.is-zero {
-                                       display: none;
-                               }
-                               &.is-full {
-                                       color: green;
-                               }
+                       fill: white;
+                       stroke: black;
+                       stroke-width: 0.25px;
+                       stroke-linejoin: round;
+                       paint-order: stroke fill;
+                       dominant-baseline: middle;
+                       text-anchor: middle;
+                       pointer-events: none;
+                       user-select: none;
+                       &.is-zero {
+                               display: none;
+                       }
+                       &.is-full {
+                               fill: green;
                        }
                }
-       }
-       .dungeons {
-               padding: 1ex;
-       }
-       .dungeon-ep,
-       .dungeon-pd {
-               margin-top: 1ex;
-       }
-       .equipment {
-               display: grid;
-               grid-template-columns: 3em 3em 3em 3em 3em;
-               gap: 1ex;
-               padding: 1ex;
+               .count-display {
+                       font-size: 0.65px;
+               }
        }
        .items {
-               width: 100%;
-               height: auto;
                .med-display {
                        font-size: 0.3px;
                        font-weight: bold;
@@ -81,58 +59,54 @@
                }
        }
        .tracker-map {
-               .canvas {
-                       width: 100%;
-                       height: auto;
-                       .location {
+               .location {
+                       .box {
+                               width: 0.04px;
+                               height: 0.04px;
+                               transform: translate(-0.02px, -0.02px);
+                               fill: #0d0;
+                               stroke: black;
+                               stroke-width: 1px;
+                               vector-effect: non-scaling-stroke;
+                       }
+                       .text {
+                               fill: black;
+                               font-size: 0.02px;
+                               font-weight: bold;
+                               text-anchor: middle;
+                               dominant-baseline: middle;
+                               pointer-events: none;
+                               user-select: none;
+                       }
+                       &.status-cleared {
                                .box {
-                                       width: 0.04px;
-                                       height: 0.04px;
-                                       transform: translate(-0.02px, -0.02px);
-                                       fill: #0d0;
-                                       stroke: black;
-                                       stroke-width: 1px;
-                                       vector-effect: non-scaling-stroke;
-                               }
-                               .text {
-                                       fill: black;
-                                       font-size: 0.02px;
-                                       font-weight: bold;
-                                       text-anchor: middle;
-                                       dominant-baseline: middle;
-                                       pointer-events: none;
-                                       user-select: none;
+                                       fill: grey;
+                                       opacity: 0.4;
                                }
-                               &.status-cleared {
-                                       .box {
-                                               fill: grey;
-                                               opacity: 0.4;
-                                       }
+                       }
+                       &.status-partial {
+                               .box {
+                                       fill: yellow;
                                }
-                               &.status-partial {
-                                       .box {
-                                               fill: yellow;
-                                       }
+                       }
+                       &.status-unavailable {
+                               .box {
+                                       fill: red;
                                }
-                               &.status-unavailable {
-                                       .box {
-                                               fill: red;
-                                       }
+                       }
+                       &.size-lg {
+                               .box {
+                                       width: 0.08px;
+                                       height: 0.08px;
+                                       transform: translate(-0.04px, -0.04px);
                                }
-                               &.size-lg {
-                                       .box {
-                                               width: 0.08px;
-                                               height: 0.08px;
-                                               transform: translate(-0.04px, -0.04px);
-                                       }
-                                       .text {
-                                               font-size: 0.04px;
-                                       }
+                               .text {
+                                       font-size: 0.04px;
                                }
-                               &.clickable {
-                                       .box:hover {
-                                               stroke: white;
-                                       }
+                       }
+                       &.clickable {
+                               .box:hover {
+                                       stroke: white;
                                }
                        }
                }