From 03be8f4b788ea50c128bf34cb4ed49b2dc978e1d Mon Sep 17 00:00:00 2001 From: ulrich Date: Tue, 19 Jan 2021 17:51:20 +0000 Subject: [PATCH] Menue-Teile auf das Hauptmenue uebertragen --- web/ui2/stile.css | 333 ++++++++++++++++++++++++++++++++++++++++++++++++++---- 1 files changed, 305 insertions(+), 28 deletions(-) diff --git a/web/ui2/stile.css b/web/ui2/stile.css index 41de60a..5eb5506 100644 --- a/web/ui2/stile.css +++ b/web/ui2/stile.css @@ -4,10 +4,6 @@ */ - - - - /* aus App-Vorlage */ html, body { @@ -23,6 +19,8 @@ flex-flow: column; } .inhalt { + padding: 0; + margin: 0; display: flex; flex-flow: row; height: 100%; /* Anmerkung 2 */ @@ -31,11 +29,14 @@ overflow: hidden; } .nord { - background-color: black; + 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; @@ -47,7 +48,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; @@ -61,25 +62,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; @@ -94,18 +104,43 @@ */ .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 */ + +.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: beige; + background-color: #f2f2f2; padding: 0.2em; font-size: medium; +} + +.breadcrumb a { + text-decoration: none; + color: #0033ff; } .pull-right { @@ -114,18 +149,19 @@ .dialog { position: relative; - /* height: 0.1em; */ transition: all 0.3s ease-in; } .dlg-behaelter { line-height: 1.6; padding: 0.4em; + font-size: 1em; } .dlg-info { - background-color: #dcf2fb; /* blau */ + /* background-color: #f5fbe3; */ padding: 0.4em; + font-size: 0.9em; } /* @@ -146,42 +182,131 @@ 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; } -/* für app-menu */ +/* Stile Code-Editor */ + +/* der div-Behaelter fuer die Textarea */ +.codeeditor-space { + /* + width: 100%; + height: 100%; + border: 1px solid lightgrey; + */ + flex:1 1 auto; + margin-top:0; + height:100%; + position:relative; +} + +/* Textarea fuer CodeMirror */ +/* +.codeeditor { + height: 100%; +} +*/ +/* die Codemirror-Instanz selbst */ +.CodeMirror { + position:absolute; + top:0; + bottom:0; + left:0; + right:0; + height: 100%; +} + +/* Stile MCE-Editor */ + +.mce-editor { + width: 100%; + height: 100%; +} +.text-editor { + width: 100%; + height: 100%; +} + + + + +/* 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 @@ -204,6 +329,7 @@ background-color: transparent; border: 0; margin: 0; + padding: 0 0 0 0.3em; overflow: visible; } @@ -213,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 { @@ -282,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; @@ -326,12 +472,143 @@ /* 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'; } /* '' */ \ No newline at end of file +.icon-doc-text-inv:before { content: '\f15c'; } /* '' */ +.icon-trash:before { content: '\f1f8'; } /* '' */ + +/* von Skeleton */ + +/* Buttons +–––––––––––––––––––––––––––––––––––––––––––––––––– */ +.button, +button, +input[type="submit"], +input[type="reset"], +input[type="button"] { + display: inline-block; + height: 38px; + padding: 0 30px; + color: #555; + text-align: center; + font-size: 11px; + font-weight: 600; + line-height: 38px; + letter-spacing: .1rem; + text-transform: uppercase; + text-decoration: none; + white-space: nowrap; + background-color: transparent; + border-radius: 4px; + border: 1px solid #bbb; + cursor: pointer; + box-sizing: border-box; } +.button:hover, +button:hover, +input[type="submit"]:hover, +input[type="reset"]:hover, +input[type="button"]:hover, +.button:focus, +button:focus, +input[type="submit"]:focus, +input[type="reset"]:focus, +input[type="button"]:focus { + color: #333; + border-color: #888; + outline: 0; } +.button.button-primary, +button.button-primary, +input[type="submit"].button-primary, +input[type="reset"].button-primary, +input[type="button"].button-primary { + color: #FFF; + background-color: #33C3F0; + border-color: #33C3F0; } +.button.button-primary:hover, +button.button-primary:hover, +input[type="submit"].button-primary:hover, +input[type="reset"].button-primary:hover, +input[type="button"].button-primary:hover, +.button.button-primary:focus, +button.button-primary:focus, +input[type="submit"].button-primary:focus, +input[type="reset"].button-primary:focus, +input[type="button"].button-primary:focus { + color: #FFF; + background-color: #1EAEDB; + border-color: #1EAEDB; } + + +/* Forms +–––––––––––––––––––––––––––––––––––––––––––––––––– */ +input[type="email"], +input[type="number"], +input[type="search"], +input[type="text"], +input[type="tel"], +input[type="url"], +input[type="password"], +textarea, +select { + height: 38px; + padding: 6px 10px; /* The 6px vertically centers text on FF, ignored by Webkit */ + background-color: #fff; + border: 1px solid #D1D1D1; + border-radius: 4px; + box-shadow: none; + box-sizing: border-box; } +/* Removes awkward default styles on some inputs for iOS */ +input[type="email"], +input[type="number"], +input[type="search"], +input[type="text"], +input[type="tel"], +input[type="url"], +input[type="password"], +textarea { + -webkit-appearance: none; + -moz-appearance: none; + appearance: none; } +textarea { + min-height: 65px; + padding-top: 6px; + padding-bottom: 6px; } +input[type="email"]:focus, +input[type="number"]:focus, +input[type="search"]:focus, +input[type="text"]:focus, +input[type="tel"]:focus, +input[type="url"]:focus, +input[type="password"]:focus, +textarea:focus, +select:focus { + border: 1px solid #33C3F0; + outline: 0; } +label, +legend { + display: block; + margin-bottom: .5rem; + font-weight: 600; } +fieldset { + padding: 0; + border-width: 0; } +input[type="checkbox"], +input[type="radio"] { + display: inline; } +label > .label-body { + display: inline-block; + margin-left: .5rem; + font-weight: normal; } + -- Gitblit v1.9.3