-- Leo's gemini proxy

-- Connecting to git.thebackupbox.net:1965...

-- Connected

-- Sending request

-- Meta line: 20 text/gemini

repo: janusweb
action: commit
revision:
path_from:
revision_from: 1850287b12c79e1d53541612a89cd343d506b55a:
path_to:
revision_to:

git.thebackupbox.net

janusweb

git://git.thebackupbox.net/janusweb

commit 1850287b12c79e1d53541612a89cd343d506b55a
Author: James Baicoianu <james_github@baicoianu.com>
Date:   Wed May 9 12:39:45 2018 -0700

    Various style tweaks

diff --git a/media/assets/webui/themes/default.css b/media/assets/webui/themes/default.css

index 0fb2600f80c0269ebbc4615761e990be2d612cc2..

index ..0eda1f995162c3f376cd6356c8286f5cd179102e 100644

--- a/media/assets/webui/themes/default.css
+++ b/media/assets/webui/themes/default.css
@@ -29,6 +29,10 @@ h2 {
   color: red;
 }

+*[hidden] {
+  display: none !important;
+}
+
 /**************
  * Containers *
  **************/
@@ -65,7 +69,7 @@ ui-checklist>ui-checklistitem:last-of-type {
 }
 ui-list>ui-item[hover],
 ui-checklist>ui-checklistitem[hover] {
-  background-color: rgba(128,128,255,.2);
+  background-color: rgba(128,128,255,.05);
 }
 ui-list>ui-item.state_selected,
 ui-checklist>ui-checklistitem.state_selected {
@@ -84,7 +88,8 @@ ui-list>[selectable] {
 ui-grid {
   margin: 0;
   padding: 0;
-  display: block;
+  display: grid;
+  grid-template-columns: repeat(auto-fill, minmax(10em, 1fr));
 }
 ui-grid[scrollable] {
   overflow-x: auto;
@@ -142,12 +147,13 @@ ui-grid.fivecolumn>ui-item {

 /* <ui-tabs> */
 ui-tabs {
-  display: block;
+  display: flex;
+  flex-direction: column;
   position: relative;
+  flex: 1 1;
 }
 /* <ui-tab> */
 ui-tab {
-  display: block
 }
 ui-tabs>ui-tab {
   display: none;
@@ -164,6 +170,8 @@ ui-tabs>ui-tabbar {
   border-bottom: 1px solid #1c1e22;
   font-size: .8em;
   z-index: -1px;
+  order: -1;
+  white-space: nowrap;
 }
 ui-tabs>ui-tabbar>ui-button {
   min-width: 5em;
@@ -173,17 +181,19 @@ ui-tabs>ui-tabbar>ui-button {
   border-bottom: 1px solid #1c1e22;
   border-radius: .5em .5em 0 0;
   margin-bottom: 0;
+  white-space: nowrap;
+  display: inline-block;
 }
 ui-tabs>ui-tabbar>ui-button[selected],
 ui-tabs>ui-tabbar>ui-button[selected][hover] {
-  background-image: linear-gradient(rgba(128,255,128,.25), rgba(128,255,128,.28) 60%, rgba(128,255,128,.3));
+  background-color: #4cb96f;
   background-repeat: no-repeat;

   border: 1px solid #1c1e22;
   border-bottom-color: transparent;
 }
 ui-tabs>ui-tabbar>ui-button[hover] {
-  background-image: linear-gradient(rgba(128,128,128,.25), rgba(128,128,128,.28) 60%, rgba(128,128,128,.3));
+  background-image: linear-gradient(rgba(128,128,128,1), rgba(128,128,128,1) 60%, rgba(128,128,128,1));
   background-repeat: no-repeat;
   border-color: #1c1e22 #1c1e22 transparent #1c1e22;
 }
@@ -191,23 +201,30 @@ ui-tabs>ui-tabbar>ui-button[disabled] {
   color: #777;
 }
 ui-tabs>ui-tab[selected] {
-  display: block;
+  display: flex;
+  flex: 1 1;
+  flex-direction: column;
 }
 /* <ui-panel> */
-ui-panel {
+ui-panel,
+ui-collapsiblepanel {
   position: absolute;
   z-index: 5;
 }
-ui-panel[top] {
+ui-panel[top],
+ui-collapsiblepanel[top] {
   top: 0;
 }
-ui-panel[bottom] {
+ui-panel[bottom],
+ui-collapsiblepanel[bottom] {
   bottom: 0;
 }
-ui-panel[left] {
+ui-panel[left],
+ui-collapsiblepanel[left] {
   left: 0;
 }
-ui-panel[right] {
+ui-panel[right],
+ui-collapsiblepanel[right] {
   right: 0;
 }

@@ -298,12 +315,16 @@ ui-window>.ui_window_content {
   -moz-box-sizing: border-box;
   position: relative;
 }
+ui-window[scrollable]>ui-window-content {
+  overflow: auto;
+  display: block;
+}
 ui-window[maximized] {
   z-index: 1000;
   border-width: 0;
   border-radius: 0;
 }
-ui-window[maximized]>.ui_window_content {
+ui-window[maximized]>ui-window-content {
   max-width: none;
   max-height: none;
   padding: 0;
@@ -433,6 +454,9 @@ ui-slider:disabled ui-slider-handle {
 }

 /* <ui-toggle> */
+ui-toggle {
+  display: flex;
+}
 ui-toggle>div {
   border: 1px solid black;
   border-radius: .5em;
@@ -447,6 +471,9 @@ ui-toggle>div {
   vertical-align: middle;
   margin: .2em .8em .2em .4em;
 }
+ui-toggle[align="left"]>div {
+  order: -1;
+}
 ui-toggle input {
   display: none;
 }
@@ -504,7 +531,7 @@ ui-toggle[disabled]>div::before {

 /* <ui-checkbox> */
 ui-checkbox {
-  display: inline-block;
+  display: flex;
   white-space: nowrap;
   min-width: 6em;
   cursor: pointer;
@@ -523,6 +550,11 @@ ui-checkbox>input {
   position: relative;
   vertical-align: middle;
   cursor: pointer;
+  margin-right: .5em;
+  height: 1em;
+}
+ui-checkbox[align="left"]>input {
+  order: -1;
 }
 ui-checkbox>input:active, ui-checkbox>input:checked:active {
   box-shadow: 0 1px 2px rgba(0,0,0,0.05), inset 0px 1px 3px rgba(0,0,0,0.1);
@@ -604,6 +636,7 @@ ui-button,
 ui-togglebutton,
 ui-dropdownbutton,
 ui-notificationbutton {
+  display: inline-block;
   border: none;
   border-radius: .5em;
   padding: .25em .5em;
@@ -694,6 +727,7 @@ ui-dropdownbutton:active>ui-button {
 /* <ui-notificationbutton> */
 ui-notificationbutton {
   position: relative;
+  padding: .5em;
 }
 ui-notificationbutton ui-indicator {
   position: absolute;
@@ -756,3 +790,180 @@ ui-buttonlist>ui-button:last-of-type {
   border-right: 1px solid transparent;
 }

+ui-label {
+  cursor: pointer;
+  user-select: none;
+}
+ui-select>select {
+  background: #444;
+  color: white;
+  border: 1px solid #222;
+  box-shadow: 0 0 2px #222;
+}
+ui-select:hover>select {
+  background: #555;
+}
+
+ui-formgroup {
+  position: relative;
+  display: flex;
+  flex-direction: column;
+  margin: .5em 0;
+  width: 100%;
+}
+ui-formgroup>ui-label.groupheader {
+  display: block;
+  order: -1;
+  font-weight: bold;
+  border-bottom: 1px solid #666;
+  width: 100%;
+}
+ui-formgroup>ui-input,
+ui-formgroup>ui-select,
+ui-formgroup>ui-toggle,
+ui-formgroup>ui-slider,
+ui-formgroup>ui-textarea {
+  display: flex;
+  padding: .2em;
+}
+ui-formgroup>ui-input>input,
+ui-formgroup>ui-textarea>textarea,
+ui-formgroup>ui-select>select,
+ui-formgroup>ui-slider>ui-slider-track {
+  flex: 1;
+}
+ui-formgroup ui-label,
+ui-formgroup ui-text {
+  display: inline-block;
+  width: 10em;
+}
+
+/* Column layout */
+ui-columnlayout {
+  display: flex;
+  flex-direction: row;
+  height: 100%;
+}
+ui-columnlayout>* {
+  width: calc(33% - 1px - 1em);
+  border-left: 1px solid #666;
+  margin-left: .5em;
+  padding-left: .5em;
+  flex: 1 1;
+  display: flex;
+  flex-direction: column;
+}
+ui-columnlayout>*:first-child {
+  border-left: 0;
+  margin-left: 0;
+}
+
+/* Collapsible panel */
+ui-collapsiblepanel {
+  display: flex;
+  flex-direction: column;
+  max-width: calc(100% - 2em);
+  max-height: calc(100% - 2em);
+  min-height: .8em;
+  position: relative;
+  border: 1px solid black;
+  background: #333;
+  border-radius: 0;
+  padding: .2em;
+  transition: width 150ms ease-out,height 150ms ease-out,min-height 150ms ease-out;
+  box-shadow: 0 0 8px black;
+}
+ui-collapsiblepanel.default {
+  width: 24em;
+}
+ui-collapsiblepanel>.container {
+  display: flex;
+  width: 100%;
+  overflow: hidden;
+}
+ui-collapsiblepanel>.container>.container-inner {
+  transition: transform 150ms ease-out;
+  transform: translate(0, 0);
+  display: flex;
+  flex: 1 1;
+}
+ui-collapsiblepanel>.container>.container-inner>* {
+  flex: 1 1;
+}
+ui-collapsiblepanel[top],
+ui-collapsiblepanel[bottom] {
+  min-height: 12em
+}
+ui-collapsiblepanel[top] {
+  border-radius: 0 0 .5em 0;
+}
+ui-collapsiblepanel[bottom] {
+  border-radius: 0 .5em 0 0;
+}
+ui-collapsiblepanel[left] {
+  border-radius: 0 0 .5em 0;
+}
+ui-collapsiblepanel[right] {
+  border-radius: 0 0 0 .5em;
+}
+ui-collapsiblepanel[top][collapsed] {
+  height: 0;
+  min-height: 0;
+  padding-top: 0;
+}
+ui-collapsiblepanel[top][collapsed]>.container {
+  transform: translate(0, -100%);
+}
+ui-collapsiblepanel[bottom][collapsed] {
+  height: 0;
+  min-height: 0;
+  padding-bottom: 0;
+}
+ui-collapsiblepanel[left][collapsed] {
+  width: 0;
+  padding-left: 0;
+}
+ui-collapsiblepanel[left][collapsed]>.container {
+  transform: translate(-100%,0);
+}
+ui-collapsiblepanel[right][collapsed] {
+  width: 0;
+  padding-right: 0;
+}
+ui-collapsiblepanel>ui-togglebutton.collapse {
+  position: absolute;
+  transform-origin: bottom left;
+  background: #333;
+  border: 1px solid black;
+  line-height: 1em;
+}
+ui-collapsiblepanel[top]>ui-togglebutton.collapse {
+  bottom: -1.4em;
+  left: -1px;
+  border-radius: 0 0 .5em .5em;
+  border-top: none;
+}
+ui-collapsiblepanel[bottom]>ui-togglebutton.collapse {
+  top: -1.4em;
+  left: -1px;
+  border-radius: .5em .5em 0 0;
+  border-bottom: none;
+}
+ui-collapsiblepanel[left]>ui-togglebutton.collapse {
+  right: -1.4em;
+  top: -1px;
+  border-radius: 0 .5em .5em 0;
+  border-left: none;
+}
+ui-collapsiblepanel[right]>ui-togglebutton.collapse {
+  left: -1.4em;
+  top: -1px;
+  border-radius: .5em 0 0 .5em;
+  border-right: none;
+}
+janus-ui-main {
+  overflow: hidden;
+}
+ui-content[align="right"] {
+  align-content: end;
+}

-----END OF PAGE-----

-- Response ended

-- Page fetched on Sun Jun 2 16:36:29 2024