Dialoge vereinheitlicht

ulrich

2018-01-05 dc04495e7b7aa8b41edb3fce1d85c14bd5a4af2d

Dialoge vereinheitlicht

 app.css

@@ -91,10 +91,30 @@
/* Dialogfeld */

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

.dlg-behaelter {
  padding: 0.4em;
}

.dlg-info {
  background-color: #dcf2fb; // blau
  padding: 0.4em;
}

.nachricht {
  background-color: #fffbde; // gelb
}

.form-button-footer {
  text-align: right;
}

.dlg-sender-edit {
  /* background-color: #f6f6f6; // grau */
  background-color: #dcf2fb; // blau
}

/*
  Close Button
@@ -112,10 +132,6 @@
  padding: 0;
  font-size: 1.3em;
  color: #b8b8b8;
}

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

/* Sender */

 data/tpl/dlg-info.tpl

@@ -1,6 +1,8 @@
<div class="dlg-info">
  <span class="close-btn pointer-cursor">&#10006;</span>
  <div class="dlg-info-app-titel">radio-ui</div>
  <div class="dlg-info-app-info">Eine Bedienoberfläche für Webradio von <a href='https://uhilger.de'>Ulrich Hilger</a>.</div>
  <div class="dlg-info-app-info">Weitere Infos im <a href='https://uhilger.de/gitblit/docs/web!radio-ui.git'>Code-Repository</a>.</div>
  <div class="dlg-behaelter">
    <div class="dlg-info-app-titel">radio-ui</div>
    <div class="dlg-info-app-info">Eine Bedienoberfläche für Webradio von <a href='https://uhilger.de'>Ulrich Hilger</a>.</div>
    <div class="dlg-info-app-info">Weitere Infos im <a href='https://uhilger.de/gitblit/docs/web!radio-ui.git'>Code-Repository</a>.</div>
  </div>
</div>

 data/tpl/dlg-msg.tpl

@@ -1,4 +1,6 @@
<div class="{{typ}}">
  <span class="close-btn pointer-cursor">&#10006;</span>
  {{text}}
  <div class="dlg-behaelter">
    {{text}}
  </div>
</div>

 data/tpl/dlg-sender-edit.tpl

@@ -1,10 +1,14 @@
<div class="dlg-sender-edit">
  <span class="close-btn pointer-cursor">&#10006;</span>
  <div class="sender-form">
  <div class="dlg-behaelter">
    <div class="dlg-sender-titel">Neuer Sender</div>
    <form>
      <input id="sender-name" placeholder="Name" type="text" class="sender-eingabe"></br>
      <input id="sender-logo" placeholder="Logo" type="text" class="sender-eingabe"></br>
      <input id="sender-url" placeholder="URL" type="text" class="sender-eingabe">
      <input id="sender-url" placeholder="URL" type="text" class="sender-eingabe"></br>
      <div class="form-button-footer">
        <button type="button" id="berechnen">Speichern</button>
      </div>
    </form>
  </div>
</div>