Dateiverwaltung für die WebBox
ulrich
2021-01-16 ffc2b770a5181d3294813d16f745dfbc709f09df
Stile angepasst
3 files modified
99 ■■■■ changed files
web/ui2/data/menu/datei.json 12 ●●●● patch | view | raw | blame | history
web/ui2/index.html 4 ●●●● patch | view | raw | blame | history
web/ui2/stile.css 83 ●●●● patch | view | raw | blame | history
web/ui2/data/menu/datei.json
@@ -28,14 +28,9 @@
        "funktion": "app.fm_edit_as_text"
      },
      {
        "titel": "Dokument bearbeiten",
        "titel": "Dok. bearbeiten",
        "umenue": false,
        "funktion": "app.fm_edit_as_doc"
      },
      {
        "titel": "Schliessen",
        "umenue": false,
        "funktion": "app.fm_menu_datei_schliessen"
      },
      {
        "titel": "Speichern",
@@ -48,6 +43,11 @@
        "funktion": "app.fm_menu_datei_speichern_unter"
      },
      {
        "titel": "Schliessen",
        "umenue": false,
        "funktion": "app.fm_menu_datei_schliessen"
      },
      {
        "titel": "Nachricht 2",
        "umenue": false,
        "funktion": "app.message_2"
web/ui2/index.html
@@ -13,13 +13,13 @@
    
    <!-- Kopfzeile -->
    <div class="nord">
      <div id="nav-menu">
      <!-- <div id="nav-menu"> -->
        <div id="nav-toggle" class="hamburger hamburger--elastic">
          <div class="hamburger-box">
            <div class="hamburger-inner"></div>
          </div>
        </div>
      </div>
      <!-- </div> -->
      <div class="app-titel">
        <span id="app-titel">Dateiverwaltung</span>
      </div>
web/ui2/stile.css
@@ -63,6 +63,8 @@
  flex-flow: column;
}
.inhalt {
  padding: 0;
  margin: 0;
  display: flex;
  flex-flow: row;
  height: 100%; /* Anmerkung 2 */
@@ -71,11 +73,13 @@
  overflow: hidden;
}
.nord {
  background-color: black;
  background-color: #0f0f0f;
  display: flex;
  flex-flow: row;
  height: 2em;
  align-items: center;
  margin: 0;
  padding: 0;
}
.sued {
  height: 1.5em;
@@ -87,7 +91,7 @@
  flex-grow: 0;
  flex-shrink: 0;
  flex-basis: 4em;
  background-color: white;
  background-color: aliceblue;
  transition: all 0.3s ease-in;
  overflow: hidden;
  white-space: nowrap;
@@ -101,25 +105,34 @@
  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.5em;
  padding: 0;
  margin: 0;
  background-color: white;
}
.zentrum-liste {
  padding: 0;
  margin: 0;
  display: flex;
  flex-flow: row;
  flex-wrap: wrap;
@@ -134,18 +147,27 @@
*/
.app-titel {
  margin-left: 0.6em;
  margin: 0 0 0 0.6em;
  padding: 0;
  color: white;
  font-size: 1em;
}
.pointer-cursor {
  cursor: pointer;
}
/* file-cms stile */
.breadcrumb {
  background-color: beige;
  background-color: #e0e0e0;
  padding: 0.2em;
  font-size: medium;
}
.breadcrumb a {
  text-decoration: none;
  color: #0033ff;
}
.pull-right {
@@ -185,42 +207,71 @@
  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-gewaehlt {
  background-color: lightblue;
}
.ordner {
  color: navajowhite;
}
.datei {
  color: lightgray;
}
.datei-gewaehlt {
  background-color: lightblue;
}
/* für app-menu */
/* für app-menu */
.app-menu {
  margin: 0;
  padding: 0;
  font-size: 0.9em;
}
.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-submark {
  color: transparent;
  cursor: pointer;
}
/*
  Das div-Element, das das Menue aufnimmt erhaelt
  die Klasse app-menu-content
@@ -243,6 +294,7 @@
  background-color: transparent;
  border: 0;
  margin: 0;
  padding: 0 0 0 0.3em;
  overflow: visible;
}
@@ -252,15 +304,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 {