Doku ergänzt

ulrich

2018-01-04 e8a09794c48a6496c6d0d0fb14d35d7a8246d299

 app.css

@@ -1,22 +1,78 @@

/* ehem. app-layout anfang */

html, body {
  font-size: 10pt;
  margin: 0;
  padding: 0;
  height: 100%; /* Anmerkung 2 */
  font-size: initial;
  /* font-size: 1.5em; */   /* currently ems cause chrome bug misinterpreting rems on body element */
  line-height: 1.6;
  font-weight: 400;
  /* font-family: "Raleway", "HelveticaNeue", "Helvetica Neue", Helvetica, Arial, sans-serif; */
  font-family: RobotoCondensed;
}

.nord {
body {
  min-height: 0; /* Anmerkung 1 */
  display: flex;
  flex-flow: column;
}
.inhalt {
  display: flex;
  flex-flow: row;
  height: 2em;
  height: 100%; /* Anmerkung 2 */
  min-height: 0; /* Anmerkung 1 */
}

.nord {
  background-color: lightgray;
  display: flex;
  flex-flow: row;
  height: 1.6em;
}
.sued {
  background-color: lightgray;
}
.west {
  flex-grow: 0;
  flex-shrink: 0;
  flex-basis: 10em;
  background-color: antiquewhite;
  transition: all 0.3s ease-in;
  overflow: hidden;
  white-space: nowrap;
  background-color: #f7f7f7;
}
.ost {
  flex-grow: 0;
  flex-shrink: 0;
  flex-basis: 10em;
  background-color: antiquewhite;
}
/*
.zentrum {
  width: 100%;
  height: 100%;
  overflow: auto;
  -webkit-overflow-scrolling: touch;
}
*/
.zentrum {
  display: flex;
  flex-flow: row;
  overflow-x: hidden;
  margin: 0;
}

/*
  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.
*/

/* ehem. app-layout ende */



#app-titel {
  padding-left: 2em;
@@ -26,11 +82,40 @@
  cursor: pointer;
}

.zentrum {
.zentrum-behaelter {
  display: flex;
  flex-flow: row;
  overflow-x: hidden;
  flex-flow: column;
}


/* Dialogfeld */

.dialog {
  background-color: #fffbde;
  position: relative;
}


/*
  Close Button

  <div>
    <span class="close-btn">&#10006;</span>
  </div>
*/

.close-btn {
  position: absolute;
  top: 0px;
  right: 0.4em;
  margin: 0;
  padding: 0;
  font-size: 1.3em;
  color: #b8b8b8;
}

.dlg-info {
  background-color: #dcf2fb;
}

/* Sender */
@@ -46,7 +131,6 @@
  padding: 0.4em;
  flex-wrap: wrap;
  background-color: #eaeaea;
  width: 100%;
}

.sender-kachel {
@@ -67,6 +151,12 @@
  background-color: #ebe6e6;
}

/* Menü-Erscheinung */

.app-menu-kopf {
  font-family: Oswald;
}

/* fonts */

@font-face {