tech title icons

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

diff --git a/resources/sass/map.scss b/resources/sass/map.scss
index 599cd15111a0d81184b591232d4a9dd368891ec5..78c9a2b7ed36eb008e207810ba2d629df160ffcb 100644 (file)
--- a/resources/sass/map.scss
+++ b/resources/sass/map.scss
@@ -2,7 +2,7 @@
        path {
                fill: red;
                stroke: black;
-               stroke-width: 2px;
+               stroke-width: 1px;
                vector-effect: non-scaling-stroke;
        }
 }
@@ -15,6 +15,10 @@
        &.hidden {
                display: none;
        }
+
+       .tech-title-icons {
+               margin-right: 1ex;
+       }
 }
 
 .pin-list {
@@ -32,3 +36,94 @@
                text-decoration: none;
        }
 }
+
+.uw-super-tiles {
+       display: grid;
+       height: 100%;
+       grid-template-columns: repeat(16, 1fr);
+
+       > div {
+               position: relative;
+               border: thin solid black;
+               padding: .25ex;
+
+               &.dark {
+                       border: medium solid black;
+               }
+               &.kick {
+                       border: medium solid yellow;
+               }
+               &.weak-eg {
+                       border: medium solid orange;
+               }
+               &.strong-eg {
+                       border: medium solid green;
+               }
+
+               &::before,
+               &::after {
+                       position: absolute;
+                       top: 0;
+                       left: 0;
+                       width: 100%;
+                       height: 100%;
+                       pointer-events: none;
+               }
+
+               &.cam-x::before {
+                       content: '';
+                       height: 50%;
+                       border-bottom: thin solid cyan;
+               }
+               &.cam-xl::before {
+                       content: '';
+                       position: absolute;
+                       width: 50%;
+                       height: 50%;
+                       border-bottom: thin solid cyan;
+               }
+               &.cam-xr::before {
+                       content: '';
+                       position: absolute;
+                       left: 50%;
+                       width: 50%;
+                       height: 50%;
+                       border-bottom: thin solid cyan;
+               }
+               &.cam-y::after {
+                       content: '';
+                       position: absolute;
+                       width: 50%;
+                       border-right: thin solid cyan;
+               }
+               &.cam-yu::after {
+                       content: '';
+                       position: absolute;
+                       width: 50%;
+                       height: 50%;
+                       border-right: thin solid cyan;
+               }
+               &.cam-yd::after {
+                       content: '';
+                       position: absolute;
+                       top: 50%;
+                       width: 50%;
+                       height: 50%;
+                       border-right: thin solid cyan;
+               }
+       }
+
+       .cell-id,
+       .cell-drop {
+               margin: 0;
+               line-height: 1;
+       }
+       .cell-drop {
+               font-size: 80%;
+       }
+       .cell-link {
+               color: inherit;
+               cursor: pointer;
+               text-decoration: none;
+       }
+}