diff --git a/app/assets/javascripts/jquery.tinyscrollbar.js b/app/assets/javascripts/jquery.tinyscrollbar.js index 4bca0dfa..fe2f2ba2 100644 --- a/app/assets/javascripts/jquery.tinyscrollbar.js +++ b/app/assets/javascripts/jquery.tinyscrollbar.js @@ -11,19 +11,20 @@ * Depends on library: jQuery * */ -( function( $ ) +;( function( $ ) { $.tiny = $.tiny || { }; $.tiny.scrollbar = { options: { - axis : 'y' // vertical or horizontal scrollbar? ( x || y ). - , wheel : 40 // how many pixels must the mouswheel scroll at a time. - , scroll : true // enable or disable the mousewheel. - , lockscroll : true // return scrollwheel to browser if there is no more content. - , size : 'auto' // set the size of the scrollbar to auto or a fixed number. - , sizethumb : 'auto' // set the size of the thumb to auto or a fixed number. - , onMove : function(){} + axis : 'y' // vertical or horizontal scrollbar? ( x || y ). + , wheel : 40 // how many pixels must the mouswheel scroll at a time. + , scroll : true // enable or disable the mousewheel. + , lockscroll : true // return scrollwheel to browser if there is no more content. + , size : 'auto' // set the size of the scrollbar to auto or a fixed number. + , sizethumb : 'auto' // set the size of the thumb to auto or a fixed number. + , invertscroll : false // Enable mobile invert style scrolling + , onMove : function(){} } }; @@ -59,13 +60,15 @@ , iScroll = 0 , iPosition = { start: 0, now: 0 } , iMouse = {} - , touchEvents = ( 'ontouchstart' in document.documentElement ) ? true : false + , touchEvents = 'ontouchstart' in document.documentElement + , UA = $.browser ; function initialize() { oSelf.update(); setEvents(); + return oSelf; } @@ -124,6 +127,9 @@ { oWrapper[0].addEventListener( 'DOMMouseScroll', wheel, false ); oWrapper[0].addEventListener( 'mousewheel', wheel, false ); + oWrapper[0].addEventListener( 'MozMousePixelScroll', function( event ){ + event.preventDefault(); + }, false); } else if( options.scroll ) { @@ -133,6 +139,16 @@ function start( event ) { + $( "body" ).addClass( "noSelect" ); + // Disable select text under IE10 + if ( UA.msie < 10 ){ + $( "body" ).attr({ + "onselectstart": "return false", + "ondragstart": "return false" + }); + } + oScrollbar.obj.addClass( "dragging" ); + var oThumbDir = parseInt( oThumb.obj.css( sDirection ), 10 ); iMouse.start = sAxis ? event.pageX : event.pageY; iPosition.start = oThumbDir == 'auto' ? 0 : oThumbDir; @@ -181,13 +197,13 @@ { if( oContent.ratio < 1 ) { - if( ! touchEvents ) + if( options.invertscroll && touchEvents ) { - iPosition.now = Math.min( ( oTrack[ options.axis ] - oThumb[ options.axis ] ), Math.max( 0, ( iPosition.start + ( ( sAxis ? event.pageX : event.pageY ) - iMouse.start)))); + iPosition.now = Math.min( ( oTrack[ options.axis ] - oThumb[ options.axis ] ), Math.max( 0, ( iPosition.start + ( iMouse.start - ( sAxis ? event.pageX : event.pageY ) )))); } else { - iPosition.now = Math.min( ( oTrack[ options.axis ] - oThumb[ options.axis ] ), Math.max( 0, ( iPosition.start + ( iMouse.start - ( sAxis ? event.pageX : event.pageY ) )))); + iPosition.now = Math.min( ( oTrack[ options.axis ] - oThumb[ options.axis ] ), Math.max( 0, ( iPosition.start + ( ( sAxis ? event.pageX : event.pageY ) - iMouse.start)))); } iScroll = iPosition.now * oScrollbar.ratio; @@ -198,6 +214,12 @@ function end() { + $( "body" ).removeClass( "noSelect" ); + // Enable select text under IE10 + if ( UA.msie < 10 ){ + $( "body" ).removeAttr( "onselectstart", "ondragstart" ); + } + oScrollbar.obj.removeClass( "dragging" ); $( document ).unbind( 'mousemove', drag ); $( document ).unbind( 'mouseup', end ); oThumb.obj.unbind( 'mouseup', end ); diff --git a/app/assets/javascripts/orbitdesktop.js b/app/assets/javascripts/orbitdesktop.js index bf4ab16c..74465477 100755 --- a/app/assets/javascripts/orbitdesktop.js +++ b/app/assets/javascripts/orbitdesktop.js @@ -285,7 +285,7 @@ var orbitDesktop = function(dom){ var entries = column_container.find("li[item=true]"),x = 0; entries.each(function(i,li){ if(x == 0){ - column = $("
'+section.name+'')); + $("div#desktop ul#section_list").append($('
  • '+section.name+'
    • ')); }) bindSecondaryHandlers(); }) @@ -715,7 +715,7 @@ var orbitDesktop = function(dom){ tempstyle = "style='display:none;'"; $("div#desktop span#section_heading").text(section.name); } - $("div#desktop ul#section_list").append($('
  • '+section.name+'
    • ')); + $("div#desktop ul#section_list").append($('
  • '+section.name+'
    • ')); }) bindSecondaryHandlers(); }else{ @@ -1364,10 +1364,10 @@ var orbitDesktop = function(dom){ var count,baseWidth,fillArray,pxs; if( typeof target.fill == 'string' ){ - fillArray = target.main.find(target.fill); - count = fillArray.length; - baseWidth = $(target.fill).eq(1).outerWidth(true); - target.main.find('.overview').width( baseWidth * count); + // fillArray = target.main.find(target.fill); + // count = fillArray.length; + // baseWidth = $(target.fill).eq(1).outerWidth(true); + // target.main.find('.overview').width( baseWidth * count); } else if( typeof target.fill == 'number' ){ target.main.find('.overview').width( target.fill ); @@ -1376,14 +1376,13 @@ var orbitDesktop = function(dom){ } else { o.notify('tinyscrollbar: setting width failed','imp',2); } - if(target.height) + if(target.height){ target.main.height(target.height); + } target.main .tinyscrollbar( tinysettings ) - .find('.scrollbar') - .delay(1500) - .addClass('op00', 500); + .find('.scrollbar'); }; this.simple_drop_down = function(){ // simple dropdown menu diff --git a/app/assets/stylesheets/desktop.css b/app/assets/stylesheets/desktop.css index f3746eff..2ae194e5 100644 --- a/app/assets/stylesheets/desktop.css +++ b/app/assets/stylesheets/desktop.css @@ -2,17 +2,17 @@ *This is a manifest file that'll automatically include all the stylesheets available in this directory *and any sub-directories. You're free to add application-wide styles to this file and they'll appear at *the top of the compiled file, but it's generally better to create a new file per style scope. - *= require desktop_font - *= require style + *= require desktop/desktop-font *= require bootstrap *= require bootstrap-orbit *= require jquery.miniColors + *= require jquery.gridster *= require jquery-ui *= require font-awesome - *= require desktopmain - *= require desktopmedia - *= require orbitTimeline - *= require orbit-bar - *= require jquery.gridster *= require icons + *= require desktop/desktop-component + *= require desktop/desktop-main + *= require desktop/desktop-media + *= require desktop/desktop-timeline + *= require orbit-bar */ \ No newline at end of file diff --git a/app/assets/stylesheets/desktop/desktop-component.css b/app/assets/stylesheets/desktop/desktop-component.css new file mode 100644 index 00000000..74700581 --- /dev/null +++ b/app/assets/stylesheets/desktop/desktop-component.css @@ -0,0 +1,419 @@ +/* simple dropdown menu */ +.sdm { + position: relative; +} +.sdm_t { + cursor: default; + -webkit-transition: all 0.3s ease; + -moz-transition: all 0.3s ease; + transition: all 0.3s ease; +} +.sdm:hover .sdm_o { + display: block; +} +.sdm_o { + display: none; + position: absolute; + z-index: 9; + left: 0; + top: 60px; + font-size: 15px; + } +.sdm_o li { + border-top: solid 1px #f2f2f2; +} +.sdm_o li:first-child { + border: none; +} +.sdm_o a { + display: block; +} +.sdm_o .admtxt { + display: block; + line-height: 36px; +} + +/* simple dropdown menu with indicator */ +.sdm_mdr .sdm_t { + padding-right: 12px; +} +.sdm_mdr .mdr { + position: absolute; + right: 0; +} + +/* simple menu */ +.s_menu { + font-size: 15px; + line-height: 36px; +} +.s_menu li { + border-top: solid 1px #ddd; +} +.s_menu li:first-child { + border: none; +} +.s_menu a { + display: block; +} + +/* simple tabs */ +.s_tab { + font-size: 15px; + line-height: 36px; +} +.stb_h {} +.stb_v {} +.s_tab ul { + overflow: hidden; +} +.s_tab li { + float: left; +} +.s_tab a { + display: block; +} +.s_tab .admbg { + background-color: #f0f0f0; +} +.st_c { + display: none; +} +.st_c:first-child { + display: block; +} + +/* simple form */ +.s_form { + font-size: 15px; +} +.s_form li { + overflow: hidden; + padding: 6px; + margin-bottom: 12px; + position: relative; +} +.s_form .s_grid_row { + padding: 3px; + margin-bottom: 6px; +} +.s_form label { + font-size: 13px; + display: inline-block; + vertical-align: middle; + width: 100px; + margin-right: 24px; + color: #777; +} +.s_form input[type=text], +.s_form input[type=password], +.s_form textarea{ + outline: solid 3px #f6f6f6; + border: solid 1px #eee; + font-size: 15px; + font-family: Arial !important; + margin: 0; + padding: 6px; + -webkit-transition: all 0.3s ease; + -moz-transition: all 0.3s ease; + transition: all 0.3s ease; +} +.s_form select { + font-family: Arial !important; + padding: 6px; height: auto; +} +.s_form input[type=file] { + margin: 0px; + vertical-align: baseline; +} +.s_form input[type=text]:focus, +.s_form input[type=password]:focus, +.s_form textarea:focus { + background-color: #333; + color: #fff; +} +.s_form textarea { + resize: none; +} +.check_box_g { + padding: 4px 8px; + outline: solid 1px #eee; +} +.check_box_g > label { + font-size: 15px; + display: block; + padding: 4px 0; +} +.check_box_g li { + margin: 0 6px 6px 0; + padding: 0; +} +.check_box_g li, +.check_box_g li > * { + display: inline-block; + vertical-align: middle; +} +.check_box_g label { + width: auto; + margin: 0; +} +.check_box_g li label { + padding-left: 4px; + font-family: Arial; +} +.s_form .input_append { + position: absolute; + width: 30px; + height: 30px; + line-height: 30px; + right: 5px; + top: 5px; + display: block; + background-color: #fff; +} +.s_form.s_grid_con { + width: 416px; +} +.s_form .s_grid_row { + width: 410px; +} +.s_form .s_grid_row .s_grid:first-child { + margin-left: 0; +} +.s_form input[type=text].s_grid, +.s_form input[type=passowrd].s_grid, +.s_form textarea.s_grid, +.s_form label.s_grid, +.s_form select.s_grid { + margin-left: 10px; +} +.s_form input[type=text].s_grid_1, +.s_form input[type=passowrd].s_grid_1, +.s_form textarea.s_grid_1 { + width: 46px; +} +.s_form input[type=text].s_grid_2, +.s_form input[type=passowrd].s_grid_2, +.s_form textarea.s_grid_2 { + width: 116px; +} +.s_form input[type=text].s_grid_3, +.s_form input[type=passowrd].s_grid_3, +.s_form textarea.s_grid_3 { + width: 186px; +} +.s_form input[type=text].s_grid_4, +.s_form input[type=passowrd].s_grid_4, +.s_form textarea.s_grid_4 { + width: 256px; +} +.s_form input[type=text].s_grid_5, +.s_form input[type=passowrd].s_grid_5, +.s_form textarea.s_grid_5 { + width: 326px; +} +.s_form input[type=text].s_grid_6, +.s_form input[type=passowrd].s_grid_6, +.s_form textarea.s_grid_6 { + width: 396px; +} +.s_form select.s_grid_1 { + width: 60px; +} +.s_form select.s_grid_2 { + width: 130px; +} +.s_form select.s_grid_3 { + width: 200px; +} +.s_form select.s_grid_4 { + width: 270px; +} +.s_form select.s_grid_5 { + width: 340px; +} +.s_form select.s_grid_6 { + width: 410px; +} +.s_form label.s_grid { + line-height: 34px; +} +.s_form select.s_grid { + height: 26px; + margin-top: 4px; + margin-bottom: 4px; +} +.s_form textarea.full_height { + height: 436px; +} +.s_form .s_table { + width: 100%; +} +.s_form .s_table th, +.s_form .s_table td { + padding: 6px 0; +} +.s_form .s_table th { + text-align: left; +} +.s_form .s_table td { + vertical-align: middle; +} +.s_form .s_table thead th { + border-bottom: solid 1px #eee; +} + +/* tool bar */ +.toolbar { + background-color: #f0f0f0; + font-size: 15px; + line-height: 36px; + position: relative; + z-index: 9; +} +.toolbar .sdm, .toolbar .fn_g { + display: inline-block; + vertical-align: top; +} +.toolbar .sdm_o { + top: 36px; + background-color: #f0f0f0; +} +.toolbar button { + border: none; + outline: none; + padding: 0 16px; + margin: 0; + font-family: inherit; + font-size: 15px; + vertical-align: top; +} +.toolbar .fn_btn { + display: inline-block; + vertical-align: top; +} + +/* tinygrid */ +.s_grid_con { + width: 410px; +} +.s_grid_row { + overflow: hidden; + margin-bottom: 12px; +} +.s_grid_row .s_grid:first-child { + margin-left: 0; +} +.s_grid { + float: left; + margin: 0 0 0 10px; +} +.s_grid_con .s_grid_1 { + width: 60px; +} +.s_grid_con .s_grid_2 { + width: 130px; +} +.s_grid_con .s_grid_3 { + width: 200px; +} +.s_grid_con .s_grid_4 { + width: 270px; +} +.s_grid_con .s_grid_5 { + width: 340px; +} +.s_grid_con .s_grid_6 { + width: 410px; +} + +/* tiny scrollbar */ +.tinycanvas { + overflow: hidden; + position: relative; + height: 100%; +} +.tinycanvas .viewport { + width: auto; + height: 100%; + overflow: hidden; + position: relative; +} +.tinycanvas .overview { + position: absolute; + left: 0; + top: 0; + min-width: 100%; + height: 100%; +} +.tinycanvas .track { + height: 100%; + width: 6px; + position: relative; +} +.tinycanvas .thumb { + height: 6px; + width: 6px; + cursor: pointer; + overflow: hidden; + position: absolute; + top: 0; +} +.tinycanvas .thumb .end { + overflow: hidden; + height: 6px; + width: 6px; +} +.noSelect { + -webkit-user-select: none; + -khtml-user-select: none; + -moz-user-select: none; + -ms-user-select: none; + -o-user-select: none; + user-select: none; +} +.tinycanvas .scrollbar { + position: absolute; + z-index: 9; + visibility: hidden; + opacity: 0; + -webkit-transition: opacity 0.3s ease; + -moz-transition: opacity 0.3s ease; + transition: opacity 0.3s ease; +} +.tinycanvas .scrollbar.dragging { + opacity: 1; + visibility: visible; +} +.tinycanvas .scrollbar.sb_h { + left: 0; + bottom: -6px; + height: 6px; +} +.tinycanvas .scrollbar.sb_v { + right: 0; + top: 0; + width: 6px; +} +.tinycanvas .scrollbar.disable, +.tinycanvas:hover .scrollbar.disable { + visibility: hidden !important; +} +.tinycanvas:hover .scrollbar { + visibility: visible; + opacity: 1; +} +.tinycanvas .overview > .column { + float: left; + border-left: solid 1px #eee; + padding: 0 12px; + height: 100%; +} +.tinycanvas .overview > .column:first-child { + padding-left: 0; + border-left: 0; +} +.toolbar + .tinycanvas, +.s_tab + .tinycanvas { + height: 480px; +} \ No newline at end of file diff --git a/app/assets/stylesheets/desktop_font.css b/app/assets/stylesheets/desktop/desktop-font.css similarity index 100% rename from app/assets/stylesheets/desktop_font.css rename to app/assets/stylesheets/desktop/desktop-font.css diff --git a/app/assets/stylesheets/desktopmain.css b/app/assets/stylesheets/desktop/desktop-main.css similarity index 66% rename from app/assets/stylesheets/desktopmain.css rename to app/assets/stylesheets/desktop/desktop-main.css index f2a5e019..a8ec6829 100644 --- a/app/assets/stylesheets/desktopmain.css +++ b/app/assets/stylesheets/desktop/desktop-main.css @@ -60,14 +60,21 @@ body { } a, a:hover { text-decoration: none; color: #666; } a:focus { outline: none; } +.clear { clear: both; } /* box-sizing element */ -.appholder, .appname { +.w1, .w2, .w4, .wh1, .wh2, .wh3, .w100, .pw, +.h1, .h2, .h4, .hh1, .hh2, .hh3, .ph, +.appholder, +.appname, +.tinycanvas, +.tinycanvas .overview > .column { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } +/* Desktop Global Style */ .admbg { background-color: #fff; } .admbg2 { background-color: #ddd; } .admtxt { color: #666; } @@ -80,6 +87,56 @@ a:focus { outline: none; } position: relative; } .thmtxt { position: relative; } +.ini_input { + margin: 0; + padding: 0; + border: 0; + } +.ini_input:focus { outline: none; } + +/* - Opacity */ +.op10 { opacity: 1; } +.op09 { opacity: 0.9; } +.op08 { opacity: 0.8; } +.op07 { opacity: 0.7; } +.op06 { opacity: 0.6; } +.op05 { opacity: 0.5; } +.op04 { opacity: 0.4; } +.op03 { opacity: 0.3; } +.op02 { opacity: 0.2; } +.op01 { opacity: 0.1; } +.op00 { opacity: 0; } + +/* - box set */ +.w1 { width: 120px; } +.w2 { width: 252px; } +.w4 { width: 512px; } +.wh1 { width: 36px; } +.wh2 { width: 60px; } +.wh3 { width: 84px; } +.w100 { width: 100%; } +.pw { width: 540px; } + +.h1 { height: 120px; } +.h2 { height: 252px; } +.h4 { height: 512px; } +.hh1 { height: 36px; } +.hh2 { height: 60px; } +.hh3 { height: 84px; } +.ph { height: 516px; } + +.hp { padding-left: 12px; padding-right: 12px; } +.vp { padding-top: 12px; padding-bottom: 12px; } +.element { + margin: 0 12px 12px 0; + float: left; + position: relative; + display:inline-block; + } +.group{ + float: left; + margin-right: 24px; +} /* desktop layout */ #container { @@ -88,6 +145,7 @@ a:focus { outline: none; } #header { padding: 0 0 12px 0; min-width: 800px; + height: 72px; } #side { width: 60px; @@ -96,11 +154,9 @@ a:focus { outline: none; } margin-right: 96px; top: 120px; left: 0; - z-index: 10; + z-index: 11; } #holder { - /*overflow: hidden; - overflow-x: auto;*/ height: 516px; width: auto; position: relative; @@ -118,9 +174,7 @@ a:focus { outline: none; } height: 30px; margin: 15px 0 0 15px; } -.docklist { - - } +.docklist {} .docklist li { position: relative; } @@ -145,12 +199,6 @@ a:focus { outline: none; } display: none; } -.ini_input { - margin: 0; - padding: 0; - border: 0; - } -.ini_input:focus { outline: none; } #search_app { position: relative; background-color: #fff; @@ -184,7 +232,76 @@ a:focus { outline: none; } .section_label li { font-size: 15px; } .section_label li:first-child { font-size: 21px; } - +/* panel */ +#panel_l { + background-color: #f0f0f0; + float: left; +} +#panel_r { + margin-left: 252px; + position: relative; +} + +/* Desktop Notification */ +#orbitnote { + position: fixed; + top: 0; + left: 50%; + margin-left: -206px; + z-index: 99999; + width: 400px; + padding: 0 6px 6px 6px; + background-color: #000; + background-color: rgba(0,0,0,0.6); +} +.note_holder { + background-color: #f3f3f3; + border: solid 1px #fff; + border-top: none; + overflow: hidden; + padding: 24px 24px; +} +.note_type { float: left; } +.note_type img { display: block; } +.note_message { + color: #333; + margin: 10px 0 0 48px; + font-size: 15px; +} + +/* Desktop Dialogue */ +#orbitdiag { + position: fixed; + width: 100%; + height: 100%; + left: 0; + top: 0; + z-index: 12; +} +#orbitdiag .tile { background-color: #000; } +.diag_holder { background-color: #000; } +.diag_holder_inner { + width: 600px; + margin: 200px auto 0 auto; + position: relative; + padding: 30px 0; +} +.diag_message { + color: #fff; + font-size: 18px; + padding: 30px 0; +} +.diag_action { clear: both; text-align: right; } +.diag_btn { + display: inline-block; + line-height: 36px; + text-align: center; + font-size: 15px; + margin: 0 6px; +} +.diag_btn:hover { outline: solid 2px #fff; } + +/* Tile */ .appname { font-size: 15px; line-height: 30px; @@ -249,8 +366,6 @@ a:focus { outline: none; } position: relative; z-index: 9; } -/*.section_slc { width: 252px; }*/ - .tile { display: block; width: 100%; @@ -259,86 +374,13 @@ a:focus { outline: none; } left: 0; top: 0; } - -/* panel */ -#panel_l { background-color: #f0f0f0; float: left; } -#panel_r { margin-left: 252px; position: relative;} - -/* simple dropdown menu */ -.sdm { position: relative; } -.sdm_t { - cursor: default; - transition: all 0.3s ease; - -webkit-transition: all 0.3s ease; - -moz-transition: all 0.3s ease; +.widget.gs_w { + cursor: move; } -.sdm:hover .sdm_o { display: block; } -.sdm_o { - display: none; - position: absolute; - z-index: 9; - left: 0; - top: 60px; - font-size: 15px; - } -.sdm_o li { border-top: solid 1px #f2f2f2; } -.sdm_o li:first-child { border: none; } -.sdm_o a { display: block; } -.sdm_o .admtxt { display: block; line-height: 36px; } - -/* with indicator */ -.sdm_mdr .sdm_t { - padding-right: 12px; -} -.sdm_mdr .mdr { - position: absolute; - right: 0; -} - -/* simple menu */ -.s_menu { font-size: 15px; line-height: 36px; } -.s_menu li { border-top: solid 1px #ddd; } -.s_menu li:first-child { border: none; } -.s_menu a { display: block; } - -/* simple tabs */ -.s_tab { font-size: 15px; line-height: 36px; } -.stb_h {} -.stb_v {} -.s_tab ul { overflow: hidden; } -.s_tab li { float: left; } -.s_tab a { display: block; } -.s_tab .admbg { background-color: #f0f0f0; } -.st_c { display: none; } -.st_c:first-child { display: block; } /* header drop menu */ .sdm_mdr .sdm_o { top: 36px; } -/* tool bar */ -.toolbar { - background-color: #f0f0f0; - font-size: 15px; - line-height: 36px; - position: relative; - z-index: 9; -} -.toolbar .sdm, .toolbar .fn_g { display: inline-block; vertical-align: top; } -.toolbar .sdm_o { top: 36px; background-color: #f0f0f0; } -.toolbar button { - border: none; - outline: none; - padding: 0 16px; - margin: 0; - font-family: inherit; - font-size: 15px; - vertical-align: top; -} -.toolbar .fn_btn { - display: inline-block; - vertical-align: top; -} - /* Setting Page */ .theme_list {} .theme_list .ssl_item, .stock_wallpaper .ssl_item { @@ -384,51 +426,7 @@ a:focus { outline: none; } border: 0; } -/* theme color opacity */ -.op10 { opacity: 1; } -.op09 { opacity: 0.9; } -.op08 { opacity: 0.8; } -.op07 { opacity: 0.7; } -.op06 { opacity: 0.6; } -.op05 { opacity: 0.5; } -.op04 { opacity: 0.4; } -.op03 { opacity: 0.3; } -.op02 { opacity: 0.2; } -.op01 { opacity: 0.1; } -.op00 { opacity: 0; } -/* box set */ -.w1 { width: 96px; } -.w2 { width: 228px; } -.w4 { width: 488px; } -.wh1 { width: 30px; } -.wh2 { width: 36px; } -.wh3 { width: 60px; } -.w100 { width: 100%; } -.pw { width: 540px; } - -.h1 { height: 96px; } -.h2 { height: 228px; } -.h4 { height: 488px; } -.hh1 { height: 30px; } -.hh2 { height: 36px; } -.hh3 { height: 60px; } -.ph { height: 516px; } - -.hp { padding-left: 12px; padding-right: 12px; } -.vp { padding-top: 12px; padding-bottom: 12px; } -.element { - margin: 0 12px 12px 0; - float: left; - position: relative; - display:inline-block; - } -.group{ - float: left; - margin-right: 24px; - /*max-width: 800px;*/ - /*max-height:540px;*/ -} .group_search{ float: left; margin-right: 36px; @@ -442,226 +440,6 @@ a:focus { outline: none; } .g_sep { width: 11px; border-left: solid 1px #fff; } -.clear { clear: both; } - -/* tiny scrollbar */ -.tinycanvas { overflow: hidden; position: relative; height: 100%; } -.tinycanvas .viewport { width: auto; height: 100%; overflow: hidden; position: relative; } -.tinycanvas .overview { position: absolute; left: 0; top: 0; min-width: 100%; } -.tinycanvas .scrollbar { position: absolute; z-index: 9; } -.tinycanvas .scrollbar.sb_h { left: 0; bottom: 0; height: 6px; } -.tinycanvas .scrollbar.sb_v { right: 0; top: 0; width: 6px; } -.tinycanvas .track { height: 100%; width: 6px; position: relative; } -.tinycanvas .thumb { height: 6px; width: 6px; cursor: pointer; overflow: hidden; position: absolute; top: 0; } -.tinycanvas .thumb .end { overflow: hidden; height: 6px; width: 6px; } -.tinycanvas .scrollbar.disable{ display: none; } - -/* Orbit Notification */ -#orbitnote { - position: fixed; - top: 0; - left: 50%; - margin-left: -206px; - z-index: 99999; - width: 400px; - padding: 0 6px 6px 6px; - background-color: #000; - background-color: rgba(0,0,0,0.6); -} -.note_holder { - background-color: #f3f3f3; - border: solid 1px #fff; - border-top: none; - overflow: hidden; - padding: 24px 24px; -} -.note_type { float: left; } -.note_type img { display: block; } -.note_message { - color: #333; - margin: 10px 0 0 48px; - font-size: 15px; -} - -/* Orbit Dialogue */ -#orbitdiag { - position: fixed; - width: 100%; - height: 100%; - left: 0; - top: 0; - z-index: 10; -} -#orbitdiag .tile { background-color: #000; } -.diag_holder { background-color: #000; } -.diag_holder_inner { - width: 600px; - margin: 200px auto 0 auto; - position: relative; - padding: 30px 0; -} -.diag_message { - color: #fff; - font-size: 18px; - padding: 30px 0; -} -.diag_action { clear: both; text-align: right; } -.diag_btn { - display: inline-block; - line-height: 36px; - text-align: center; - font-size: 15px; - margin: 0 6px; -} -.diag_btn:hover { outline: solid 2px #fff; } - -/* tinygrid */ -.s_grid_con { width: 410px; } -.s_grid_row { overflow: hidden; margin-bottom: 12px; } -.s_grid_row .s_grid:first-child { margin-left: 0; } -.s_grid { - float: left; - margin: 0 0 0 10px; -} -.s_grid_con .s_grid_1 { width: 60px; } -.s_grid_con .s_grid_2 { width: 130px; } -.s_grid_con .s_grid_3 { width: 200px; } -.s_grid_con .s_grid_4 { width: 270px; } -.s_grid_con .s_grid_5 { width: 340px; } -.s_grid_con .s_grid_6 { width: 410px; } - -/* simple slider */ -/*.s_slider { display: inline-block; float: none; vertical-align: middle; } -.s_slider > .s_grid { display: inline-block; float: none; vertical-align: middle; } -.s_slider_holder { - position: absolute; -} -.s_slider_c { - position: relative; - height: 6px; - background-color: #ddd; - margin-right: 5px; -} -.s_slider_c .ui-slider-handle { - position: absolute; - width: 10px; - height: 16px; - margin: -5px 0 0 0; - background-color: #333; -} -.s_slider_c .ui-slider-range { - position: absolute; - top: 0; - height: 100%; - background-color: red; - display: block; -}*/ - -/* simple form */ - -.s_form { font-size: 15px; } -.s_form li { overflow: hidden; padding: 6px; margin-bottom: 12px; position: relative; } -.s_form .s_grid_row { padding: 3px; margin-bottom: 6px; } -.s_form label { - font-size: 13px; - display: inline-block; - vertical-align: middle; - width: 100px; - margin-right: 24px; - color: #777; -} -.s_form input[type=text], .s_form input[type=password], .s_form textarea{ - outline: solid 3px #f6f6f6; - border: solid 1px #eee; - font-size: 15px; - font-family: Arial !important; - margin: 0; - padding: 6px; - transition: all 0.3s ease; - -webkit-transition: all 0.3s ease; - -moz-transition: all 0.3s ease; -} -.s_form select { font-family: Arial !important; padding: 6px; height: auto; } -.s_form input[type=file] { margin: 0px; vertical-align: baseline; } -.s_form input[type=text]:focus, .s_form input[type=password]:focus, .s_form textarea:focus { - background-color: #333; - color: #fff; -} -.s_form textarea { resize: none; } -.check_box_g { - padding: 4px 8px; - outline: solid 1px #eee; -} -.check_box_g > label { - font-size: 15px; - display: block; - padding: 4px 0; -} -.check_box_g li { - margin: 0 6px 6px 0; - padding: 0; -} -.check_box_g li, .check_box_g li > * { - display: inline-block; - vertical-align: middle; -} -.check_box_g label { - width: auto; - margin: 0; -} -.check_box_g li label { padding-left: 4px; font-family: Arial; } -.s_form .input_append { - position: absolute; - width: 30px; - height: 30px; - line-height: 30px; - right: 5px; - top: 5px; - display: block; - background-color: #fff; -} -.s_form.s_grid_con { width: 416px; } -.s_form .s_grid_row { width: 410px; } -.s_form .s_grid_row .s_grid:first-child { margin-left: 0; } -.s_form input[type=text].s_grid, .s_form input[type=passowrd].s_grid, .s_form textarea.s_grid, .s_form label.s_grid, .s_form select.s_grid { /*float: none; display: inline-block;*/ margin-left: 10px; } -.s_form input[type=text].s_grid_1, .s_form input[type=passowrd].s_grid_1, .s_form textarea.s_grid_1 { width: 46px; } -.s_form input[type=text].s_grid_2, .s_form input[type=passowrd].s_grid_2, .s_form textarea.s_grid_2 { width: 116px; } -.s_form input[type=text].s_grid_3, .s_form input[type=passowrd].s_grid_3, .s_form textarea.s_grid_3 { width: 186px; } -.s_form input[type=text].s_grid_4, .s_form input[type=passowrd].s_grid_4, .s_form textarea.s_grid_4 { width: 256px; } -.s_form input[type=text].s_grid_5, .s_form input[type=passowrd].s_grid_5, .s_form textarea.s_grid_5 { width: 326px; } -.s_form input[type=text].s_grid_6, .s_form input[type=passowrd].s_grid_6, .s_form textarea.s_grid_6 { width: 396px; } -.s_form select.s_grid_1 { width: 60px; } -.s_form select.s_grid_2 { width: 130px; } -.s_form select.s_grid_3 { width: 200px; } -.s_form select.s_grid_4 { width: 270px; } -.s_form select.s_grid_5 { width: 340px; } -.s_form select.s_grid_6 { width: 410px; } -.s_form label.s_grid { line-height: 34px; } -.s_form select.s_grid { - height: 26px; - margin-top: 4px; - margin-bottom: 4px; -} -.s_form textarea.full_height { - height: 436px; -} -.s_form .s_table { - width: 100%; -} -.s_form .s_table th, .s_form .s_table td { - padding: 6px 0; -} -.s_form .s_table th { - text-align: left; -} -.s_form .s_table td { - vertical-align: middle; -} -.s_form .s_table thead th { - border-bottom: solid 1px #eee; -} - - #group_wrapper {} .grp { height:528px; } .g_col { @@ -730,7 +508,6 @@ a:focus { outline: none; } } /* Journal Papers */ -#paper_list, #paper_add { height: 456px; } #paper_list .g_col { width: 410px; height: 456px; @@ -925,7 +702,7 @@ a:focus { outline: none; } left: 0; right: 0; bottom: 0; - z-index: 9; + z-index: 12; } .app_frame .app_holder { background-color: #fff; diff --git a/app/assets/stylesheets/desktopmedia.css b/app/assets/stylesheets/desktop/desktop-media.css similarity index 100% rename from app/assets/stylesheets/desktopmedia.css rename to app/assets/stylesheets/desktop/desktop-media.css diff --git a/app/assets/stylesheets/orbitTimeline.css.erb b/app/assets/stylesheets/desktop/desktop-timeline.css.erb similarity index 100% rename from app/assets/stylesheets/orbitTimeline.css.erb rename to app/assets/stylesheets/desktop/desktop-timeline.css.erb diff --git a/app/assets/stylesheets/style.css.erb b/app/assets/stylesheets/style.css.erb index 48f79d2a..d28c86e1 100644 --- a/app/assets/stylesheets/style.css.erb +++ b/app/assets/stylesheets/style.css.erb @@ -1,6 +1,5 @@ /*style*/ -/*@import url(http://fonts.googleapis.com/css?family=Cuprum);*/ @font-face{ font-family: 'WebSymbolsRegular'; src: url(<%= asset_path 'websymbols-regular-webfont.eot' %>); diff --git a/app/views/desktop/allsections.html.erb b/app/views/desktop/allsections.html.erb index 0d168253..414504c2 100644 --- a/app/views/desktop/allsections.html.erb +++ b/app/views/desktop/allsections.html.erb @@ -1,7 +1,7 @@
    -