Bedienoberfläche für Webradio
ulrich
2018-02-22 9af04242b4fb3bcbc52cad2992222ace5b4ea6cf
Anpassungen am Stylesheet
1 files modified
255 ■■■■ changed files
app.css 255 ●●●● patch | view | raw | blame | history
app.css
@@ -88,6 +88,135 @@
  padding-left: 0.5em;
}
.zentrum-behaelter {
  display: flex;
  flex-flow: column;
  background-color: #eaeaea;
  width: 100%;
}
.inline-label {
  display: inline-block;
  width: 4em;
  text-align: right;
}
/* Dialogfeld */
.dialog {
  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, .dlg-sender-neu, .dlg-abspieler-neu {
  background-color: #f6f6f6; // grau
}
.sender-eingabe, .abspieler-eingabe {
  width: 80%;
  margin-left: 0.4em;
}
/*
  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;
}
/* Abspieler */
.abspieler-behaelter {
  display: flex;
  flex-flow: row;
  padding: 0.6em;
}
.abspieler-lb {
  width: 4.5em;
  padding-right: 0.2em;
}
.abspieler-auswahl, .abspieler-form-auswahl {
  width: 70%;
  margin-left: 0.4em;
}
#abspielen-stoppen {
  margin-left: 0.4em;
  width: 2em;
  font-size: 0.8em;
  padding: 0 0 0 0.3em;
}
/* Sender */
.sender-behaelter {
  display: flex;
  flex-flow: column;
}
.sender {
  display: flex;
  flex-flow: row;
  padding: 0.4em;
  flex-wrap: wrap;
  background-color: #eaeaea;
}
.sender-kachel {
  display: flex;
  flex-flow: column;
  align-items: center;
  margin: 0.4em;
  padding: 0.4em;
  background-color: white;
  cursor: pointer;
}
.sender-name {
  font-family: RobotoCondensedBold;
}
.sender-bild {
  width: 5em;
  background-color: #ebe6e6;
}
/* Menü-Erscheinung */
.app-menu-kopf {
  font-family: Oswald;
}
/* aus Skeleton (leicht angepasst) */
/* Forms
@@ -215,132 +344,6 @@
  border-color: #1EAEDB; }
/* Ende Skeleton */
.zentrum-behaelter {
  display: flex;
  flex-flow: column;
}
.inline-label {
  display: inline-block;
  width: 4em;
  text-align: right;
}
/* Dialogfeld */
.dialog {
  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, .dlg-sender-neu, .dlg-abspieler-neu {
  background-color: #f6f6f6; // grau
}
.sender-eingabe, .abspieler-eingabe {
  width: 80%;
  margin-left: 0.4em;
}
/*
  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;
}
/* Abspieler */
.abspieler-behaelter {
  display: flex;
  flex-flow: row;
  padding: 0.6em;
}
.abspieler-lb {
  width: 4.5em;
  padding-right: 0.2em;
}
.abspieler-auswahl, .abspieler-form-auswahl {
  width: 70%;
  margin-left: 0.4em;
}
#abspielen-stoppen {
  margin-left: 0.4em;
  width: 2em;
  font-size: 0.8em;
  padding: 0 0 0 0.3em;
}
/* Sender */
.sender-behaelter {
  display: flex;
  flex-flow: column;
}
.sender {
  display: flex;
  flex-flow: row;
  padding: 0.4em;
  flex-wrap: wrap;
  background-color: #eaeaea;
}
.sender-kachel {
  display: flex;
  flex-flow: column;
  align-items: center;
  margin: 0.4em;
  padding: 0.4em;
  background-color: white;
  cursor: pointer;
}
.sender-name {
  font-family: RobotoCondensedBold;
}
.sender-bild {
  width: 5em;
  background-color: #ebe6e6;
}
/* Menü-Erscheinung */
.app-menu-kopf {
  font-family: Oswald;
}
/* fonts */