Update zIndex

This commit is contained in:
Vegard Berg 2023-10-14 14:53:05 +02:00
parent 89028ed512
commit adc39c9cca
3 changed files with 9 additions and 78 deletions

View File

@ -1,76 +1,7 @@
:root { @tailwind base;
font-family: Inter, system-ui, Avenir, Helvetica, Arial, sans-serif; @tailwind components;
line-height: 1.5; @tailwind utilities;
font-weight: 400;
font-synthesis: none; .popover-content {
text-rendering: optimizeLegibility; z-index: 30;
-webkit-font-smoothing: antialiased; }
-moz-osx-font-smoothing: grayscale;
-webkit-text-size-adjust: 100%;
}
a {
font-weight: 500;
color: #646cff;
text-decoration: inherit;
}
a:hover {
color: #535bf2;
}
body {
margin: 0;
display: flex;
place-items: center;
min-width: 320px;
min-height: 100vh;
}
h1 {
font-size: 3.2em;
line-height: 1.1;
}
.card {
padding: 2em;
}
#app {
max-width: 1280px;
margin: 0 auto;
padding: 2rem;
text-align: center;
}
button {
border-radius: 8px;
border: 1px solid transparent;
padding: 0.6em 1.2em;
font-size: 1em;
font-weight: 500;
font-family: inherit;
background-color: #1a1a1a;
cursor: pointer;
transition: border-color 0.25s;
}
button:hover {
border-color: #646cff;
}
button:focus,
button:focus-visible {
outline: 4px auto -webkit-focus-ring-color;
}
@media (prefers-color-scheme: light) {
:root {
color: #213547;
background-color: #ffffff;
}
a:hover {
color: #747bff;
}
button {
background-color: #f9f9f9;
}
}

View File

@ -175,7 +175,7 @@ vehiclesInit.subscribe((v) => {
paint={{'line-width': 5, 'line-color': 'orange'}} paint={{'line-width': 5, 'line-color': 'orange'}}
beforeLayerType={(l) => {console.log(l.type); return false}} beforeLayerType={(l) => {console.log(l.type); return false}}
/> />
<MarkerLayer let:feature> <MarkerLayer let:feature zIndex={10}>
<div class="quay">{feature.properties?.name ?? ""}</div> <div class="quay">{feature.properties?.name ?? ""}</div>
</MarkerLayer> </MarkerLayer>
</GeoJSON> </GeoJSON>

View File

@ -39,10 +39,10 @@ const clickHandler = () => {
</style> </style>
<Marker {lngLat} on:click={clickHandler}> <Marker {lngLat} on:click={clickHandler} zIndex={( $selectedLine == lineRef ? 20 : 0)}>
<Bus {iconSize} {bearing} face={lineNumber} /> <Bus {iconSize} {bearing} face={lineNumber} />
<Popup openOn="hover" offset={[0, -10]}> <Popup openOn="hover" offset={[0, -10]} popupClass="popover-content" >
<div class="popover-content"> <div class="popover-content">
<h4>{lineNumber}: {lineName}</h4> <h4>{lineNumber}: {lineName}</h4>
<p> <p>