extern/egroupware
1
0
Fork 1
mirror of https://github.com/EGroupware/egroupware.git synced 2025-06-26 04:41:41 +02:00
Code Issues Packages Projects Releases Wiki Activity

Better styling toolbar widget and toolbar in calendar

Browse Source
This commit is contained in:
Hadi Nategh 2016-01-11 19:38:03 +00:00
parent 536c32d8f8
commit 87fca58c0b
5 changed files with 57 additions and 54 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

30
calendar/templates/default/app.css
View File

@ -1010,27 +1010,17 @@ img.calendar_print_button, img.calendar_print_appicon {
/*weekend slideSwitch in toolbar*/ /*weekend slideSwitch in toolbar*/
#calendar-toolbar_toolbar .et2_checkbox_slideSwitch .slideSwitch_container{ #calendar-toolbar_toolbar .et2_checkbox_slideSwitch .slideSwitch_container{
width: 65px; width: 44px;
height: 16px;
border-radius: 0;
border: none;
background-color: #FFFFFF;
box-shadow: inset 0 2px 6px rgb(71, 71, 71), 0 1px 0 rgba(255, 255, 255, 0.2);
margin:0;
} }
#calendar-toolbar_toolbar .et2_checkbox_slideSwitch .slideSwitch_container a{
background-color: #515151; div.egw_fw_content_browser_div, #calendar-toolbar_app_header, div.egw_fw_ui_app_header_container {
border:none; background-color: #FAFAFA;
} }
#calendar-toolbar_toolbar .et2_toolbar_actionlist span.et2_checkbox_slideSwitch { #calendar-toolbar_app_header {
padding-right: 0; font-weight: bold;
color: #616161;
} }
#calendar-toolbar_toolbar span.et2_checkbox_slideSwitch > span.slideSwitch_container > span:first-child { #calendar-toolbar_toolbar .et2_toolbar_more {
color: #C0C0C0; margin-top: 0;
}
#calendar-toolbar_toolbar span.et2_checkbox_slideSwitch.switchOn > span.slideSwitch_container > span:first-child{
color: white;
}
#calendar-toolbar_toolbar span.et2_checkbox_slideSwitch.switchOn > span.slideSwitch_container> span:nth-child(2) {
color:#C0C0C0;
} }

2
etemplate/js/et2_widget_toolbar.js
View File

