From 2afd54309f37085a01d2ebe79293dcdb018f0cf4 Mon Sep 17 00:00:00 2001 From: Joseph Livecchi Date: Thu, 27 Feb 2014 16:06:03 -0500 Subject: [PATCH] Finished restyling UI Close #47 Started on #12 --- web/css/BlenderController.css | 62 +++++++++++++------------- web/css/BlenderController.min.css | 16 +++---- web/css/style.css | 13 +++--- web/index.temp | 72 ++++++++++++++++++------------- 4 files changed, 87 insertions(+), 76 deletions(-) diff --git a/web/css/BlenderController.css b/web/css/BlenderController.css index e9444f0..0f68fd3 100644 --- a/web/css/BlenderController.css +++ b/web/css/BlenderController.css @@ -24,7 +24,7 @@ button, .ui-btn { font-size: 1em; line-height: 1.3; - font-family: sans-serif /*{global-font-family}*/; + font-family: sans-serif /*{global-font-family}*/; } legend, .ui-input-text input, @@ -124,14 +124,14 @@ label.ui-btn { /* Shadow -----------------------------------------------------------------------------------------------------------*/ .ui-shadow { - -webkit-box-shadow: 0 1px 5px /*{global-box-shadow-size}*/ rgba(255,255,255,0.5) /*{global-box-shadow-color}*/; - -moz-box-shadow: 0 1px 5px /*{global-box-shadow-size}*/ rgba(255,255,255,0.5) /*{global-box-shadow-color}*/; - box-shadow: 0 1px 5px /*{global-box-shadow-size}*/ rgba(255,255,255,0.5) /*{global-box-shadow-color}*/; + -webkit-box-shadow: 0 1px 2px /*{global-box-shadow-size}*/ rgba(255,255,255,0.5) /*{global-box-shadow-color}*/; + -moz-box-shadow: 0 1px 2px /*{global-box-shadow-size}*/ rgba(255,255,255,0.5) /*{global-box-shadow-color}*/; + box-shadow: 0 1px 2px /*{global-box-shadow-size}*/ rgba(255,255,255,0.5) /*{global-box-shadow-color}*/; } .ui-shadow-inset { - -webkit-box-shadow: inset 0 1px 5px /*{global-box-shadow-size}*/ rgba(255,255,255,0.5) /*{global-box-shadow-color}*/; - -moz-box-shadow: inset 0 1px 5px /*{global-box-shadow-size}*/ rgba(255,255,255,0.5) /*{global-box-shadow-color}*/; - box-shadow: inset 0 1px 5px /*{global-box-shadow-size}*/ rgba(255,255,255,0.5) /*{global-box-shadow-color}*/; + -webkit-box-shadow: inset 0 1px 2px /*{global-box-shadow-size}*/ rgba(255,255,255,0.5) /*{global-box-shadow-color}*/; + -moz-box-shadow: inset 0 1px 2px /*{global-box-shadow-size}*/ rgba(255,255,255,0.5) /*{global-box-shadow-color}*/; + box-shadow: inset 0 1px 2px /*{global-box-shadow-size}*/ rgba(255,255,255,0.5) /*{global-box-shadow-color}*/; } .ui-overlay-shadow { -webkit-box-shadow: 0 0 12px rgba(0,0,0,.6); @@ -220,10 +220,10 @@ html .ui-alt-icon .ui-radio-off:after { html .ui-bar-a .ui-bar-inherit, html .ui-body-a .ui-bar-inherit, html body .ui-group-theme-a .ui-bar-inherit { - background: #e28755 /*{a-bar-background-color}*/; + background: #CDBFAC /*{a-bar-background-color}*/; border-color: #f95806 /*{a-bar-border}*/; - color: #9e2200 /*{a-bar-color}*/; - text-shadow: 1px /*{a-bar-shadow-x}*/ 1px /*{a-bar-shadow-y}*/ 1px /*{a-bar-shadow-radius}*/ #ffd8b3 /*{a-bar-shadow-color}*/; + color: #FF6600 /*{a-bar-color}*/; + text-shadow: 0px /*{a-bar-shadow-x}*/ 0px /*{a-bar-shadow-y}*/ 5px /*{a-bar-shadow-radius}*/ #F5EDE3 /*{a-bar-shadow-color}*/; font-weight: bold; } .ui-bar-a { @@ -234,8 +234,8 @@ html body .ui-group-theme-a .ui-bar-inherit { .ui-overlay-a, .ui-page-theme-a, .ui-page-theme-a .ui-panel-wrapper { - background: #ffffff /*{a-page-background-color}*/; - border-color: #bbbbbb /*{a-page-border}*/; + background: #F5EDE3 /*{a-page-background-color}*/; + border-color: #ff6600 /*{a-page-border}*/; color: #333333 /*{a-page-color}*/; text-shadow: 0 /*{a-page-shadow-x}*/ 0 /*{a-page-shadow-y}*/ 0 /*{a-page-shadow-radius}*/ #000000 /*{a-page-shadow-color}*/; } @@ -247,7 +247,7 @@ html .ui-body-a .ui-body-inherit, html body .ui-group-theme-a .ui-body-inherit, html .ui-panel-page-container-a { background: #ffffff /*{a-body-background-color}*/; - border-color: #949494 /*{a-body-border}*/; + border-color: #154890 /*{a-body-border}*/; color: #333333 /*{a-body-color}*/; text-shadow: 0 /*{a-body-shadow-x}*/ 2px /*{a-body-shadow-y}*/ 0 /*{a-body-shadow-radius}*/ #f3f3f3 /*{a-body-shadow-color}*/; } @@ -260,7 +260,7 @@ html .ui-panel-page-container-a { html .ui-bar-a a, html .ui-body-a a, html body .ui-group-theme-a a { - color: #3388cc /*{a-link-color}*/; + color: #6699ff /*{a-link-color}*/; font-weight: bold; } .ui-page-theme-a a:visited, @@ -293,8 +293,8 @@ html .ui-bar-a .ui-btn:visited, html .ui-body-a .ui-btn:visited, html body .ui-group-theme-a .ui-btn:visited, html head + body .ui-btn.ui-btn-a:visited { - background: #f6f6f6 /*{a-bup-background-color}*/; - border-color: #f95806 /*{a-bup-border}*/; + background: #E1D4C0 /*{a-bup-background-color}*/; + border-color: #154890 /*{a-bup-border}*/; color: #333333 /*{a-bup-color}*/; text-shadow: 0 /*{a-bup-shadow-x}*/ 2px /*{a-bup-shadow-y}*/ 0 /*{a-bup-shadow-radius}*/ #f3f3f3 /*{a-bup-shadow-color}*/; } @@ -304,8 +304,8 @@ html .ui-bar-a .ui-btn:hover, html .ui-body-a .ui-btn:hover, html body .ui-group-theme-a .ui-btn:hover, html head + body .ui-btn.ui-btn-a:hover { - background: #ededed /*{a-bhover-background-color}*/; - border-color: #f95806 /*{a-bhover-border}*/; + background: #CDBFAC /*{a-bhover-background-color}*/; + border-color: #154890 /*{a-bhover-border}*/; color: #333333 /*{a-bhover-color}*/; text-shadow: 0 /*{a-bhover-shadow-x}*/ 2px /*{a-bhover-shadow-y}*/ 0 /*{a-bhover-shadow-radius}*/ #f3f3f3 /*{a-bhover-shadow-color}*/; } @@ -315,8 +315,8 @@ html .ui-bar-a .ui-btn:active, html .ui-body-a .ui-btn:active, html body .ui-group-theme-a .ui-btn:active, html head + body .ui-btn.ui-btn-a:active { - background: #e28755 /*{a-bdown-background-color}*/; - border-color: #dddddd /*{a-bdown-border}*/; + background: #6699FF /*{a-bdown-background-color}*/; + border-color: #154890 /*{a-bdown-border}*/; color: #333333 /*{a-bdown-color}*/; text-shadow: 0 /*{a-bdown-shadow-x}*/ 2px /*{a-bdown-shadow-y}*/ 0 /*{a-bdown-shadow-radius}*/ #f3f3f3 /*{a-bdown-shadow-color}*/; } @@ -344,10 +344,10 @@ html .ui-bar-a .ui-slider-track .ui-btn-active, html .ui-body-a .ui-slider-track .ui-btn-active, html body .ui-group-theme-a .ui-slider-track .ui-btn-active, html body div.ui-slider-track.ui-body-a .ui-btn-active { - background-color: #e28755 /*{a-active-background-color}*/; - border-color: #f95806 /*{a-active-border}*/; + background-color: #6699FF /*{a-active-background-color}*/; + border-color: #154890 /*{a-active-border}*/; color: #ffffff /*{a-active-color}*/; - text-shadow: 1px /*{a-active-shadow-x}*/ 1px /*{a-active-shadow-y}*/ 1px /*{a-active-shadow-radius}*/ #ffd8b3 /*{a-active-shadow-color}*/; + text-shadow: 1px /*{a-active-shadow-x}*/ 1px /*{a-active-shadow-y}*/ 1px /*{a-active-shadow-radius}*/ #333333 /*{a-active-shadow-color}*/; } /* Active radio button icon */ .ui-page-theme-a .ui-radio-on:after, @@ -355,7 +355,7 @@ html .ui-bar-a .ui-radio-on:after, html .ui-body-a .ui-radio-on:after, html body .ui-group-theme-a .ui-radio-on:after, .ui-btn.ui-radio-on.ui-btn-a:after { - border-color: #e28755 /*{a-active-background-color}*/; + border-color: #6699FF /*{a-active-background-color}*/; } /* Focus */ .ui-page-theme-a .ui-btn:focus, @@ -370,9 +370,9 @@ html .ui-body-a .ui-focus, html body .ui-group-theme-a .ui-focus, html head + body .ui-btn-a.ui-focus, html head + body .ui-body-a.ui-focus { - -webkit-box-shadow: 0 0 12px #e28755 /*{a-active-background-color}*/; - -moz-box-shadow: 0 0 12px #e28755 /*{a-active-background-color}*/; - box-shadow: 0 0 12px #e28755 /*{a-active-background-color}*/; + -webkit-box-shadow: 0 0 12px #6699FF /*{a-active-background-color}*/; + -moz-box-shadow: 0 0 12px #6699FF /*{a-active-background-color}*/; + box-shadow: 0 0 12px #6699FF /*{a-active-background-color}*/; } /* B -----------------------------------------------------------------------------------------------------------*/ @@ -382,10 +382,10 @@ html head + body .ui-body-a.ui-focus { html .ui-bar-b .ui-bar-inherit, html .ui-body-b .ui-bar-inherit, html body .ui-group-theme-b .ui-bar-inherit { - background: #ec798e /*{b-bar-background-color}*/; - border-color: #c41219 /*{b-bar-border}*/; - color: #c41219 /*{b-bar-color}*/; - text-shadow: 1px /*{b-bar-shadow-x}*/ 1px /*{b-bar-shadow-y}*/ 1px /*{b-bar-shadow-radius}*/ #fabdbd /*{b-bar-shadow-color}*/; + background: #E47297 /*{b-bar-background-color}*/; + border-color: #AA0114 /*{b-bar-border}*/; + color: #AA0114 /*{b-bar-color}*/; + text-shadow: 0px /*{b-bar-shadow-x}*/ 0px /*{b-bar-shadow-y}*/ 5px /*{b-bar-shadow-radius}*/ #fFE9E8 /*{b-bar-shadow-color}*/; font-weight: bold; } .ui-bar-b { diff --git a/web/css/BlenderController.min.css b/web/css/BlenderController.min.css index cccd731..7e60580 100644 --- a/web/css/BlenderController.min.css +++ b/web/css/BlenderController.min.css @@ -24,7 +24,7 @@ button, .ui-btn { font-size: 1em; line-height: 1.3; - font-family: sans-serif /*{global-font-family}*/; + font-family: sans-serif /*{global-font-family}*/; } legend, .ui-input-text input, @@ -124,14 +124,14 @@ label.ui-btn { /* Shadow -----------------------------------------------------------------------------------------------------------*/ .ui-shadow { - -webkit-box-shadow: 0 1px 5px /*{global-box-shadow-size}*/ rgba(255,255,255,0.5) /*{global-box-shadow-color}*/; - -moz-box-shadow: 0 1px 5px /*{global-box-shadow-size}*/ rgba(255,255,255,0.5) /*{global-box-shadow-color}*/; - box-shadow: 0 1px 5px /*{global-box-shadow-size}*/ rgba(255,255,255,0.5) /*{global-box-shadow-color}*/; + -webkit-box-shadow: 0 1px 2px /*{global-box-shadow-size}*/ rgba(255,255,255,0.5) /*{global-box-shadow-color}*/; + -moz-box-shadow: 0 1px 2px /*{global-box-shadow-size}*/ rgba(255,255,255,0.5) /*{global-box-shadow-color}*/; + box-shadow: 0 1px 2px /*{global-box-shadow-size}*/ rgba(255,255,255,0.5) /*{global-box-shadow-color}*/; } .ui-shadow-inset { - -webkit-box-shadow: inset 0 1px 5px /*{global-box-shadow-size}*/ rgba(255,255,255,0.5) /*{global-box-shadow-color}*/; - -moz-box-shadow: inset 0 1px 5px /*{global-box-shadow-size}*/ rgba(255,255,255,0.5) /*{global-box-shadow-color}*/; - box-shadow: inset 0 1px 5px /*{global-box-shadow-size}*/ rgba(255,255,255,0.5) /*{global-box-shadow-color}*/; + -webkit-box-shadow: inset 0 1px 2px /*{global-box-shadow-size}*/ rgba(255,255,255,0.5) /*{global-box-shadow-color}*/; + -moz-box-shadow: inset 0 1px 2px /*{global-box-shadow-size}*/ rgba(255,255,255,0.5) /*{global-box-shadow-color}*/; + box-shadow: inset 0 1px 2px /*{global-box-shadow-size}*/ rgba(255,255,255,0.5) /*{global-box-shadow-color}*/; } .ui-overlay-shadow { -webkit-box-shadow: 0 0 12px rgba(0,0,0,.6); @@ -210,4 +210,4 @@ html .ui-alt-icon .ui-radio-off:after { .ui-icon-loading { background: url("images/ajax-loader.gif"); background-size: 2.875em 2.875em; -}.ui-bar-a,.ui-page-theme-a .ui-bar-inherit,html .ui-bar-a .ui-bar-inherit,html .ui-body-a .ui-bar-inherit,html body .ui-group-theme-a .ui-bar-inherit{background:#e28755 ;border-color:#f95806 ;color:#9e2200 ;text-shadow:1px 1px 1px #ffd8b3 ;font-weight:bold;}.ui-bar-a{border-width:1px;border-style:solid;}.ui-overlay-a,.ui-page-theme-a,.ui-page-theme-a .ui-panel-wrapper{background:#ffffff ;border-color:#bbbbbb ;color:#333333 ;text-shadow:0 0 0 #000000 ;}.ui-body-a,.ui-page-theme-a .ui-body-inherit,html .ui-bar-a .ui-body-inherit,html .ui-body-a .ui-body-inherit,html body .ui-group-theme-a .ui-body-inherit,html .ui-panel-page-container-a{background:#ffffff ;border-color:#949494 ;color:#333333 ;text-shadow:0 2px 0 #f3f3f3 ;}.ui-body-a{border-width:1px;border-style:solid;}.ui-page-theme-a a,html .ui-bar-a a,html .ui-body-a a,html body .ui-group-theme-a a{color:#3388cc ;font-weight:bold;}.ui-page-theme-a a:visited,html .ui-bar-a a:visited,html .ui-body-a a:visited,html body .ui-group-theme-a a:visited{ color:#3388cc ;}.ui-page-theme-a a:hover,html .ui-bar-a a:hover,html .ui-body-a a:hover,html body .ui-group-theme-a a:hover{color:#005599 ;}.ui-page-theme-a a:active,html .ui-bar-a a:active,html .ui-body-a a:active,html body .ui-group-theme-a a:active{color:#005599 ;}.ui-page-theme-a .ui-btn,html .ui-bar-a .ui-btn,html .ui-body-a .ui-btn,html body .ui-group-theme-a .ui-btn,html head + body .ui-btn.ui-btn-a,.ui-page-theme-a .ui-btn:visited,html .ui-bar-a .ui-btn:visited,html .ui-body-a .ui-btn:visited,html body .ui-group-theme-a .ui-btn:visited,html head + body .ui-btn.ui-btn-a:visited{background:#f6f6f6 ;border-color:#f95806 ;color:#333333 ;text-shadow:0 2px 0 #f3f3f3 ;}.ui-page-theme-a .ui-btn:hover,html .ui-bar-a .ui-btn:hover,html .ui-body-a .ui-btn:hover,html body .ui-group-theme-a .ui-btn:hover,html head + body .ui-btn.ui-btn-a:hover{background:#ededed ;border-color:#f95806 ;color:#333333 ;text-shadow:0 2px 0 #f3f3f3 ;}.ui-page-theme-a .ui-btn:active,html .ui-bar-a .ui-btn:active,html .ui-body-a .ui-btn:active,html body .ui-group-theme-a .ui-btn:active,html head + body .ui-btn.ui-btn-a:active{background:#e28755 ;border-color:#dddddd ;color:#333333 ;text-shadow:0 2px 0 #f3f3f3 ;}.ui-page-theme-a .ui-btn.ui-btn-active,html .ui-bar-a .ui-btn.ui-btn-active,html .ui-body-a .ui-btn.ui-btn-active,html body .ui-group-theme-a .ui-btn.ui-btn-active,html head + body .ui-btn.ui-btn-a.ui-btn-active,.ui-page-theme-a .ui-checkbox-on:after,html .ui-bar-a .ui-checkbox-on:after,html .ui-body-a .ui-checkbox-on:after,html body .ui-group-theme-a .ui-checkbox-on:after,.ui-btn.ui-checkbox-on.ui-btn-a:after,.ui-page-theme-a .ui-flipswitch-active,html .ui-bar-a .ui-flipswitch-active,html .ui-body-a .ui-flipswitch-active,html body .ui-group-theme-a .ui-flipswitch-active,html body .ui-flipswitch.ui-bar-a.ui-flipswitch-active,.ui-page-theme-a .ui-slider-track .ui-btn-active,html .ui-bar-a .ui-slider-track .ui-btn-active,html .ui-body-a .ui-slider-track .ui-btn-active,html body .ui-group-theme-a .ui-slider-track .ui-btn-active,html body div.ui-slider-track.ui-body-a .ui-btn-active{background-color:#e28755 ;border-color:#f95806 ;color:#ffffff ;text-shadow:1px 1px 1px #ffd8b3 ;}.ui-page-theme-a .ui-radio-on:after,html .ui-bar-a .ui-radio-on:after,html .ui-body-a .ui-radio-on:after,html body .ui-group-theme-a .ui-radio-on:after,.ui-btn.ui-radio-on.ui-btn-a:after{border-color:#e28755 ;}.ui-page-theme-a .ui-btn:focus,html .ui-bar-a .ui-btn:focus,html .ui-body-a .ui-btn:focus,html body .ui-group-theme-a .ui-btn:focus,html head + body .ui-btn.ui-btn-a:focus,.ui-page-theme-a .ui-focus,html .ui-bar-a .ui-focus,html .ui-body-a .ui-focus,html body .ui-group-theme-a .ui-focus,html head + body .ui-btn-a.ui-focus,html head + body .ui-body-a.ui-focus{-webkit-box-shadow:0 0 12px #e28755 ;-moz-box-shadow:0 0 12px #e28755 ;box-shadow:0 0 12px #e28755 ;}.ui-bar-b,.ui-page-theme-b .ui-bar-inherit,html .ui-bar-b .ui-bar-inherit,html .ui-body-b .ui-bar-inherit,html body .ui-group-theme-b .ui-bar-inherit{background:#ec798e ;border-color:#c41219 ;color:#c41219 ;text-shadow:1px 1px 1px #fabdbd ;font-weight:bold;}.ui-bar-b{border-width:1px;border-style:solid;}.ui-overlay-b,.ui-page-theme-b,.ui-page-theme-b .ui-panel-wrapper{background:#292929 ;border-color:#bbbbbb ;color:#292929 ;text-shadow:0 1px 0 #f3f3f3 ;}.ui-body-b,.ui-page-theme-b .ui-body-inherit,html .ui-bar-b .ui-body-inherit,html .ui-body-b .ui-body-inherit,html body .ui-group-theme-b .ui-body-inherit,html .ui-panel-page-container-b{background:#292929 ;border-color:#ffffff ;color:#333333 ;text-shadow:0 1px 0 #f3f3f3 ;}.ui-body-b{border-width:1px;border-style:solid;}.ui-page-theme-b a,html .ui-bar-b a,html .ui-body-b a,html body .ui-group-theme-b a{color:#3388cc ;font-weight:bold;}.ui-page-theme-b a:visited,html .ui-bar-b a:visited,html .ui-body-b a:visited,html body .ui-group-theme-b a:visited{ color:#3388cc ;}.ui-page-theme-b a:hover,html .ui-bar-b a:hover,html .ui-body-b a:hover,html body .ui-group-theme-b a:hover{color:#005599 ;}.ui-page-theme-b a:active,html .ui-bar-b a:active,html .ui-body-b a:active,html body .ui-group-theme-b a:active{color:#005599 ;}.ui-page-theme-b .ui-btn,html .ui-bar-b .ui-btn,html .ui-body-b .ui-btn,html body .ui-group-theme-b .ui-btn,html head + body .ui-btn.ui-btn-b,.ui-page-theme-b .ui-btn:visited,html .ui-bar-b .ui-btn:visited,html .ui-body-b .ui-btn:visited,html body .ui-group-theme-b .ui-btn:visited,html head + body .ui-btn.ui-btn-b:visited{background:#f6f6f6 ;border-color:#dddddd ;color:#333333 ;text-shadow:0 1px 0 #f3f3f3 ;}.ui-page-theme-b .ui-btn:hover,html .ui-bar-b .ui-btn:hover,html .ui-body-b .ui-btn:hover,html body .ui-group-theme-b .ui-btn:hover,html head + body .ui-btn.ui-btn-b:hover{background:#ededed ;border-color:#dddddd ;color:#333333 ;text-shadow:0 1px 0 #f3f3f3 ;}.ui-page-theme-b .ui-btn:active,html .ui-bar-b .ui-btn:active,html .ui-body-b .ui-btn:active,html body .ui-group-theme-b .ui-btn:active,html head + body .ui-btn.ui-btn-b:active{background:#e8e8e8 ;border-color:#dddddd ;color:#333333 ;text-shadow:0 1px 0 #f3f3f3 ;}.ui-page-theme-b .ui-btn.ui-btn-active,html .ui-bar-b .ui-btn.ui-btn-active,html .ui-body-b .ui-btn.ui-btn-active,html body .ui-group-theme-b .ui-btn.ui-btn-active,html head + body .ui-btn.ui-btn-b.ui-btn-active,.ui-page-theme-b .ui-checkbox-on:after,html .ui-bar-b .ui-checkbox-on:after,html .ui-body-b .ui-checkbox-on:after,html body .ui-group-theme-b .ui-checkbox-on:after,.ui-btn.ui-checkbox-on.ui-btn-b:after,.ui-page-theme-b .ui-flipswitch-active,html .ui-bar-b .ui-flipswitch-active,html .ui-body-b .ui-flipswitch-active,html body .ui-group-theme-b .ui-flipswitch-active,html body .ui-flipswitch.ui-bar-b.ui-flipswitch-active,.ui-page-theme-b .ui-slider-track .ui-btn-active,html .ui-bar-b .ui-slider-track .ui-btn-active,html .ui-body-b .ui-slider-track .ui-btn-active,html body .ui-group-theme-b .ui-slider-track .ui-btn-active,html body div.ui-slider-track.ui-body-b .ui-btn-active{background-color:#3388cc ;border-color:#1c4a70 ;color:#ffffff ;text-shadow:0 1px 0 #005599 ;}.ui-page-theme-b .ui-radio-on:after,html .ui-bar-b .ui-radio-on:after,html .ui-body-b .ui-radio-on:after,html body .ui-group-theme-b .ui-radio-on:after,.ui-btn.ui-radio-on.ui-btn-b:after{border-color:#3388cc ;}.ui-page-theme-b .ui-btn:focus,html .ui-bar-b .ui-btn:focus,html .ui-body-b .ui-btn:focus,html body .ui-group-theme-b .ui-btn:focus,html head + body .ui-btn.ui-btn-b:focus,.ui-page-theme-b .ui-focus,html .ui-bar-b .ui-focus,html .ui-body-b .ui-focus,html body .ui-group-theme-b .ui-focus,html head + body .ui-btn-b.ui-focus,html head + body .ui-body-b.ui-focus{-webkit-box-shadow:0 0 12px #3388cc ;-moz-box-shadow:0 0 12px #3388cc ;box-shadow:0 0 12px #3388cc ;}.ui-disabled,.ui-state-disabled,button[disabled],.ui-select .ui-btn.ui-state-disabled{filter:Alpha(Opacity=30);opacity:.3;cursor:default !important;pointer-events:none;}.ui-btn:focus,.ui-btn.ui-focus{outline:0;}.ui-noboxshadow .ui-shadow,.ui-noboxshadow .ui-shadow-inset,.ui-noboxshadow .ui-overlay-shadow,.ui-noboxshadow .ui-shadow-icon.ui-btn:after,.ui-noboxshadow .ui-shadow-icon .ui-btn:after,.ui-noboxshadow .ui-focus,.ui-noboxshadow .ui-btn:focus,.ui-noboxshadow input:focus,.ui-noboxshadow .ui-panel{-webkit-box-shadow:none !important;-moz-box-shadow:none !important;box-shadow:none !important;}.ui-noboxshadow .ui-btn:focus,.ui-noboxshadow .ui-focus{outline-width:1px;outline-style:auto;} \ No newline at end of file +}.ui-bar-a,.ui-page-theme-a .ui-bar-inherit,html .ui-bar-a .ui-bar-inherit,html .ui-body-a .ui-bar-inherit,html body .ui-group-theme-a .ui-bar-inherit{background:#CDBFAC ;border-color:#f95806 ;color:#FF6600 ;text-shadow:0px 0px 5px #F5EDE3 ;font-weight:bold;}.ui-bar-a{border-width:1px;border-style:solid;}.ui-overlay-a,.ui-page-theme-a,.ui-page-theme-a .ui-panel-wrapper{background:#F5EDE3 ;border-color:#ff6600 ;color:#333333 ;text-shadow:0 0 0 #000000 ;}.ui-body-a,.ui-page-theme-a .ui-body-inherit,html .ui-bar-a .ui-body-inherit,html .ui-body-a .ui-body-inherit,html body .ui-group-theme-a .ui-body-inherit,html .ui-panel-page-container-a{background:#ffffff ;border-color:#154890 ;color:#333333 ;text-shadow:0 2px 0 #f3f3f3 ;}.ui-body-a{border-width:1px;border-style:solid;}.ui-page-theme-a a,html .ui-bar-a a,html .ui-body-a a,html body .ui-group-theme-a a{color:#6699ff ;font-weight:bold;}.ui-page-theme-a a:visited,html .ui-bar-a a:visited,html .ui-body-a a:visited,html body .ui-group-theme-a a:visited{ color:#3388cc ;}.ui-page-theme-a a:hover,html .ui-bar-a a:hover,html .ui-body-a a:hover,html body .ui-group-theme-a a:hover{color:#005599 ;}.ui-page-theme-a a:active,html .ui-bar-a a:active,html .ui-body-a a:active,html body .ui-group-theme-a a:active{color:#005599 ;}.ui-page-theme-a .ui-btn,html .ui-bar-a .ui-btn,html .ui-body-a .ui-btn,html body .ui-group-theme-a .ui-btn,html head + body .ui-btn.ui-btn-a,.ui-page-theme-a .ui-btn:visited,html .ui-bar-a .ui-btn:visited,html .ui-body-a .ui-btn:visited,html body .ui-group-theme-a .ui-btn:visited,html head + body .ui-btn.ui-btn-a:visited{background:#E1D4C0 ;border-color:#154890 ;color:#333333 ;text-shadow:0 2px 0 #f3f3f3 ;}.ui-page-theme-a .ui-btn:hover,html .ui-bar-a .ui-btn:hover,html .ui-body-a .ui-btn:hover,html body .ui-group-theme-a .ui-btn:hover,html head + body .ui-btn.ui-btn-a:hover{background:#CDBFAC ;border-color:#154890 ;color:#333333 ;text-shadow:0 2px 0 #f3f3f3 ;}.ui-page-theme-a .ui-btn:active,html .ui-bar-a .ui-btn:active,html .ui-body-a .ui-btn:active,html body .ui-group-theme-a .ui-btn:active,html head + body .ui-btn.ui-btn-a:active{background:#6699FF ;border-color:#154890 ;color:#333333 ;text-shadow:0 2px 0 #f3f3f3 ;}.ui-page-theme-a .ui-btn.ui-btn-active,html .ui-bar-a .ui-btn.ui-btn-active,html .ui-body-a .ui-btn.ui-btn-active,html body .ui-group-theme-a .ui-btn.ui-btn-active,html head + body .ui-btn.ui-btn-a.ui-btn-active,.ui-page-theme-a .ui-checkbox-on:after,html .ui-bar-a .ui-checkbox-on:after,html .ui-body-a .ui-checkbox-on:after,html body .ui-group-theme-a .ui-checkbox-on:after,.ui-btn.ui-checkbox-on.ui-btn-a:after,.ui-page-theme-a .ui-flipswitch-active,html .ui-bar-a .ui-flipswitch-active,html .ui-body-a .ui-flipswitch-active,html body .ui-group-theme-a .ui-flipswitch-active,html body .ui-flipswitch.ui-bar-a.ui-flipswitch-active,.ui-page-theme-a .ui-slider-track .ui-btn-active,html .ui-bar-a .ui-slider-track .ui-btn-active,html .ui-body-a .ui-slider-track .ui-btn-active,html body .ui-group-theme-a .ui-slider-track .ui-btn-active,html body div.ui-slider-track.ui-body-a .ui-btn-active{background-color:#6699FF ;border-color:#154890 ;color:#ffffff ;text-shadow:1px 1px 1px #333333 ;}.ui-page-theme-a .ui-radio-on:after,html .ui-bar-a .ui-radio-on:after,html .ui-body-a .ui-radio-on:after,html body .ui-group-theme-a .ui-radio-on:after,.ui-btn.ui-radio-on.ui-btn-a:after{border-color:#6699FF ;}.ui-page-theme-a .ui-btn:focus,html .ui-bar-a .ui-btn:focus,html .ui-body-a .ui-btn:focus,html body .ui-group-theme-a .ui-btn:focus,html head + body .ui-btn.ui-btn-a:focus,.ui-page-theme-a .ui-focus,html .ui-bar-a .ui-focus,html .ui-body-a .ui-focus,html body .ui-group-theme-a .ui-focus,html head + body .ui-btn-a.ui-focus,html head + body .ui-body-a.ui-focus{-webkit-box-shadow:0 0 12px #6699FF ;-moz-box-shadow:0 0 12px #6699FF ;box-shadow:0 0 12px #6699FF ;}.ui-bar-b,.ui-page-theme-b .ui-bar-inherit,html .ui-bar-b .ui-bar-inherit,html .ui-body-b .ui-bar-inherit,html body .ui-group-theme-b .ui-bar-inherit{background:#E47297 ;border-color:#AA0114 ;color:#AA0114 ;text-shadow:0px 0px 5px #fFE9E8 ;font-weight:bold;}.ui-bar-b{border-width:1px;border-style:solid;}.ui-overlay-b,.ui-page-theme-b,.ui-page-theme-b .ui-panel-wrapper{background:#292929 ;border-color:#bbbbbb ;color:#292929 ;text-shadow:0 1px 0 #f3f3f3 ;}.ui-body-b,.ui-page-theme-b .ui-body-inherit,html .ui-bar-b .ui-body-inherit,html .ui-body-b .ui-body-inherit,html body .ui-group-theme-b .ui-body-inherit,html .ui-panel-page-container-b{background:#292929 ;border-color:#ffffff ;color:#333333 ;text-shadow:0 1px 0 #f3f3f3 ;}.ui-body-b{border-width:1px;border-style:solid;}.ui-page-theme-b a,html .ui-bar-b a,html .ui-body-b a,html body .ui-group-theme-b a{color:#3388cc ;font-weight:bold;}.ui-page-theme-b a:visited,html .ui-bar-b a:visited,html .ui-body-b a:visited,html body .ui-group-theme-b a:visited{ color:#3388cc ;}.ui-page-theme-b a:hover,html .ui-bar-b a:hover,html .ui-body-b a:hover,html body .ui-group-theme-b a:hover{color:#005599 ;}.ui-page-theme-b a:active,html .ui-bar-b a:active,html .ui-body-b a:active,html body .ui-group-theme-b a:active{color:#005599 ;}.ui-page-theme-b .ui-btn,html .ui-bar-b .ui-btn,html .ui-body-b .ui-btn,html body .ui-group-theme-b .ui-btn,html head + body .ui-btn.ui-btn-b,.ui-page-theme-b .ui-btn:visited,html .ui-bar-b .ui-btn:visited,html .ui-body-b .ui-btn:visited,html body .ui-group-theme-b .ui-btn:visited,html head + body .ui-btn.ui-btn-b:visited{background:#f6f6f6 ;border-color:#dddddd ;color:#333333 ;text-shadow:0 1px 0 #f3f3f3 ;}.ui-page-theme-b .ui-btn:hover,html .ui-bar-b .ui-btn:hover,html .ui-body-b .ui-btn:hover,html body .ui-group-theme-b .ui-btn:hover,html head + body .ui-btn.ui-btn-b:hover{background:#ededed ;border-color:#dddddd ;color:#333333 ;text-shadow:0 1px 0 #f3f3f3 ;}.ui-page-theme-b .ui-btn:active,html .ui-bar-b .ui-btn:active,html .ui-body-b .ui-btn:active,html body .ui-group-theme-b .ui-btn:active,html head + body .ui-btn.ui-btn-b:active{background:#e8e8e8 ;border-color:#dddddd ;color:#333333 ;text-shadow:0 1px 0 #f3f3f3 ;}.ui-page-theme-b .ui-btn.ui-btn-active,html .ui-bar-b .ui-btn.ui-btn-active,html .ui-body-b .ui-btn.ui-btn-active,html body .ui-group-theme-b .ui-btn.ui-btn-active,html head + body .ui-btn.ui-btn-b.ui-btn-active,.ui-page-theme-b .ui-checkbox-on:after,html .ui-bar-b .ui-checkbox-on:after,html .ui-body-b .ui-checkbox-on:after,html body .ui-group-theme-b .ui-checkbox-on:after,.ui-btn.ui-checkbox-on.ui-btn-b:after,.ui-page-theme-b .ui-flipswitch-active,html .ui-bar-b .ui-flipswitch-active,html .ui-body-b .ui-flipswitch-active,html body .ui-group-theme-b .ui-flipswitch-active,html body .ui-flipswitch.ui-bar-b.ui-flipswitch-active,.ui-page-theme-b .ui-slider-track .ui-btn-active,html .ui-bar-b .ui-slider-track .ui-btn-active,html .ui-body-b .ui-slider-track .ui-btn-active,html body .ui-group-theme-b .ui-slider-track .ui-btn-active,html body div.ui-slider-track.ui-body-b .ui-btn-active{background-color:#3388cc ;border-color:#1c4a70 ;color:#ffffff ;text-shadow:0 1px 0 #005599 ;}.ui-page-theme-b .ui-radio-on:after,html .ui-bar-b .ui-radio-on:after,html .ui-body-b .ui-radio-on:after,html body .ui-group-theme-b .ui-radio-on:after,.ui-btn.ui-radio-on.ui-btn-b:after{border-color:#3388cc ;}.ui-page-theme-b .ui-btn:focus,html .ui-bar-b .ui-btn:focus,html .ui-body-b .ui-btn:focus,html body .ui-group-theme-b .ui-btn:focus,html head + body .ui-btn.ui-btn-b:focus,.ui-page-theme-b .ui-focus,html .ui-bar-b .ui-focus,html .ui-body-b .ui-focus,html body .ui-group-theme-b .ui-focus,html head + body .ui-btn-b.ui-focus,html head + body .ui-body-b.ui-focus{-webkit-box-shadow:0 0 12px #3388cc ;-moz-box-shadow:0 0 12px #3388cc ;box-shadow:0 0 12px #3388cc ;}.ui-disabled,.ui-state-disabled,button[disabled],.ui-select .ui-btn.ui-state-disabled{filter:Alpha(Opacity=30);opacity:.3;cursor:default !important;pointer-events:none;}.ui-btn:focus,.ui-btn.ui-focus{outline:0;}.ui-noboxshadow .ui-shadow,.ui-noboxshadow .ui-shadow-inset,.ui-noboxshadow .ui-overlay-shadow,.ui-noboxshadow .ui-shadow-icon.ui-btn:after,.ui-noboxshadow .ui-shadow-icon .ui-btn:after,.ui-noboxshadow .ui-focus,.ui-noboxshadow .ui-btn:focus,.ui-noboxshadow input:focus,.ui-noboxshadow .ui-panel{-webkit-box-shadow:none !important;-moz-box-shadow:none !important;box-shadow:none !important;}.ui-noboxshadow .ui-btn:focus,.ui-noboxshadow .ui-focus{outline-width:1px;outline-style:auto;} \ No newline at end of file diff --git a/web/css/style.css b/web/css/style.css index 45b204a..f458540 100644 --- a/web/css/style.css +++ b/web/css/style.css @@ -18,7 +18,7 @@ a { -webkit-user-select: none !important; } #SwipeControl{ height: 100%; } -#Page-Swipe .ui-content { +#Page-Swipe .fullHeight { position : absolute; top : 40px; right : 0; @@ -27,8 +27,7 @@ a { -webkit-user-select: none !important; } } .iconButton { -webkit-border-radius: .3125em !important; - border-radius: .3125em !important; - + border-radius: .3125em !important; } .ui-footer{ position: fixed; @@ -36,13 +35,11 @@ a { -webkit-user-select: none !important; } left: 0px; right: 0px; } -.ui-footer form { - -} -.ui-footer form input{ + +#popup-strength input{ display: none; } -.ui-footer .ui-slider-track { +#popup-strength .ui-slider-track { margin-left: 15px; } \ No newline at end of file diff --git a/web/index.temp b/web/index.temp index 1461d8d..7b6ff86 100644 --- a/web/index.temp +++ b/web/index.temp @@ -14,6 +14,9 @@ BlenderWebController + + + @@ -21,18 +24,8 @@ - - - - - - - + @@ -44,7 +37,6 @@
  • Settings
  • Connection
  • Info
    • -
  • Close panel
    • @@ -88,10 +80,23 @@ -
    -
    - - + + +
    + Close +

    Adjust Movement Sensitivity

    + + +
    @@ -109,7 +114,7 @@ -
    +

    Not Connected

    Swipe Controls

    @@ -121,22 +126,34 @@

    -
    -
    - - + + +
    + Close +

    Adjust Movement Sensitivity

    + + +
    - - +
     

    Connection Settings

    -   +  
    @@ -149,10 +166,8 @@
    - - - -
    +
    +
    Close @@ -161,7 +176,6 @@
    -