From 10a5439fc50f549701090f15bb1330b0d1ed28a9 Mon Sep 17 00:00:00 2001 From: ulrich@undisclosed <ulrich@ulrich-vaio> Date: Tue, 19 May 2020 13:13:28 +0000 Subject: [PATCH] In Arbeit: Piktogramme, Abmelden, Stile verfeinert --- /dev/null | 0 web/ui2/js/app.js | 2 +- web/font/picto.ttf | 0 web/profil2/index.html | 4 +++- web/ui2/data/tpl/nutzer-rollen-dlg.tpl | 2 +- web/ui2/index.html | 3 ++- web/ui2/stile.css | 42 ++++++++++++++++++++++++++++-------------- 7 files changed, 35 insertions(+), 18 deletions(-) diff --git a/web/font/picto.ttf b/web/font/picto.ttf new file mode 100644 index 0000000..f11661f --- /dev/null +++ b/web/font/picto.ttf Binary files differ diff --git a/web/profil2/index.html b/web/profil2/index.html index 730e7e4..922ee07 100644 --- a/web/profil2/index.html +++ b/web/profil2/index.html @@ -16,7 +16,9 @@ <div class="app-titel"> <span id="app-titel">Nutzerprofil</span> </div> - <div class="top-btn-area"></div> + <div class="top-btn-area"> + <button type="button" title="Abmelden" class="top-btn" id="top-logout-btn"><i class="icon-off"></i></button> + </div> </div> <div class="inhalt"> <!-- westliche Seitenleiste --> diff --git a/web/ui2/data/tpl/nutzer-rollen-dlg.tpl b/web/ui2/data/tpl/nutzer-rollen-dlg.tpl index 5d95cdf..6888f8e 100644 --- a/web/ui2/data/tpl/nutzer-rollen-dlg.tpl +++ b/web/ui2/data/tpl/nutzer-rollen-dlg.tpl @@ -3,7 +3,7 @@ Rollen von <span id="nutzer-id"></span> </p> - <button type="button" class="del-user-btn danger-btn" id="del-user-btn">Löschen</button> + <button type="button" title="Nutzer löschen" class="del-user-btn danger-btn" id="del-user-btn"><i class="icon-user-times"></i></button> </div> <div class="rollen-behaelter"> {{#List}} diff --git a/web/ui2/font/pikto.ttf b/web/ui2/font/pikto.ttf deleted file mode 100644 index 175b3f4..0000000 --- a/web/ui2/font/pikto.ttf +++ /dev/null Binary files differ diff --git a/web/ui2/index.html b/web/ui2/index.html index 242fada..427fa84 100644 --- a/web/ui2/index.html +++ b/web/ui2/index.html @@ -17,7 +17,8 @@ <span id="app-titel">Nutzerverwaltung</span> </div> <div class="top-btn-area"> - <button type="button" title="Neuer Benutzer" class="top-btn" id="top-neu-btn">+</button> + <button type="button" title="Neuer Benutzer" class="top-btn" id="top-neu-btn"><i class="icon-user-plus"></i></button> + <button type="button" title="Abmelden" class="top-btn" id="top-logout-btn"><i class="icon-off"></i></button> </div> </div> <div class="inhalt"> diff --git a/web/ui2/js/app.js b/web/ui2/js/app.js index a817006..76b09c1 100644 --- a/web/ui2/js/app.js +++ b/web/ui2/js/app.js @@ -239,7 +239,7 @@ vurl, inhalt, function (html) { - dlg.style.flexBasis = '14em'; + dlg.style.flexBasis = '18em'; setTimeout(function () { dlg.innerHTML = html; document.querySelector('.close-btn').addEventListener( diff --git a/web/ui2/stile.css b/web/ui2/stile.css index de58c20..6c6c3b2 100644 --- a/web/ui2/stile.css +++ b/web/ui2/stile.css @@ -113,15 +113,18 @@ .top-btn-area { /*margin-left: auto;*/ + margin: 0 1em 0 0; } .top-btn { - margin: 0 1em 0 1em; + margin: 0; + padding: 0 0.2em 0 0.2em; height: 28px; line-height: 24px; text-align: center; font-size: large; background-color: white; + /* width: 1em; */ } .del-user-btn { @@ -130,6 +133,7 @@ height: 32px; line-height: 12px; text-align: center; + font-size: medium; } .danger-btn { @@ -294,14 +298,29 @@ /* Font für Piktogramme mit Fontello aus FontAwesome erzeugt */ @font-face { - font-family: 'pikto'; - src: url('font/pikto.ttf?37040783') format('truetype'); + font-family: 'picto'; + src: url('../font/picto.eot?52325148'); + src: url('../font/picto.eot?52325148#iefix') format('embedded-opentype'), + url('../font/picto.woff2?52325148') format('woff2'), + url('../font/picto.woff?52325148') format('woff'), + url('../font/picto.ttf?52325148') format('truetype'), + url('../font/picto.svg?52325148#picto') format('svg'); font-weight: normal; font-style: normal; } +/* Chrome hack: SVG is rendered more smooth in Windozze. 100% magic, uncomment if you need it. */ +/* Note, that will break hinting! In other OS-es font will be not as sharp as it could be */ +/* +@media screen and (-webkit-min-device-pixel-ratio:0) { + @font-face { + font-family: 'picto'; + src: url('../font/picto.svg?52325148#picto') format('svg'); + } +} +*/ [class^="icon-"]:before, [class*=" icon-"]:before { - font-family: "pikto"; + font-family: "picto"; font-style: normal; font-weight: normal; speak: none; @@ -335,16 +354,11 @@ /* text-shadow: 1px 1px 1px rgba(127, 127, 127, 0.3); */ } -.icon-folder:before { content: '\e800'; } /* '' */ -.icon-folder-open:before { content: '\e801'; } /* '' */ -.icon-th-large:before { content: '\e802'; } /* '' */ -.icon-th-list:before { content: '\e803'; } /* '' */ -.icon-doc-text:before { content: '\f0f6'; } /* '' */ -.icon-folder-empty:before { content: '\f114'; } /* '' */ -.icon-folder-open-empty:before { content: '\f115'; } /* '' */ -.icon-doc-inv:before { content: '\f15b'; } /* '' */ -.icon-doc-text-inv:before { content: '\f15c'; } /* '' */ - +.icon-user:before { content: '\e800'; } /* '' */ +.icon-cog:before { content: '\e801'; } /* '' */ +.icon-off:before { content: '\e802'; } /* '' */ +.icon-user-plus:before { content: '\f234'; } /* '' */ +.icon-user-times:before { content: '\f235'; } /* '' */ /* von Skeleton */ -- Gitblit v1.9.3