@ -69,7 +69,7 @@ var et2_toolbar = et2_DOMWidget.extend([et2_IInput],
//actionbox is the div for stored actions //actionbox is the div for stored actions
this.actionbox = $j(document.createElement('div')) this.actionbox = $j(document.createElement('div'))
.addClass("et2_toolbar_activeList") .addClass("et2_toolbar_more")
.attr('id',this.id +'-'+ 'actionbox'); .attr('id',this.id +'-'+ 'actionbox');
//actionlist is div for active actions //actionlist is div for active actions
this.actionlist = $j(document.createElement('div')) this.actionlist = $j(document.createElement('div'))

66
etemplate/templates/default/etemplate2.css
View File

@ -1519,10 +1519,18 @@ div.ms-sel-ctn .ms-sel-item {
margin: 0 !important; margin: 0 !important;
padding: 0 !important; padding: 0 !important;
} }
.et2_toolbar .et2_toolbar_actionlist button.et2_button_with_image {
width: 24px;
background-position: center;
background-size: 16px 16px;
border-radius: 3px;
padding-left: 0;
}
.et2_toolbar button { .et2_toolbar button {
margin:1px; margin:1px;
margin-right: 3px; margin-right: 3px;
height: 24px; height: 24px;
} }
.et2_toolbar button.toolbar_toggled { .et2_toolbar button.toolbar_toggled {
background-color: white; background-color: white;
@ -1601,6 +1609,9 @@ div.ms-sel-ctn .ms-sel-item {
.et2_toolbar-dropdown-menulist ul{ .et2_toolbar-dropdown-menulist ul{
position: relative !important; position: relative !important;
} }
.et2_toolbar div.ui-toolbar-menulist button.et2_button_with_image {
background-size: 16px 16px;
}
div.ui-toolbar-menulist{ div.ui-toolbar-menulist{
position: absolute; position: absolute;
height: inherit !important; height: inherit !important;
@ -1610,6 +1621,7 @@ div.ui-toolbar-menulist{
padding: 0 !important; padding: 0 !important;
margin-top: 3px !important; margin-top: 3px !important;
min-width: 150px; min-width: 150px;
padding-top: 3px;
} }
.ui-toolbar-menulist > h { .ui-toolbar-menulist > h {
padding-bottom: 7px; padding-bottom: 7px;
@ -1637,17 +1649,18 @@ div.ui-toolbar-menulist{
margin-top: 2px; margin-top: 2px;
direction: ltr; direction: ltr;
} }
.et2_toolbar_activeList{ .et2_toolbar_more{
position: relative; position: relative;
float:right; float:right;
direction: rtl; direction: rtl;
padding-bottom: 3px;
} }
div.et2_toolbar_activeList .ui-accordion-header-active { div.et2_toolbar_more .ui-accordion-header-active {
font-weight: normal; font-weight: normal;
color:black; color:black;
} }
div.et2_toolbar_activeList h.ui-accordion-header { div.et2_toolbar_more h.ui-accordion-header {
padding:4px 14px 6px 25px !important; padding: 4px 14px 3px 25px !important;
margin:1px; margin:1px;
} }
.et2_toolbar_actionlist{ .et2_toolbar_actionlist{
@ -1669,17 +1682,18 @@ span.et2_checkbox_slideSwitch {
vertical-align: middle; vertical-align: middle;
} }
span.et2_checkbox_slideSwitch > span.slideSwitch_container { span.et2_checkbox_slideSwitch > span.slideSwitch_container {
width: 100%; height: 18px;
border: none;
background-color: #FFFFFF;
box-shadow: inset 0 2px 6px rgb(71, 71, 71), 0 1px 0 rgba(255, 255, 255, 0.2);
margin: 0;
min-width:12px; min-width:12px;
height: 12px;
display: block; display: block;
position: relative; position: relative;
background-color: #B4B4B4;
box-shadow: inset 0 2px 6px rgba(0, 0, 0, 0.3), 0 1px 0 rgba(255, 255, 255, 0.2);
border: 1px solid rgba(0, 0, 0, 0.15);
border-radius: 3px; border-radius: 3px;
padding: 3px; padding: 3px;
margin: 1px; font-size: 12 px;
top: -1px;
} }
span.et2_checkbox_slideSwitch > span.slideSwitch_container > span:first-child { span.et2_checkbox_slideSwitch > span.slideSwitch_container > span:first-child {
width: 50%; width: 50%;
@ -1691,13 +1705,14 @@ span.et2_checkbox_slideSwitch > span.slideSwitch_container > span:first-child {
left:0; left:0;
z-index: 6; z-index: 6;
font-weight: bold; font-weight: bold;
color:#5A5A5A; color:#C0C0C0;
top:5px;
} }
span.et2_checkbox_slideSwitch.switchOn > span.slideSwitch_container > span:first-child { span.et2_checkbox_slideSwitch.switchOn > span.slideSwitch_container > span:first-child {
color:white; color:#FAFAFA;
} }
span.et2_checkbox_slideSwitch.switchOn > span.slideSwitch_container> span:nth-child(2) { span.et2_checkbox_slideSwitch.switchOn > span.slideSwitch_container> span:nth-child(2) {
color:#5A5A5A; color:#C0C0C0;
} }
span.et2_checkbox_slideSwitch > span.slideSwitch_container> span:nth-child(2) { span.et2_checkbox_slideSwitch > span.slideSwitch_container> span:nth-child(2) {
width: 50%; width: 50%;
@ -1709,24 +1724,23 @@ span.et2_checkbox_slideSwitch > span.slideSwitch_container> span:nth-child(2) {
z-index: 6; z-index: 6;
left:50%; left:50%;
font-weight: bold; font-weight: bold;
color:white; color:#FAFAFA;
top:5px;
} }
span.et2_checkbox_slideSwitch > span.slideSwitch_container a { span.et2_checkbox_slideSwitch > span.slideSwitch_container a {
position: absolute; position: absolute;
right: 0%; right: 0px;
top: -1px; top: 0px;
z-index: 4; z-index: 4;
display: block; display: block;
width: 48%; width: 50%;
height: 99%; height: 95%;
padding-bottom: 0px; padding-bottom: 0px;
background-color: #0c5da5; background-color: #7B7B7B;
border-radius: 3px; border-radius: 3px;
-webkit-transition: all 0.5s ease-out; -webkit-transition: all 0.5s ease-out;
-moz-transition: all 0.5s ease-out; -moz-transition: all 0.5s ease-out;
transition: all 0.5s ease-out; transition: all 0.5s ease-out;
box-shadow: 0px 1px 0px rgba(0, 0, 0, 0.5);
border: 1px solid rgba(0, 0, 0, 0.15);
} }
span.et2_checkbox_slideSwitch > input { span.et2_checkbox_slideSwitch > input {
opacity: 0; opacity: 0;
@ -1740,22 +1754,22 @@ span.et2_checkbox_slideSwitch.switchOn > span.slideSwitch_container a {
} }
/* Slide switch in a toolbar */ /* Slide switch in a toolbar */
.et2_toolbar_actionlist span.et2_checkbox_slideSwitch { .et2_toolbar_actionlist span.et2_checkbox_slideSwitch {
padding-right: 12px; padding-right: 3px;
padding-bottom: 2px; padding-left: 1px;
vertical-align: bottom; vertical-align: bottom;
} }
.et2_toolbar_activeList span.et2_checkbox_slideSwitch { .et2_toolbar_more span.et2_checkbox_slideSwitch {
text-align: left; text-align: left;
color: black; color: black;
font-size: 11px; font-size: 11px;
font-weight: normal; font-weight: normal;
width: 100%; width: 100%;
} }
.et2_toolbar_activeList span.et2_checkbox_slideSwitch > span.slideSwitch_container { .et2_toolbar_more span.et2_checkbox_slideSwitch > span.slideSwitch_container {
width: 40px; width: 40px;
float: left; float: left;
} }
.et2_toolbar_activeList span.et2_checkbox_slideSwitch > input { .et2_toolbar_more span.et2_checkbox_slideSwitch > input {
display: none; display: none;
} }

11
pixelegg/css/pixelegg.css
View File

@ -1266,7 +1266,7 @@
margin-top: 2px; margin-top: 2px;
direction: ltr; direction: ltr;
} }
.et2_toolbar_activeList { .et2_toolbar_more {
position: relative; position: relative;
float: right; float: right;
direction: rtl; direction: rtl;
@ -2175,7 +2175,6 @@ body {
* @package pixelegg * @package pixelegg
* @version $Id$ * @version $Id$
*/ */
@import-once "def_colors.less";
#socialMedia { #socialMedia {
position: relative; position: relative;
bottom: 20px; bottom: 20px;
@ -4253,7 +4252,7 @@ td.message span.message {
text-decoration: none; text-decoration: none;
height: 32px; height: 32px;
/*font-size: 1.1em;*/ /*font-size: 1.1em;*/
font-size: 12.100000000000001px; font-size: 12.1px;
line-height: 1.5em; line-height: 1.5em;
} }
#egw_fw_header #egw_fw_topmenu #egw_fw_topmenu_items ul li a:hover { #egw_fw_header #egw_fw_topmenu #egw_fw_topmenu_items ul li a:hover {
@ -4277,7 +4276,7 @@ td.message span.message {
} }
#egw_fw_header #egw_fw_topmenu #egw_fw_topmenu_items ul a#topmenu_home:before { #egw_fw_header #egw_fw_topmenu #egw_fw_topmenu_items ul a#topmenu_home:before {
padding-right: 20px; padding-right: 20px;
font-size: 12.100000000000001px; font-size: 12.1px;
content: " "; content: " ";
background-image: url(../images/topmenu_items/home.png); background-image: url(../images/topmenu_items/home.png);
background-repeat: no-repeat; background-repeat: no-repeat;
@ -4673,7 +4672,7 @@ td.message span.message {
padding-left: 3em; padding-left: 3em;
color: #999999; color: #999999;
/*font-size: 12px;*/ /*font-size: 12px;*/
font-size: 12.100000000000001px; font-size: 12.1px;
line-height: 17px; line-height: 17px;
} }
#egw_fw_sidebar #egw_fw_sidemenu .egw_fw_ui_scrollarea_outerdiv .egw_fw_ui_sidemenu_entry_header object { #egw_fw_sidebar #egw_fw_sidemenu .egw_fw_ui_scrollarea_outerdiv .egw_fw_ui_sidemenu_entry_header object {
@ -4845,7 +4844,7 @@ td.message span.message {
margin: 5px 0px 3px 5px; margin: 5px 0px 3px 5px;
padding: 0px 0px 0px 15px; padding: 0px 0px 0px 15px;
line-height: 1em; line-height: 1em;
font-size: 12.100000000000001px; font-size: 12.1px;
background-image: url(../images/arrow_left.png); background-image: url(../images/arrow_left.png);
background-repeat: no-repeat; background-repeat: no-repeat;
background-position: left center; background-position: left center;

2
pixelegg/less/etemplate2.less
View File

@ -1208,7 +1208,7 @@ div.ui-toolbar-menulist{
margin-top: 2px; margin-top: 2px;
direction: ltr; direction: ltr;
} }
.et2_toolbar_activeList{ .et2_toolbar_more{
position: relative; position: relative;
float:right; float:right;
direction: rtl; direction: rtl;