/** * EGroupware: Stylite Pixelegg template - mobile theme * * Please do NOT change css-files directly, instead change less-files and compile them! * * @link http://www.egroupware.org * @license http://opensource.org/licenses/gpl-license.php GPL - GNU General Public License * @author Hadi Nategh * @package pixelegg * @version $Id$ */ @import "pixelegg.less"; @import (reference) "../less/def_mobile.less"; /********************************/ /* */ /* MEDIA DEFINITION */ /* */ /********************************/ /*Tablets Max-Width*/ @tablet-max: 1024px; /*Smartphones Max-Width*/ @smartphone-max: 700px; /*Smartphones Min-Width*/ @smartphone-min: 321px; @handheld: ~"only screen and (max-device-width : @{tablet-max})"; /*All devices portrait mode*/ @handheld-portrait: ~"only screen and (max-device-width : @{tablet-max}) and (orientation : portrait)"; /*All devices landscape mode*/ @handheld-landscape: ~"only screen and (max-device-width : @{tablet-max}) and (orientation : landscape)"; /*Tablets landscape mode*/ @tablet-portrait: ~"only screen and (max-device-width : @{tablet-max}) and (min-width: @{smartphone-max}) and (orientation : landscape)"; /*Tablets Portrait*/ @tablet-portrait: ~"only screen and (max-device-width : @{tablet-max}) and (min-width: @{smartphone-max}) and (orientation : portrait)"; /*Smartphones*/ @smartphones: ~"only screen and (max-device-width: @{smartphone-max}) and (min-width: @{smartphone-min})"; @media all { body{ .pt-page-moveToLeft { -webkit-animation: moveToLeft .6s ease both; animation: moveToLeft .6s ease both; } .pt-page-moveFromLeft { -webkit-animation: moveFromLeft .6s ease both; animation: moveFromLeft .6s ease both; } .pt-page-moveToRight { -webkit-animation: moveToRight .6s ease both; animation: moveToRight .6s ease both; } .pt-page-moveFromRight { -webkit-animation: moveFromRight .6s ease both; animation: moveFromRight .6s ease both; } @-webkit-keyframes moveToLeft { from { } to { -webkit-transform: translateX(-100%); } } @keyframes moveToLeft { from { } to { -webkit-transform: translateX(-100%); transform: translateX(-100%); } } @-webkit-keyframes moveFromLeft { from { -webkit-transform: translateX(-100%); } } @keyframes moveFromLeft { from { -webkit-transform: translateX(-100%); transform: translateX(-100%); } } @-webkit-keyframes moveToRight { from { } to { -webkit-transform: translateX(100%); } } @keyframes moveToRight { from { } to { -webkit-transform: translateX(100%); transform: translateX(100%); } } @-webkit-keyframes moveFromRight { from { -webkit-transform: translateX(100%); } } @keyframes moveFromRight { from { -webkit-transform: translateX(100%); transform: translateX(100%); } } background-color: transparent; // iOS appHeader class div.egw_fw_mobile_iOS_popup_appHeader{ padding-top:15px; } div.egw_fw_mobile_popup_appHeader { display: none !important; height: 32px !important; background-size : 2px; font-size: 150% !important; border-bottom: 3px solid #679fd2 !important; border-top: none !important; width: 100%; line-height: 32px !important; } //################### //# # //# Grid & NM # //# # //################### table.egwGridView_outer{ thead{ tr{ th{ font-size: small !important; } } } tbody{ tr{ touch-action:initial; td time, td.et2_date , td.et2_date_ro{ float: right; .mob-fontsize-s; } td { position: relative; .mobile_cat_col { position: absolute; min-height: 100%; bottom:0; top:0; width:10px; display: block; } span.cat_.mobile_cat_col { background: #F5F5F5; } } } } } } #egw_fw_basecontainer{ background:white; #egw_fw_main { #egw_fw_tabs { margin-top:-3px; } } //################### //# # //# TOOLBAR # //# # //################### #egw_fw_top_toolbar{ div.egw_fw_ui_tabs_header{ max-height: 60px; width: 60%; margin-left: 0; overflow-x: scroll; position: initial; white-space: nowrap; position: fixed; left: 83%; top: 15px; height: 50px; span{ margin:0; overflow: visible; height:38px; width:50px; border-width: 1px 1px 1px 1px; border:none; border-radius: 10px; img{ height:32px !important; width:32px !important; } h1{ display:none; } } } } .egw_fw_top_toolbar>div:hover{ -webkit-box-shadow: none; -moz-box-shadow: none; box-shadow: none; } //FW Menu div#egw_fw_menu{ background-image: url(../images/topmenu_items/mobile/menu_active.png); cursor: pointer; position: fixed; left: 13px; top: 13px; width: 65px; height: 50px; background-size: 32px 32px; background-repeat: no-repeat; z-index: 999; &:hover { -webkit-box-shadow: none; -moz-box-shadow: none; box-shadow: none; } &:focus { outline: none; } } div#egw_fw_menu:active { -webkit-box-shadow: none; -moz-box-shadow: none; box-shadow: none; } div#egw_fw_topmenu_items{ width: 280px; display: inline; float: left; position: fixed; padding-left: 55px; padding-top: 13px; ul{ display:inline; padding:0; margin:0; list-style-type: none; li{ display: -webkit-inline-box; display: -moz-inline-box; display: inline-block; padding:2px; &:hover { -webkit-box-shadow: none; -moz-box-shadow: none; box-shadow: none; } } a#topmenu_logout{ &:before { content: ""; background-image: url(../images/logout.png); background-repeat: no-repeat; width: 32px; height: 32px; background-size: 24px 24px; display: inline-block; background-position: center; } } a#topmenu_home:before { content: " "; background-image: url(../images/topmenu_items/mobile/home.png); background-repeat: no-repeat; width: 32px; height: 32px; background-size: 24px 24px; /*display:inline-block;*/ display:none; } a#topmenu_prefs { &:before { content: ""; background-image: url(../images/topmenu_items/mobile/setup.png); background-repeat: no-repeat; width: 32px; height: 32px; background-size: 24px 24px; display: inline-block; background-position: center; } } a#topmenu_acl:before { content: ""; background-repeat: no-repeat; width: 32px; height: 32px; background-size: 24px 24px; background-image: url(../images/topmenu_items/mobile/access.png); display: inline-block; background-position: center; } a#topmenu_cats:before { background-image: url(../images/topmenu_items/mobile/category.png); content: ""; background-repeat: no-repeat; width: 32px; height: 32px; background-size: 24px 24px; display: inline-block; background-position: center; } a#topmenu_password:before { background-image: url(../images/topmenu_items/mobile/password.png); content: ""; background-repeat: no-repeat; width: 32px; height: 32px; background-size: 24px 24px; display: inline-block; background-position: center; } a#topmenu_manual:before { background-image: url(../images/topmenu_items/mobile/help.png); content: ""; background-repeat: no-repeat; width: 32px; height: 32px; background-size: 24px 24px; display: inline-block; } a#topmenu_search{ &:before { background-image: url(../images/topmenu_items/mobile/search.png); content: ""; background-repeat: no-repeat; width: 32px; height: 32px; background-size: 24px 24px; display: inline-block; background-position: center; } } } } }//End of toolbar // ######################tabs header ########################## // # # # # # # # # # #### // # # # # # # # # # #### // # tab header # # # # # # # #### // # # # # # # # # # #### // ############################################################ // Div Tabs .egw_fw_ui_tabs_header { margin: 0px 0 0 0; padding: 1px 1px 0px 0px; background-position: bottom; background-repeat: repeat-x; background-color: transparent; height: 34px; h1 { display: inline; width: 100%; text-align: center; -webkit-margin-before: 0; -webkit-margin-after: 0; } img{ text-align:center; float: none; margin: 0 auto; .dimension_width_height_l; } // Tab // ########## // # # // # # // ########## // Inactive .egw_fw_ui_tab_header { padding-left: 0; position: relative; background: transparent; display: inline-block; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; margin: 0px 5px 0px 0px; padding: 2px 5px 7px 2px; cursor: pointer; background-repeat:repeat-x; height: 38px; width: 97%; &:hover { background-color: none !important; } &:active { -webkit-box-shadow: 3px 3px 3px rgba(0, 0, 0, 0.6); -moz-box-shadow: 3px 3px 3px rgba(0, 0, 0, 0.6); box-shadow: 3px 3px 3px rgba(0, 0, 0, 0.6); } // APP Name h1 { .fontsize_xl; line-height: 1em; margin:0 15px 2px 2px; vertical-align: super; padding-left: 25px; } // Images img.egw_fw_ui_tab_icon { display: inline-block; .dimension_width_height_l; margin: 5px 1px 0 1em; .img_filter_gray; } // FOR SVG IMG object { .dimension_width_height_l; margin: 8px 1px 0 5px; .border_radius(5px,0, 0, 5px); } } // ########## // # # // # # // ########## /*Active Tabs*/ .egw_fw_ui_tab_header_active { border-width: 1px 1px 0px 1px !important; .background_color_egw_light; &:hover {.background_color_egw_light ;} // Active image img.egw_fw_ui_tab_icon { display: inline-block; .dimension_width_height_l; -webkit-filter: contrast(2); -ms-filter:contrast(2); -moz-filter:contrast(2); -o-filter:contrast(2); } /*Active object*/ object { .dimension_width_height_l; margin: 0px 1px 0 5px; .border_radius(2px,0, 0, 2px); background-color: @gray_30; } } } //################### //# # //# SIDEBAR # //# # //################### #egw_fw_sidebar{ top: 76px; bottom: 5px; //SIDE AREA #egw_fw_sidemenu { position: absolute; top: 0px; bottom: 4px; left: 0; right: 0; overflow-y: auto; z-index: 0; padding-top: 0.6em; font-size: 0.9em; //#################################################### // All Tabs .egw_fw_ui_sidemenu_entry_header { display: block; margin: 0 0; &:hover { .background_color_15_gray; .rounded(5px); } &:active {.box_shadow_standard_light_inset;} h1 { margin: 0 0 10px 0; padding-top: 0.31em; padding-left: 3em; .color_40_gray; .fontsize_xl; line-height: 17px; } object {background-color: @gray_0; .dimension_width_height_m;} } // #################################### // #### # // ### IMG | ADD NAME # // ### # // ### # // #################################### // Active APP // Active Tab // rounded Corner Left Top .egw_fw_ui_sidemenu_entry_header_active { // cursor: pointer; background-image: url("../images/clear.png"); background-position: 95% -3000px; background-repeat: no-repeat; .background_color_10_gray; .bordered (@gray_30, @gray_30, @gray_30, @gray_30); margin: 0 0 0 0; border-bottom: none; height: 33px; img {padding-left: 9px; padding-top: 6px; height: 18px;} h1 {text-transform: uppercase; font-size: 1.4em; .color_100_gray; padding-top: .8em;} &:hover {.box_shadow_standard_light_hover; .border_radius ( 5px, 0px, 0px, 27px );} &:active {.box_shadow_standard_light_active; .border_radius ( 5px, 0px, 0px, 27px );} &:focus { background-image: url("../images/ajax-loader.gif"); background-repeat: no-repeat; background-position: 90% 50%; .Complete_Button_active; .background_color_25_gray; } object { margin-left: 14px; margin-top: 8px; .rounded (3px); .dimension_width_height_s; } .egw_fw_ui_ajaxloader {margin-top: -26px;} } //#################################################### // egw_fw_ui_sidemenu_entry_content // ######################################## // ## ## // ## ## // ######################################## // ######################################## // ## ## // ## ## // ######################################## // ######################################## // ## ## // ## ## // ######################################## // ######################################## // ## div.egw_fw_ui_category ## // ## &:nth-last-of-type(-n+3) ## // ##################################### .egw_fw_ui_sidemenu_entry_content { display: block; background-image: none; .border_radius (0, 0, 0px, 0); border-color: @gray_30; border-style: solid; border-width: 0px; margin: 0 0 2em 0; // rounded Corner on bottom &:nth-last-of-type(-n+3) { padding: 5px 0.3em 1.5em 0.3em; margin: 0 0 10px 0; .background_color_30_gray; border-color: @gray_30; } & > div {.background_color_30_gray;} //################################################### // has round corners div.egw_fw_ui_category:nth-last-of-type(-n+3) { } //################################################### // Normal .egw_fw_ui_category { margin: 4px 5px 5px 5px; padding: 0.5em 1em 0.5em 0; cursor: pointer; // border-top: 7px solid; border-color: @gray_30; background-color: @gray_10; .border_radius(3px,3px,3px,3px); h1 { margin: 5px 0px 3px 5px; padding: 0px 0px 0px 15px; line-height: 1em; .fontsize_l; background-image:url(../images/arrow_left.png); background-repeat:no-repeat; background-position:left center; } div.egw_fw_ui_category:nth-last-of-type(-n+3) { img.egw_fw_ui_sidemenu_listitem_icon { display: block; } } } div.egw_fw_ui_category_content { border-radius: 0; } //################################# // Hover // on Mouse over change color .egw_fw_ui_category:hover { .background_color_40_gray; padding: 0.5em 1em 0.5em 0; } /*######################*/ // Active State // change Background color in Blue // See all Elements .egw_fw_ui_category_active { border-bottom-width: 0px; margin-top: 4px; background-color: @egw_color_2_a; .color_5_gray; .border_radius(3px,3px,3px,3px) !important; h1 { background-image:url(../images/arrow_down.png); line-height: 1em; font-size: 12px; a { color: #FFF; img {.dimension_width_height_s;} &:hover { padding: 5px 30px 5px 0px; width: 200px; .background_color_10_gray; .color_50_gray; .Complete_Button_hover; } } } &:hover {background-color: @egw_color_2_d; .transition (0.2s, ease-out);} } } .egw_fw_ui_sidemenu_entry_content_bottom { border-width: 0px 1px 1px 1px; } .egw_fw_ui_sidemenu_entry_header_bottom { border-width: 0px; border-color: @gray_0; } .egw_fw_ui_sidemenu_entry_icon { display: inline-block; .dimension_height_m; padding-left: 0; padding-right: 0px; float: left; /*filter grey*/ .img_filter_gray; } } // SIDEMENU End }//End of Sidebar //ToggleClass .sidebar-toggle{ #egw_fw_top_toolbar div#egw_fw_menu{ } #egw_fw_sidebar{ #egw_fw_sidemenu{ width:82px !important; .egw_fw_ui_sidemenu_entry_content, .egw_fw_ui_sidemenu_entry_header{ display:none !important; } .egw_fw_ui_sidemenu_entry_header{ height: 38px; width: 54px; text-overflow: ellipsis; border-radius: 0px 15px 15px 0px; img{ src: url(../images/topmenu_items/setup.png) !important; height:32px !important; width:32px !important; } } .egw_fw_ui_tabs_header{ span{ margin:0px 5px 0px 2px; overflow: visible; height:38px; width:50px; border:none; border-radius: 10px; img{ height:32px !important; width:32px !important; } h1{ display:none; } } } #egw_fw_splitter, .egw_fw_ui_sidemenu_entry_header_active h1{ display:none; } } } #egw_fw_topmenu_items { display:none !important; } } //################################### //# # //# FOOTER # //# # //################################### #egw_fw_footer { display:none; } //################################### //# # //# APP HEADER NAVIGATOR # //# # //################################### .egw_fw_ui_app_header_container { display:none; } .egw_fw_content_browser_div { padding: 0; background-color: white; } //################################### //# # //# POPUP FRAME # //# # //################################### .egw_fw_mobile_popup_container{ width:100%; height:100%; position:fixed; display: none; z-index: 999; -webkit-overflow-scrolling: touch; overflow-y:scroll; .egw_fw_mobile_popupFrame { width: 100%; height: 100%; visibility: hidden; } span.egw_fw_mobile_popup_close { width: 50px; height: 50px; float:left; background-image: url('../images/cancelled.png');/*url(../images/topmenu_items/mobile/menu_active.png);*/ -webkit-filter: contrast(2); background-repeat: no-repeat; z-index: 1000; padding-right: 5px; top:2px; left: 10px; background-position: 3px 7px; position: absolute; } span.egw_fw_mobile_popup_close.loaded { &:after { content: "\2190"; font-size: 24pt; color: white; padding-left: 5px; font-weight: bold; } background-image: none; } } //################################### //# # //# popup dialog headbar # //# # //################################### .dialogHeadbar { height: 50px; box-shadow: 0px 4px 5px 2px silver; position: fixed; width: 100%; background: #0c5da5; top:0; right:0; z-index:1; .et2_button_with_image, .et2_button_text { height: 46px; margin: 1px; margin-left: 3px; } td { margin-left:70px; display: block; } } //################################### //# # //# Mail App specific style # //# # //################################### #mail-display { min-height: initial !important; .mailDisplayContainer { top:140px; } } } @media @handheld { #egw_fw_print { display:none; } div#loginMainDiv{ #divAppIconBar { #divLogo img[src$="svg"] { width:40%; margin-top: 5px; } } div#centerBox{ position:absolute; margin: 0; width: 100%; padding: 0; -webkit-border-top-right-radius: 0; -webkit-border-bottom-right-radius:0; -webkit-border-bottom-left-radius: 0; -webkit-border-top-left-radius: 0; -moz-border-radius-topright: 0; -moz-border-radius-bottomright: 0; -moz-border-radius-bottomleft: 0; -moz-border-radius-topleft: 0; border-top-right-radius: 0; border-bottom-right-radius: 0; border-bottom-left-radius: 0; border-top-left-radius: 0; background-color: none; background-image: none; background-image: none; background-image: none; background-image: none; background-image: none; background-image: none; background-image: none; background-repeat: none; border:none; border-radius: none; form { margin-top: -2em; table.divLoginbox { width:100%; float:left; tr.hiddenCredential { display:none; } input[type="submit"] { font-size: large; } input, select { width:100%; height:50px; } td { font-size: large; padding:0.8%; &.registration{ font-size: 180%; } select { background-size: 48px auto; } } } } #loginCdMessage { font-size:large; padding:0; } } } } @media @handheld-portrait { body{ div#loginMainDiv{ #divAppIconBar { #divLogo img[src$="svg"] { width:70%; } } div#centerBox{ form { table.divLoginbox { width:100%; float:left; input[type="submit"] { font-size: large; } input, select { width:100%; height:50px; } td { font-size: large; padding:0.8%; &.registration { font-size: 250%; } } } } #loginCdMessage { font-size:large; padding:0; } } } } } @media @smartphones { body{ #egw_fw_basecontainer.sidebar-toggle { div#egw_fw_top_toolbar { z-index: 0; } #egw_fw_main { margin-left:0 !important ; #egw_fw_tabs { -webkit-filter: none; -moz-filter: none; -ms-filter: none; -o-filter: none; filter: none; } } } #egw_fw_basecontainer { #egw_fw_top_toolbar { z-index: 998; width: 300px; background: white; div#egw_fw_topmenu_items{ width: 245px; display: inline; float: left; position: fixed; padding-left: 55px; padding-top: 13px; background:white; height:100%; z-index:998; border-right:2px solid silver; } } #egw_fw_sidebar { z-index: 999; background:white; } #egw_fw_main { #egw_fw_tabs { -webkit-filter: brightness(20%); -moz-filter: brightness(20%); -ms-filter: brightness(20%); -o-filter: brightness(20%); filter: brightness(20%); } } } } } /*mobile etemplate2*/ /*mobile etemplate2*/ @mobile-elem-height: 50px; @mobile-button-width: 50px; @mobile-nm-search-bg: #0c5da5; @media only screen and (min-width: 320px) and (max-width: 1290px) { body { #egw_fw_basecontainer.sidebar-toggle { #egw_fw_top_toolbar { div#egw_fw_menu { background-image: url(../images/topmenu_items/mobile/menu_white.png); width: 65px; height: 50px; background-color: transparent; top: -3px; background-position: 15px center; background-size: 24px 24px; left: 0; } } } #egw_fw_basecontainer { .egw_fw_ui_tabs_header .egw_fw_ui_tab_header img.egw_fw_ui_tab_icon { width:18px; height:18px; } #egw_fw_top_toolbar { div#egw_fw_menu { background-size: 24px 24px; } div#egw_fw_topmenu_items { padding-top: 8px; } } } //################### //# # //# CONTEXT MENU # //# # //################### div.dhtmlxMenu_egw_SubLevelArea_Polygon { font-size:medium; top:50px !important; right:0px; left:auto !important; background-color: white; } div#egw_message { bottom: 0px; top: auto; left: 0px; right: 0px !important; max-width: 100%; border-radius: 0; } div.ui-dialog { width:100% !important; height:100% !important; left:0 !important; top:0 !important; } button.plus_button { position: absolute !important; right: 15px; bottom: 15px; border-radius: 50%; width: 60px; height: 60px; background-position: center; z-index: 100; background-color: #0c5da5; border: none; box-shadow: 0px 1px 5px 3px silver; background-image: none !important; margin: 0; padding: 0; &:after { content: '+'; font-weight: bold; font-size: 34pt; color: #fafafa; } &:hover, &:active { background-color: #0c5da5; } } .et2_nextmatch { .nextmatch_header_row, .nextmatch_header { background-color: background-color-egw-dark; select { display: block; width: 100%; height: @mobile-elem-height; .mob-fontsize-l; background-size: 32px; border-left: none; border-right: none; border-radius: 0; border-bottom: none; padding-left:10px; max-width:none; } label { display:block; width: 100%; float: left; .mob-fontsize-l; select { display: inline-block; float: right; margin: 0; height: @mobile-elem-height; .mob-fontsize-l; } } } .nextmatch_header.nm_header_hide { display:none !important; } .nextmatch_header { background-color: white; padding:0; display:inline-block; width:100%; border-bottom: 1px solid silver; border-top: none; box-shadow: 0px 1px 1px 1px silver; z-index: 1; position: relative; div.et2_box_widget { display:block; height:@mobile-elem-height; } .et2_button { width:@mobile-button-width; height: @mobile-elem-height; } } .egwGridView_outer { thead { tr { visibility:hidden; th{ } } } } .search.searchOn { input { border:none; background: white; outline: none; position: absolute; left: 110px; width:80%; height:@mobile-elem-height; } button[id$="search_button"] { background-image: none !important; &:after{ content:"\2613"; font-weight: bold; font-size:18pt; } } } .search { background: @mobile-nm-search-bg; margin-top: 0; padding-left: 60px; box-shadow: 0px 4px 5px 2px silver; position: relative; z-index: 1; button { height: @mobile-elem-height; width: @mobile-button-width; background-repeat: no-repeat; font-size:large; background-color: @mobile-nm-search-bg; border: none; margin:0; color: white; background-size: 18px 18px; box-shadow: none; outline: none; } button.nm_toggle_header { background-position: center; background-repeat: no-repeat; margin-right:5px; border-left:1px solid silver; border:0; color: white; width:50px; height:50px; display:block; float:right; &:focus{ outline:none; } &:after{ font-size: 18pt; content:"\2261"; } } button.nm_action_header { background-position: center; background-repeat: no-repeat; margin-right:5px; border-left:1px solid silver; border:0; color: white; width:50px; height:50px; display:block; float:right; &:focus{ outline:none; } &:after{ font-size:18pt; content:"\205D"; font-weight: bold; } } div.nm_favorites_div { background-position: center; background-repeat: no-repeat; margin-right:5px; border-left:1px solid silver; border:0; color: white; width:50px; height:50px; display:block; float:right; &:focus{ outline:none; } div[name="favorite"] { position:relative !important; top:0 !important; outline:none; .et2_dropdown { button:first-child { display: none; } button:nth-child(2) { div:first-child { display: none; } &:after{ font-size: 17pt; content: "\2606"; font-weight: bold; vertical-align: super; } } } ul.favorites { width:160px; box-shadow: 0px 4px 5px 2px silver; border: 1px solid silver; li.ui-menu-item { white-space: nowrap; text-overflow: ellipsis; overflow: hidden; border-bottom: 1px solid silver; a { width: 100%; line-height: 30px; input{ display: none; } div.ui-icon-trash { display: block; } } } } } } button.nm_toggle_header_on { &:after { content:"\2613"; } } input[type="search"] { width: 50px; height: @mobile-elem-height; font-size: large; margin:0; border:0; opacity: 0; background-color:@mobile-nm-search-bg; color: black; position: absolute; &:active{ border:none; background: @mobile-nm-search-bg; } &:focus { border:none; background:white; outline: none; opacity: 1; left:110px; position: absolute; width:100%; height:@mobile-elem-height; z-index: 2; } } } .header_row_right { div[id$=favorite_wrapper] { margin:0; top:0 !important; height:@mobile-elem-height; } height: @mobile-elem-height; width: 100%; padding:0; * { display:inline-block; float:left; } .et2_dropdown { button { height:@mobile-elem-height; width: @mobile-button-width; } } } .header_count { margin:0; height:@mobile-elem-height; font-size: large; margin-top: -3px; margin-right: 0px; float:right; border: none; border-radius:0; border-left:1px solid rgba(0, 0, 0, 0.15); } table.egwGridView_grid { tr { div.h2_hbox { padding-bottom: 4px; } img { height: 12px; } } tbody { tr.focused { background-image: none; } tr.selected { background: rgba(255, 194, 0, 0.5) !important; } tr { &:hover { background: transparent; } td { padding: 10px 0px 10px 0px; .et2_label, .et2_button, .et2_link, .et2_textbox, .et2_textbox_ro, .et2_email, img, span{ padding: 8px 0px 0px 0px; } time.et2_label, span.mobile_cat_col { padding: 0; } div.et2_progress { margin:0; } } } tr.swipe{ background-color:rgba(255, 194, 0, 1); border:none; } } } .egwGridView_outer { width: 100%; thead{ max-height: 1px; display: none; } thead tr th { font-size: large; } td { img{ border:none; } } } } .dtree { img { width:24px !important; height:24px !important; } table , tr, td { padding: 2px; padding-left: 0; padding-right: 0px; } .containerTableStyle { overflow: auto; } } .et2_details { .et2_details_toggle { &:after{ width:25px; height: 25px; font-size: 18pt; text-align: center; } } } input { border:none; border-bottom: 1px solid #e6e6e6; } #popupMainDiv { * { .mob-fontsize-n; font-family: Verdana, "Lucida Grande", Helvetica, Sans-Serif; } .et2_textbox, .et2_date, .et2_dropdown, .et2_link, .et2_label, input{ height:25px; } .et2_button_with_image, .et2_button_text { height: 46px; margin: 1px; margin-left: 3px; } form { margin-top: 50px; } .et2_details.et2_details_expanded { background-color: transparent; .et2_details_title { display: inline-block; background-color: #F0F0F0; width:100%; padding-top: 6px; } .et2_details_toggle { } } .et2_details { position: relative; background-color: #F0F0F0; .et2_details_toggle { position: absolute; right: 2px; top:0px; margin: 0px; } .et2_details_title { padding-top: 6px; margin-top:0; } } } .rowHeader { .mob-fontsize-l; } .et2_fullWidth { input[type="radio"] { width: auto; } } //########################################### //# # //# et2_toolbar styles used in headbar # //# # //########################################### div.et2_toolbar.et2_head_toolbar { background-color: transparent; padding: 1px 5px 5px 10px !important; button { width:46px; height:46px; background-size: 18px 18px; } div.ui-toolbar-menulist { min-width: 200px; } button.et2_toolbar_hasCaption { width:auto; } div.et2_toolbar_actionlist { margin-left: 50px; } div.et2_toolbar_more { h.ui-state-hover { background:none; } h.ui-toolbar-menulistHeader { color:transparent; border: none; height: 46px; width: 35px; padding: 0 !important; margin-right: 15px; margin-top: -7px; &:hover { } &:after { font-size:18pt; content:"\205D"; font-weight: bold; color:white; } } span { display: none; } } } //########################################### //# # //# et2_tabbox styles # //# # //########################################### .et2_tabbox.vertical { .et2_tabflag { border:none; div.et2_tabtitle { background-color: #f0f0f0; &:before { padding: 0; width:30px; height:30px; text-align: center; font-size: 18pt; } } } } .et2_link_to { div { height:40px; padding-bottom: 3px; width: 99% !important; } .et2_file { margin: 0; padding:0; .et2_file_span, .et2_file_spanHover, .et2_file_upload { height:25px !important; } } } } }