baculum: Resize windows on double click event

[bacula/bacula] / gui / baculum / themes / Baculum-v1 / style.css

diff --git a/gui/baculum/themes/Baculum-v1/style.css b/gui/baculum/themes/Baculum-v1/style.css
index 23052985a42dd683dd1052f40ccdc45e586348aa..e26a85866359a4f2cec4026aa40cda2103251434 100644 (file)
--- a/gui/baculum/themes/Baculum-v1/style.css
+++ b/gui/baculum/themes/Baculum-v1/style.css
@@ -26,7 +26,8 @@ input[type=text], input[type=password], select, textarea {
 }
 
 input[type=checkbox] {
-               margin: 6px;
+               height: 16px;
+               width: 16px;
 }
 
 input.textbox, select.textbox {
@@ -44,7 +45,6 @@ input.textbox-short, select.textbox-short {
 }
 
 input.textbox-auto, select.textbox-auto, textarea.textbox-auto {
-       width: 100%;
        border: 1px solid black;
        font-size: 14px;
        display: table-cell;
@@ -52,7 +52,7 @@ input.textbox-auto, select.textbox-auto, textarea.textbox-auto {
 
 textarea.textbox-auto {
        resize: vertical;
-       width: 406px;
+       width: 100%;
        font-size: 11px;
 }
 
@@ -68,14 +68,23 @@ a:hover {
 }
 #container {
        margin: 0 auto;
-       width: 975px;
+       min-width: 975px;
+       max-width: 100%;
+       border-right: 1px solid black;
+       background-color: #585758;
 }
 
 #top {
-       width: 975px;
+       margin: 0 auto;
+       min-width: 975px;
+       max-width: 100%;
        height: 51px;
        background-image: url('bls_top.png');
-       background-repeat: no-repeat;
+       background-repeat: repeat-x;
+       border-left: 1px solid black;
+       border-right: 1px solid black;
+       border-top-left-radius: 7px;
+       border-top-right-radius: 7px;
        clear: both;
 }
 
@@ -85,24 +94,26 @@ a:hover {
 }
 
 #menu-left {
-       float: left;
+       position: absolute;
        width: 74px;
-       /*height: 498px;*/
        height: 600px;
        background-color: #546e83;
        border-left: 1px solid black;
+       z-index: 200;
+       /* Workaround for FF and switch Graphs and Workspace areas */
+       bottom: auto !important;
 }
 
 #content {
-       float: left;
-       width: 899px;
-       /*height: 498px;*/
+       position: relative;
+       top: 0;
+       left: 75px;
+       width: 100%;
        height: 600px;
-       background-color: #585758;
-       border-right: 1px solid black;
+       z-index: 100;
 }
 
-#directors {
+#directors, #panel_switcher, #tray_bar {
        float: right;
        font-size: 12px;
 }
@@ -113,15 +124,30 @@ a:hover {
        font-size: 12px
 }
 
