Responsive bugs fixed + ui changes

pull/27/head
Maciej 2021-12-30 10:38:35 +01:00
rodzic 9ae8019940
commit 085e32cc4e
3 zmienionych plików z 12 dodań i 13 usunięć

Wyświetl plik

@ -34,7 +34,7 @@
</head>
<body>
<nav class="navbar is-success p-1 has-shadow" role="navigation" aria-label="main navigation">
<nav class="navbar is-success p-1" role="navigation" aria-label="main navigation">
<div class="navbar-brand">
<a class="has-text-weight-light navbar-item has-text-white-ter is-size-4 is-size-5-mobile" href="#">
@ -42,7 +42,7 @@
</a>
<span class="has-text-success-light has-text-weight-light navbar-item is-size-6 is-size-7-touch pl-0">
<span class="has-text-grey-light mr-2">|</span>tworzona z ❤️
<span class="has-text-grey-light mr-2 is-hidden-mobile">|</span>tworzona z ❤️
przez&nbsp;
<span class="has-text-weight-medium"> <a href="https://openstreetmap.org.pl/" target="_blank"
title="Odwiedź stronę polskiej społeczności OSM"
@ -95,13 +95,13 @@
<div class="card">
<div id="sidebar-header">
<div class="columns is-vcentered is-flex p-1 mr-0">
<div class="columns is-vcentered is-flex mr-0">
<div class="column is-one-quarter is-one-fifth-mobile ">
<img class="image" src="./src/img/card-image.png" alt="Placeholder image" id="sidebar-card-image">
</div>
<div class="column">
<p id="sidebar-caption" class="title has-text-white-ter has-text-weight-light py-2"></p>
<p id="sidebar-caption" class="title has-text-white-ter has-text-weight-light"></p>
</div>
<button id="sidebar-button-close-touch" aria-label="Zamknij ekran boczny"
class="delete is-medium is-hidden-touch is-pulled-right close-button mr-2 mt-4"></button>
@ -115,12 +115,11 @@
</div>
<footer class="card-footer">
<div class="has-background-success-light card-footer-item has-text-centered is-size-7 has-text-weight-semibold" id="sidebar-footer-button-left">
<div class="has-background-success-light card-footer-item has-text-centered is-size-7 has-text-weight-semibold p-1" id="sidebar-footer-button-left">
<a href="" target="_blank" rel="noopener"
class="has-background-success-light card-footer-item has-text-centered is-size-7 has-text-weight-semibold"></a>
</div>
</footer>
</div>
</div>

Wyświetl plik

@ -32,7 +32,7 @@
position: absolute;
z-index: 1;
margin: 0.5rem !important;
width: 408px;
width: 425px;
border-radius: 10px;
box-shadow: 0 .5em 1em -0.125em rgba(10, 10, 10, 0.1), 0 0 0 1px rgba(10, 10, 10, 0.02);
max-height: 90vh;
@ -48,7 +48,7 @@
width: 100vw;
display: block !important;
overflow-wrap: break-word;
max-height: 90vh;
max-height: 85vh;
z-index: 10 !important;
overflow: auto !important;
}

Wyświetl plik

@ -173,7 +173,7 @@ function renderSidebarForm() {
<div class="field">
<label class="label has-text-weight-semibold">Rodzaj dostępu</label>
<div class="control">
<div class="select is-success">
<div class="select is-success is-fullwidth">
<select id="${formAccessFieldId}" tag="access">
<option val="">Wybierz z listy</option>
<option val="yes">Publicznie dostępny</option>
@ -187,7 +187,7 @@ function renderSidebarForm() {
<div class="field">
<label class="label has-text-weight-semibold">Czy wewnątrz budynku?</label>
<div class="control">
<div class="select is-success">
<div class="select is-success is-fullwidth">
<select id="${formIndoorFieldId}" tag="location">
<option val="">Wybierz z listy</option>
<option val="outdoor">Na zewnątrz</option>
@ -239,7 +239,7 @@ function renderSidebarForm() {
function renderEditButton(osm_id) {
return `<a href="${getOsmEditLink(osm_id)}" target="_blank" rel="noopener"
class="has-background-success-light card-footer-item has-text-centered is-size-7 has-text-weight-semibold"
class="has-background-success-light card-footer-item is-size-7 has-text-weight-semibold"
>Dodaj brakujące informacje w OSM</a>`;
}
@ -307,7 +307,7 @@ function hideSidebar() {
}
function prepareSidebarShowingObjectInfo(properties) {
sidebarHeader.classList = [];
sidebarHeader.classList = ['p-2'];
sidebarHeader.classList.add(defineColor(properties.access));
sidebarCaption.innerHTML = `defibrylator AED ${defineAccessDescription(properties.access)}`;
@ -317,7 +317,7 @@ function prepareSidebarShowingObjectInfo(properties) {
}
function prepareSidebarAddingNode(properties) {
sidebarHeader.classList = [];
sidebarHeader.classList = ['p-2'];
sidebarHeader.classList.add(defineColor('default'));
sidebarCaption.innerHTML = 'Dodaj defibrylator';