Migrate centermessage to Tailwind
Migrate most attributes to Tailwind classes. The box is a bit wider now, which is OK IMO. The z-index could be migrated to a custom Tailwind config-entry later. The transition has probably a Tailwind version as well (to be checked later…).
This commit is contained in:
parent
66cb835ff0
commit
f5504d28f4
2 changed files with 3 additions and 20 deletions
19
index.css
19
index.css
|
@ -362,28 +362,9 @@ a {
|
|||
|
||||
|
||||
#centermessage {
|
||||
position: absolute;
|
||||
top: 30%;
|
||||
|
||||
left: 25%;
|
||||
width: 50%;
|
||||
|
||||
font-size: large;
|
||||
|
||||
padding: 2em;
|
||||
border-radius: 2em;
|
||||
z-index: 4000;
|
||||
pointer-events: none;
|
||||
|
||||
opacity: 1;
|
||||
background-color: var(--background-color);
|
||||
color: var(--foreground-color);
|
||||
|
||||
transition: opacity 500ms linear;
|
||||
|
||||
text-align: center;
|
||||
horiz-align: center;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
|
||||
|
|
|
@ -59,7 +59,9 @@
|
|||
|
||||
<div id="layer-selection" class="absolute bottom-3 left-3 rounded-3xl overflow-hidden"></div>
|
||||
|
||||
<div id="centermessage">Loading MapComplete, hang on...</div>
|
||||
<div id="centermessage" class="absolute rounded-3xl h-24 left-24 right-24 top-56 bg-white p-3 pt-5 sm:pt-8 text-xl font-bold text-center">
|
||||
Loading MapComplete, hang on...
|
||||
</div>
|
||||
|
||||
<div id="geolocate-button"></div>
|
||||
<div id="leafletDiv"></div>
|
||||
|
|
Loading…
Reference in a new issue