add custom CSS

theopensystemslab · Dec 7, 2022 · c498f34 · c498f34
1 parent 76bbf82
commit c498f34
Show file tree

Hide file tree

Showing 2 changed files with 11 additions and 1 deletion.
diff --git a/index.html b/index.html
@@ -43,7 +43,7 @@
     <div style="display:flex;flex-direction:column;">
       <h1 style="color:red;font-family:Inter,Helvetica,sans-serif;font-size:16px;">*** This is a testing sandbox - these components are unaware of each other! ***</h1>
       <div style="margin-bottom:1em">
-        <my-map zoom="20" maxZoom="23" drawMode drawPointer="dot" id="example-map" />
+        <my-map zoom="20" maxZoom="23" drawMode drawPointer="dot" id="example-map" showScale />
       </div>
       <div style="margin-bottom:1em">
         <postcode-search hintText="Optional hint text shows up here" id="example-postcode" />

diff --git a/src/components/my-map/styles.scss b/src/components/my-map/styles.scss
@@ -26,6 +26,16 @@
 .ol-control button:hover {
   background-color: rgba(44, 44, 44, 0.85) !important;
 }
+.ol-scale-line {
+  background-color: transparent;
+}
+.ol-scale-line-inner {
+  border: 0.2em solid #2c2c2c;
+  border-top: none;
+  color: #2c2c2c;
+  font-size: 1em;
+  font-family: inherit;
+}
 .reset-control {
   top: 114px;
   left: 0.5em;