diff --git a/client/public/stylesheets/olympus.css b/client/public/stylesheets/olympus.css index 263f2cba..08485192 100644 --- a/client/public/stylesheets/olympus.css +++ b/client/public/stylesheets/olympus.css @@ -117,7 +117,7 @@ button[disabled="disabled"] { } -.ol-select:hover .ol-select-options { +.ol-select.is-open .ol-select-options { max-height: fit-content; padding:8px 0; } @@ -234,12 +234,8 @@ nav.ol-panel { height:58px; } -nav.ol-panel > :first-child { - margin-left:20px; -} - nav.ol-panel > :last-child { - margin-right:20px; + margin-right:5px; } diff --git a/client/public/stylesheets/uikit.css b/client/public/stylesheets/uikit.css index 057a032f..68b4feea 100644 --- a/client/public/stylesheets/uikit.css +++ b/client/public/stylesheets/uikit.css @@ -65,9 +65,9 @@ section { } #tabs > div { - background:rgb(199, 174, 120); + background:#660066; border-radius: 5px; - color:#333; + color:white; cursor: pointer; padding:6px 10px; } diff --git a/client/public/stylesheets/units.css b/client/public/stylesheets/units.css index 1989e707..3412dd37 100644 --- a/client/public/stylesheets/units.css +++ b/client/public/stylesheets/units.css @@ -85,33 +85,6 @@ div.unit[data-is-selected="true"] .unit-marker-border { Marker ******************************/ -/* -div.unit svg { - border-radius: var( --border-radius-sm ); - height: var( --unit-height ); - width: var( --unit-width ); - z-index:1; -} - - -div.unit-ground-vehicle svg { - transform: rotate( -45deg ); -} - -div.unit svg rect.unit-marker { - fill: var( --primary-grey ); - height: calc( var( --unit-air-height ) - var( --unit-stroke-width ) ); - rx: var( --unit-stroke-width ); - ry: var( --unit-stroke-width ); - stroke: var( --secondary-neutral ); - stroke-linejoin: round; - stroke-width: var( --unit-stroke-width ); - width: calc( var( --unit-air-width ) - var( --unit-stroke-width ) ); - x: var(--unit-air-label-x); - y: var(--unit-air-label-y); -} -//*/ - div.unit .unit-marker { background-color: transparent; background-repeat: no-repeat; diff --git a/client/src/index.ts b/client/src/index.ts index d0be2d05..239100f9 100644 --- a/client/src/index.ts +++ b/client/src/index.ts @@ -60,13 +60,32 @@ function setup() { /* Generic clicks */ document.addEventListener( "click", ( ev ) => { + if ( ev instanceof PointerEvent && ev.target instanceof HTMLElement ) { if ( ev.target.classList.contains( "olympus-dialog-close" ) ) { ev.target.closest( "div.olympus-dialog" )?.classList.add( "hide" ); } } + }); + + /** Olympus UI ***/ + document.querySelectorAll( ".ol-select" ).forEach( select => { + + // Do open/close toggle + select.addEventListener( "click", ev => { + select.classList.toggle( "is-open" ); + }); + + // Autoclose on mouseleave + select.addEventListener( "mouseleave", ev => { + select.classList.remove( "is-open" ); + }); + + }); + + /* ATC */ let atcFeatureSwitch = featureSwitches.getSwitch( "atc" ); if ( atcFeatureSwitch?.isEnabled() ) { diff --git a/client/views/navbar.ejs b/client/views/navbar.ejs index f04919b6..143e9ea3 100644 --- a/client/views/navbar.ejs +++ b/client/views/navbar.ejs @@ -1,7 +1,10 @@