From 8209533883044451ce7e1742f5a10c4b78679fc3 Mon Sep 17 00:00:00 2001
From: ulrich
Date: Wed, 20 Jan 2021 17:48:21 +0000
Subject: [PATCH] Upload und restliche Menuefunktionen, noch in Arbeit
---
web/ui2/stile.css | 426 +++++++++++++++++++++++++++++++++-------------------
1 files changed, 270 insertions(+), 156 deletions(-)
diff --git a/web/ui2/stile.css b/web/ui2/stile.css
index b2510cf..5eb5506 100644
--- a/web/ui2/stile.css
+++ b/web/ui2/stile.css
@@ -4,6 +4,233 @@
*/
+/* aus App-Vorlage */
+
+html, body {
+ margin: 0;
+ padding: 0;
+ height: 100%; /* Anmerkung 2 */
+ font-size: larger;
+ font-family: 'Roboto Condensed';
+}
+body {
+ min-height: 0; /* Anmerkung 1 */
+ display: flex;
+ flex-flow: column;
+}
+.inhalt {
+ padding: 0;
+ margin: 0;
+ display: flex;
+ flex-flow: row;
+ height: 100%; /* Anmerkung 2 */
+ min-height: 0; /* Anmerkung 1 */
+ background-color: #ededed;
+ overflow: hidden;
+}
+.nord {
+ background-color: #3f3f3f;
+ display: flex;
+ flex-flow: row;
+ height: 2em;
+ align-items: center;
+ margin: 0;
+ padding: 0;
+ justify-content:space-between;
+}
+.sued {
+ height: 1.5em;
+ overflow: hidden;
+ transition: all 0.3s ease-in;
+ background-color: lightgray;
+}
+.west {
+ flex-grow: 0;
+ flex-shrink: 0;
+ flex-basis: 4em;
+ background-color: aliceblue;
+ transition: all 0.3s ease-in;
+ overflow: hidden;
+ white-space: nowrap;
+}
+.ost {
+ flex-grow: 0;
+ flex-shrink: 0;
+ flex-basis: 6em;
+ transition: all 0.3s ease-in;
+ background-color: antiquewhite;
+ overflow: hidden;
+}
+.zentrum-behaelter {
+ padding: 0;
+ margin: 0;
+ display: flex;
+ flex-flow: column;
+ /* background-color: #eaeaea; */
+ background-color: white;
+ width: 100%;
+}
+
+.zentrum {
+ width: 100%;
+ height: 100%;
+ padding: 0;
+ margin: 0;
+ overflow-x: hidden;
+ overflow-y: auto;
+ -webkit-overflow-scrolling: touch;
+}
+
+.zentraler-inhalt {
+ padding: 0;
+ margin: 0;
+ background-color: white;
+}
+
+.zentrum-liste {
+ padding: 0;
+ margin: 0;
+ display: flex;
+ flex-flow: row;
+ flex-wrap: wrap;
+}
+
+/*
+ Anmerkungen:
+ 1.) min.height: 0 fuer body und inhalt ist gegen einen Bug, vgl.
+ http://stackoverflow.com/questions/33859811/understanding-flexbox-and-overflowauto
+ 2.) height 100% fuer html, body und inhalt sorgt dafuer, dass sich alles
+ immer ueber das gesamte Browserfenster ausdehnt.
+*/
+
+.app-titel {
+ margin: 0 0 0 0.6em;
+ padding: 0;
+ color: white;
+ font-size: 1em;
+}
+
+.pointer-cursor {
+ cursor: pointer;
+}
+
+/* file-cms stile */
+
+.top-btn-area {
+ /*margin-left: auto;*/
+ margin: 0 1em 0 2em;
+}
+
+.top-btn {
+ 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; */
+}
+
+.breadcrumb {
+ background-color: #f2f2f2;
+ padding: 0.2em;
+ font-size: medium;
+}
+
+.breadcrumb a {
+ text-decoration: none;
+ color: #0033ff;
+}
+
+.pull-right {
+ float: right;
+}
+
+.dialog {
+ position: relative;
+ transition: all 0.3s ease-in;
+}
+
+.dlg-behaelter {
+ line-height: 1.6;
+ padding: 0.4em;
+ font-size: 1em;
+}
+
+.dlg-info {
+ /* background-color: #f5fbe3; */
+ padding: 0.4em;
+ font-size: 0.9em;
+}
+
+/*
+ Close Button
+
+ <div>
+ <span class="close-btn">✖</span>
+ </div>
+*/
+
+.close-btn {
+ position: absolute;
+ top: 0px;
+ right: 0.4em;
+ margin: 0;
+ padding: 0;
+ font-size: 1.3em;
+ color: #b8b8b8;
+}
+
+.figure {
+ padding: 0.2em;
+ margin: 0.2em;
+}
+
+.datei-figure {
+ width: 2em;
+ cursor: pointer;
+ font-size: 1.6em;
+ text-align: center;
+ /*background-color: blanchedalmond;*/
+}
+
+.figure-caption {
+ font-size: medium;
+ /*background-color: ivory;*/
+ text-align: center;
+}
+
+.datei-zeile {
+ font-size: smaller;
+ cursor: pointer;
+}
+
+.datei-zeile:hover {
+ background-color: #e5e5e5;
+}
+
+.datei-zeile-ueberschrift {
+ font-size: smaller;
+}
+
+.datei-gewaehlt {
+ background-color: lightblue;
+}
+
+.ordner {
+ color: navajowhite;
+}
+
+.datei {
+ color: lightgray;
+}
+
+.datei-gewaehlt {
+ background-color: lightblue;
+}
+
+
/* Stile Code-Editor */
@@ -48,179 +275,38 @@
}
-/* aus App-Vorlage */
-
-html, body {
- margin: 0;
- padding: 0;
- height: 100%; /* Anmerkung 2 */
- font-size: larger;
- font-family: 'Roboto Condensed';
-}
-body {
- min-height: 0; /* Anmerkung 1 */
- display: flex;
- flex-flow: column;
-}
-.inhalt {
- display: flex;
- flex-flow: row;
- height: 100%; /* Anmerkung 2 */
- min-height: 0; /* Anmerkung 1 */
- background-color: #ededed;
- overflow: hidden;
-}
-.nord {
- background-color: black;
- display: flex;
- flex-flow: row;
- height: 2em;
- align-items: center;
-}
-.sued {
- height: 1.5em;
- overflow: hidden;
- transition: all 0.3s ease-in;
- background-color: lightgray;
-}
-.west {
- flex-grow: 0;
- flex-shrink: 0;
- flex-basis: 4em;
- background-color: white;
- transition: all 0.3s ease-in;
- overflow: hidden;
- white-space: nowrap;
-}
-.ost {
- flex-grow: 0;
- flex-shrink: 0;
- flex-basis: 6em;
- transition: all 0.3s ease-in;
- background-color: antiquewhite;
- overflow: hidden;
-}
-.zentrum-behaelter {
- display: flex;
- flex-flow: column;
- /* background-color: #eaeaea; */
- width: 100%;
-}
-
-.zentrum {
- width: 100%;
- height: 100%;
- overflow-x: hidden;
- overflow-y: auto;
- -webkit-overflow-scrolling: touch;
-}
-
-.zentraler-inhalt {
- padding: 0.5em;
-}
-
-.zentrum-liste {
- display: flex;
- flex-flow: row;
- flex-wrap: wrap;
-}
-
-/*
- Anmerkungen:
- 1.) min.height: 0 fuer body und inhalt ist gegen einen Bug, vgl.
- http://stackoverflow.com/questions/33859811/understanding-flexbox-and-overflowauto
- 2.) height 100% fuer html, body und inhalt sorgt dafuer, dass sich alles
- immer ueber das gesamte Browserfenster ausdehnt.
-*/
-
-.app-titel {
- margin-left: 0.6em;
- color: white;
-}
-
-.pointer-cursor {
- cursor: pointer;
-}
-
-.breadcrumb {
- background-color: beige;
- padding: 0.2em;
- font-size: medium;
-}
-
-.pull-right {
- float: right;
-}
-
-.dialog {
- position: relative;
- transition: all 0.3s ease-in;
-}
-
-.dlg-behaelter {
- line-height: 1.6;
- padding: 0.4em;
-}
-
-.dlg-info {
- background-color: #dcf2fb; /* blau */
- padding: 0.4em;
-}
-
-/*
- Close Button
-
- <div>
- <span class="close-btn">✖</span>
- </div>
-*/
-
-.close-btn {
- position: absolute;
- top: 0px;
- right: 0.4em;
- margin: 0;
- padding: 0;
- font-size: 1.3em;
- color: #b8b8b8;
-}
-
-.datei-gewaehlt {
- background-color: lightblue;
-}
/* für app-menu */
-
.app-menu {
margin: 0;
padding: 0;
+ font-size: 0.8em;
}
-
.app-menu-kopf {
text-align: center;
+ font-size: 0.9em;
}
-
ul.app-menu {
list-style: none;
}
-
.app-menu-item-back {
- margin-bottom: 0.3em;
+ margin-bottom: 0.4em;
cursor: pointer;
}
-
.app-menu-item {
text-align: right;
cursor: pointer;
+ margin-bottom: 0.1em;
}
-
+.app-menu-item:hover {
+ background-color: #e5e5e5;
+}
.app-menu-item-submark {
color: transparent;
cursor: pointer;
}
-
/*
Das div-Element, das das Menue aufnimmt erhaelt
die Klasse app-menu-content
@@ -243,6 +329,7 @@
background-color: transparent;
border: 0;
margin: 0;
+ padding: 0 0 0 0.3em;
overflow: visible;
}
@@ -252,15 +339,16 @@
.hamburger-box {
width: 40px;
- height: 24px;
+ height: 24px; /* war 24px */
display: inline-block;
position: relative;
}
.hamburger-inner {
display: block;
- top: 50%;
+ /* top: 50%; */
margin: 0;
+ padding: 0;
}
.hamburger-inner, .hamburger-inner::before, .hamburger-inner::after {
@@ -321,20 +409,39 @@
transition-delay: 0.075s;
}
+/* Fonts */
+
+@font-face {
+ font-family: 'Roboto Condensed';
+ src: url('/lib/fonts/Roboto_Condensed/RobotoCondensed-Regular.ttf') format('truetype');
+ font-weight: normal;
+ font-style: normal;
+}
+
/* Font für Piktogramme mit Fontello aus FontAwesome erzeugt */
@font-face {
font-family: 'pikto';
- src: url('font/pikto.ttf?37040783') format('truetype');
+ src: url('font/pikto.ttf?22834745') format('truetype');
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: 'pikto';
+ src: url('../font/pikto.svg?22834745#pikto') format('svg');
+ }
+}
+*/
[class^="icon-"]:before, [class*=" icon-"]:before {
font-family: "pikto";
font-style: normal;
font-weight: normal;
- speak: none;
+ speak: never;
display: inline-block;
text-decoration: inherit;
@@ -365,15 +472,22 @@
/* 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-cancel:before { content: '\e800'; } /* '' */
+.icon-th-large:before { content: '\e801'; } /* '' */
+.icon-th-list:before { content: '\e802'; } /* '' */
+.icon-folder:before { content: '\e803'; } /* '' */
+.icon-folder-open:before { content: '\e804'; } /* '' */
+.icon-doc:before { content: '\e805'; } /* '' */
+.icon-trash-empty:before { content: '\e806'; } /* '' */
+.icon-pencil:before { content: '\e807'; } /* '' */
+.icon-docs:before { content: '\f0c5'; } /* '' */
+.icon-menu:before { content: '\f0c9'; } /* '' */
.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-trash:before { content: '\f1f8'; } /* '' */
/* von Skeleton */
--
Gitblit v1.9.3