+#panel_switcher {
+       margin: 17px 20px 0 0;
+       font-weight: bold;
+}
+
+#tray_bar {
+       margin: 2px 30px 2px 0;
+}
+
+#tray_bar img {
+       float: none;
+       margin: 0;
+       padding: auto 12px;
+}
+
+#tray_bar span{
+       font-size: 14px;
+}
+
 div.configuration {
-       width: 443px;
-       /*height: 473px;*/
+       width: 45%;
        height: 575px;
-       margin: 12px 0;
-       z-index: 5;
-       position: relative;
-       left: 446px;
-       top: 0px;
+       margin: 12px;
+       float: right;
        background-color: #898889;
        -webkit-border-radius: 10px;
        -moz-border-radius: 10px;
@@ -131,6 +157,7 @@ div.configuration {
 
 #configuration {
        position: absolute;
+       width: 100%;
 }
 
 #configuration div.field select {
@@ -143,12 +170,12 @@ div.configuration {
 
 div.configuration-progress {
        background: rgba(182,182,182,0.7) url('progress.gif') no-repeat center center;
-       width: 443px;
+       width: 45%;
        height: 575px;
        z-index: 10;
        position: absolute;
        top: 12px;
-       left: 446px;
+       right: 12px;
        display: none;
        border-radius: 10px;
 }
@@ -166,8 +193,10 @@ div.slide-window-progress {
 
 #console {
        clear: left;
-       width: 973px;
+       min-width: 973px;
+       max-width: 100%;
        min-height: 20px;
+       margin: 0 auto;
        padding: 5px 0;
        text-align: right;
        background-color: #686a6c;
@@ -200,9 +229,15 @@ div.slide-window-progress {
 }
 
 #bottom {
-       width: 975px;
+       max-width: 100%;
+       min-width: 975px;
        height: 11px;
-       background: transparent url('bls_bottom.png') no-repeat top left;
+       margin: 0 auto;
+       background: transparent url('bls_bottom.png') repeat-x top left;
+       border-left: 1px solid black;
+       border-right: 1px solid black;
+       border-bottom-left-radius: 7px;
+       border-bottom-right-radius: 7px;
 }
 
 #message-box {
@@ -323,6 +358,7 @@ div.slide-window-progress {
 .field-full {
        display: block;
        min-height: 200px;
+       width: 98%;
 }
 
 .validator, .validate {
@@ -335,44 +371,33 @@ div.slide-window-progress {
        color: #96c600 !important;
 }
 
-.bbutton input.button-left, .bbutton input.button-center, .bbutton input.button-right {
+input.bbutton {
        font-size: 12px;
-       height: 25px;
-       color: black;
+       vertical-align: baseline;
+       -webkit-appearance: none;
+       text-shadow: 0 1px 1px #7b2121;
+       font-family: "times, serif";
+       font-weight: 600;
+       color: white;
+       height: 28px;
+       line-height: 26px;
        cursor: pointer;
-       padding: 0;
-       margin: 0;
-       border: 0;
-}
-
-.bbutton input.button-left, .bbutton input.button-right {
-       width: 2px;
-}
-
-.bbutton input.button-left {
-       background: transparent url('button-left.png') no-repeat left 0;
-}
-
-.bbutton input.button-center {
-       padding: 0 7px;
+       display: inline-block;
+       width: auto;
+       margin: 0 8px;
+       padding: 0 18px;
        min-width: 65px;
-       background: transparent url('button-center.png') repeat-x left 0;
-}
-
-.bbutton input.button-right {
-       background: transparent url('button-right.png') no-repeat left 0;
-}
-
-.bbutton:hover input.button-left {
-       background: transparent url('button-left.png') no-repeat left -25px;
-}
-
-.bbutton:hover input.button-center {
-       background: transparent url('button-center.png') repeat-x left -25px;
+       border-radius: 4px;
+       border: 1px solid #8f2626;
+       background: #ca3838;
+       background-image: linear-gradient(#df8989, #d03232);
 }
 
-.bbutton:hover input.button-right {
-       background: transparent url('button-right.png') no-repeat left -25px;
+input.bbutton:hover {
+       padding: 0 18px;
+       box-shadow: inset 0 0 3px #faeded;
+       background: #ff7474;
+       border: 1px solid #8f2626;
 }
 
 div.slide-window-container {
@@ -395,7 +420,7 @@ div.slide-window-content {
 
 div.slide-window-element, div.slide-window-element:hover {
        float: left;
-       width: 210px;
+       width: 224px;
        color: white;
 }
 
@@ -405,7 +430,7 @@ div.slide-window-element:hover {
 
 div.slide-window-element:hover, div.slide-window-element-detail:hover {
        float: left;
-       width: 210px;
+       width: 224px;
        background-color: #686A6C;
        cursor: pointer;
 }
@@ -420,6 +445,7 @@ tr.slide-window-element-alternating {
 
 tr.slide-window-element td, tr.slide-window-element-alternating td {
        font-style: italic;
+       word-break: break-all;
 }
 tr.slide-window-element:hover, tr.slide-window-element-alternating:hover {
        float: none;
@@ -433,7 +459,7 @@ tr.slide-window-element:hover td, tr.slide-window-element-alternating:hover td{
 table.window-section-detail, table.file-browser-detail {
        background-color: rgba(0,0,0,0.5);
        width: 100%;
-       font-size: 11px;
+       font-size: 10px;
        font-weight: normal;
 }
 
@@ -495,6 +521,12 @@ div.slide-window-bar-title {
        height: 14px;
        margin-right: 51px;
        padding: 0;
+       -webkit-touch-callout: none;
+       -webkit-user-select: none;
+       -khtml-user-select: none;
+       -moz-user-select: none;
+       -ms-user-select: none;
+       user-select: none;
 }
 
 div.slide-window-close, div.slide-window-fullsize, div.slide-window-sort {
@@ -518,7 +550,7 @@ div.slide-window-sort {
        right: 14px;
 }
 
-div.slide-window-toolbar {
+div.slide-window-toolbar, div.slide-window-actions {
        height: 90px;
        width: 240px;
        z-index: 25;
@@ -551,16 +583,43 @@ div.slide-window-toolbar table select,div.slide-window-toolbar table input {
 div.slide-window-toolbar table input[type="text"] {
        width: 123px;
 }
+div.slide-window-actions {
+       width: 220px;
+       height: 110px;
+}
+
+div.slide-window-actions table {
+       width: 100%;
+       font-size: 12px;
+       padding: 10px;
+}
 
 div.configuration-window-content {
-       padding: 10px 12px;;
+       padding: 10px 12px;
+       width: 96%;
 }
 
+div.slide-window-options {
+       height: 36px;
+       width: 36px;
+       z-index: 20;
+       position: absolute;
+       margin: 0;
+       padding: 0;
+       bottom: 0;
+       right: 0;
+       border: 0;
+       background: transparent url('gear-icon-alpha.png') no-repeat left 0;
+}
 
+div.slide-window-options:hover {
+       cursor: pointer;
+       background: transparent url('gear-icon.png') no-repeat left 0;
+}
 div.status-bar-append, div.status-bar-full, div.status-bar-used, div.status-bar-error, div.status-bar-purged, div.status-bar-recycle, div.status-bar-busy, div.status-bar-disabled, div.status-bar-archive, div.status-bar-cleaning, div.status-bar-read-only, div.status-bar-detail-append, div.status-bar-detail-full, div.status-bar-detail-used, div.status-bar-detail-error, div.status-bar-detail-purged, div.status-bar-detail-recycle, div.status-bar-detail-busy, div.status-bar-detail-disabled, div.status-bar-detail-archive, div.status-bar-detail-cleaning, div.status-bar-detail-read-only {
        position: relative;
        border: 1px solid black;
-       width: 40px;
+       min-width: 40px;
        height: 20px;
        line-height: 20px;
        float: right;
@@ -658,7 +717,7 @@ div.job-status-W {
 }
 
 div.job-status-D {
-       background-color: blue;
+       background-color: #CB4A2C;
 }
 
 /*
@@ -709,7 +768,7 @@ span.validation-error-summary {
 }
 
 textarea.console {
-       width: 952px;
+       width: 98%;
        height: 200px;
        display: block;
        margin: 5px auto;
@@ -720,10 +779,18 @@ textarea.console {
        font-weight: bold;
 }
 
+.italic {
+       font-style: italic;
+}
+
 .center {
        text-align: center;
 }
 
+.right {
+       text-align: right;
+}
+
 #console_launcher, #volumes_tools_launcher, #logging, #clear_bvfs_cache {
        padding: 0 5px;
 }
@@ -763,8 +830,8 @@ legend {
 }
 
 img {
-               vertical-align: middle;
-               border: none;
+       vertical-align: middle;
+       border: none;
 }
 
 div.small {
@@ -779,3 +846,52 @@ div.small {
        border-top: 1px solid black;
        margin: 3px 0;
 }
+
+#graphs {
+       height: 600px;
+       min-width: 954px;
+       max-width: 100%;
+       padding: 10px;
+       margin: 0 auto;
+       font-size: 11px;
+       background-color: #585758;
+       border-right: 1px solid black;
+}
+
+#graphs span {
+       margin: 0 3px;
+}
+
+#legend {
+       border: 1px solid white;
+       margin: 7px;
+       padding: 8px;
+}
+
+#legend table td {
+       color: white;
+}
+
+#graphs_content {
+       margin: 0 auto;
+       width: 98%;
+       height: 425px;
+}
+
+/* Overwrite date picker classes */
+.TDatePicker_default {
+       z-index: 20;
+}
+.TDatePicker_default .date {
+       color: blue;
+}
+.TDatePicker_default .selected {
+       color: white;
+}
+
+th.weekDayHead {
+       color: black;
+       border: 1px solid #919EA9;
+}
+
+/* END - Overwrite date picker classes */