From 67b20c49ec4e5efb4526fc64ef679dfb6dd41e30 Mon Sep 17 00:00:00 2001 From: vincent-peugnet Date: Thu, 4 Oct 2018 05:10:51 +0200 Subject: 2.8 auto-tag-update + help + tabs --- public/css/styleedit.css | 150 ++++++++++++++++++++++++++++++++++++++--------- 1 file changed, 121 insertions(+), 29 deletions(-) (limited to 'public/css/styleedit.css') diff --git a/public/css/styleedit.css b/public/css/styleedit.css index 3a868c3..fe6745f 100644 --- a/public/css/styleedit.css +++ b/public/css/styleedit.css @@ -25,37 +25,25 @@ details { - - - -details#editinfo { - position: fixed; - top: 0; - left: 10%; - width: 40%; -} - -details#editcss { - position: fixed; - top: 0; - left: 50%; - width: 40%; +.sidebar { + position: fixed; + width: 250px; + height: 100%; + overflow: scroll; + overflow-x: hidden; } div#submit { - position: fixed; - top: 0; - width: 10%; + position: relative; } -textarea#html { - width: 100%; +textarea { + position: fixed; + width: calc(100% - 250px); + right: 0px; height: 100%; font-size: 1em; - padding-top: 40px; - padding-bottom: 40px; - font-family: serif; - padding-left: 2%; + padding: 2%; padding-right: calc(50% - 500px); resize: none; @@ -96,19 +84,25 @@ div#roll ul { details label { - display: block; margin-top: 4px; } -textarea#css { - width: 100%; - height: 200px; -} details select, details input, details label, details textarea#css { width: 100%; } +details input[type="checkbox"] +{ + width: auto; +} + +ul { + list-style: none; + padding: 0; + margin: 2px; +} + fieldset { margin: 0; padding: 0; @@ -120,6 +114,104 @@ summary, div#linklist, div#copy, div#submit { } +span#headid { + font-weight: bold; + padding-left: 1%; + padding-right: 1%; + border: ridge; + background-color: var(--color3); + +} + +input#fontsize { + width: 40px; +} + +summary { + background-color: var(--color1); + border: outset; + font-weight: bold; +} + +summary:focus { + outline: none; +} + +div#help { + padding: 2px; +} + +div#help pre { + background-color: white; + margin-bottom: 2px; +} + +div#help p { + background-color: var(--color3); + margin-top: 4px; +} + +div#help h3 {margin-bottom: 8px;} + +span.i { + background-color: var(--color2); + color: white; +} + + + +/* ------------------------------ TABS ----------------------------- */ + + + +.tabs +{ + position: absolute; + left: 250px; + top: 28px; +} + +.tabs .tab +{ + float: left; +} + +.tabs .tab .content +{ + position: absolute; + background-color: white; + left: 0px; + width: 100%; + border: 1px #000 solid; +} + +.checkboxtab +{ + display: none; +} + +.tab label +{ + margin-right: 10px; + border: outset; + background-color: var(--color1); +} + +.checkboxtab:checked ~ label +{ + border: inset; +} + +.checkboxtab:checked ~ .content +{ + z-index: 1; +} + + + + + + @media (max-width: 600px) { details#editinfo, details#editcss, div#copy, div#linklist { -- cgit v1.2.3