holm/egroupware
1
1
Fork 0
forked from extern/egroupware
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Mobile theme W.I.P.:

Browse Source 
- Fix checkboxes size
- Fix styling of slideSwitch
This commit is contained in:
Hadi Nategh 2016-02-26 17:02:44 +00:00
parent ecb2da3fa6
commit b4b12b2312
5 changed files with 116 additions and 6 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

5
infolog/templates/mobile/edit.xet
View File

@ -171,7 +171,7 @@
<hbox span="all" width="100%">
<button statustext="Saves this entry" id="button[save]" image="save" background_image="1"/>
<button statustext="Apply the changes" id="button[apply]" image="apply" background_image="1"/>
<button align="right" statustext="delete this entry" id="button[delete]" onclick="if($cont[info_anz_subs]) return $cont[info_anz_subs]; et2_dialog.confirm(widget,'Delete this entry','Delete');" image="delete" background_image="1" span="all"/>
<button statustext="delete this entry" id="button[delete]" onclick="if($cont[info_anz_subs]) return $cont[info_anz_subs]; et2_dialog.confirm(widget,'Delete this entry','Delete');" image="delete" background_image="1" span="all"/>
<buttononly statustext="Insert timestamp into description field" id="timestamp" class="infologExtraButton infologTimestamp" background_image="1" image="timestamp" onclick="app.infolog.insert_text('info_des');"/>
<checkbox label="notification" id="no_notifications"/>
</hbox>
@ -239,9 +239,6 @@
</tabpanels>
</tabbox>
</row>
<row>
</row>
</rows>
</grid>
</template>

18
pixelegg/images/done.svg Normal file
View File

@ -0,0 +1,18 @@
<?xml version="1.0" encoding="utf-8"?>
<!-- Generator: Adobe Illustrator 15.0.0, SVG Export Plug-In . SVG Version: 6.00 Build 0) -->
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
<svg version="1.1" id="Ebene_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
width="32px" height="32px" viewBox="0 0 32 32" enable-background="new 0 0 32 32" xml:space="preserve">
<g>
<g>
<path fill="none" stroke="#616463" stroke-miterlimit="10" d="M26.231,0.709H5.997c-2.793,0-5.059,2.266-5.059,5.059v20.236
c0,2.795,2.266,5.06,5.059,5.06h20.236c2.795,0,5.061-2.265,5.061-5.06V5.768C31.292,2.975,29.026,0.709,26.231,0.709z
M28.257,24.991c0,1.676-1.359,3.036-3.035,3.036H7.008c-1.676,0-3.035-1.36-3.035-3.036V6.78c0-1.676,1.359-3.035,3.035-3.035
h18.213c1.676,0,3.035,1.358,3.035,3.035V24.991z"/>
</g>
</g>
<path fill="none" stroke="#616463" stroke-miterlimit="10" d="M9.791,23.081c0.618,0.52,1.429,0.768,2.239,0.754
c0.293,0.012,0.581-0.047,0.862-0.141c0.463-0.123,0.904-0.307,1.271-0.613l10.93-9.236c1.209-1.02,1.209-2.674,0-3.694
c-1.207-1.02-3.164-1.02-4.373,0l-8.766,7.409l-1.628-1.654c-0.98-0.992-2.57-0.992-3.55,0c-0.98,0.996-0.98,2.607,0,3.599
C6.777,19.505,8.791,22.054,9.791,23.081z"/>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 1.3 KiB

14
pixelegg/images/topmenu_items/mobile/checkbox.svg Normal file
View File

@ -0,0 +1,14 @@
<?xml version="1.0" encoding="utf-8"?>
<!-- Generator: Adobe Illustrator 15.0.0, SVG Export Plug-In . SVG Version: 6.00 Build 0) -->
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
<svg version="1.1" id="Ebene_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
width="32px" height="32px" viewBox="0 0 32 32" enable-background="new 0 0 32 32" xml:space="preserve">
<g>
<g>
<path fill="#FFFFFF" stroke="#616463" stroke-miterlimit="10" d="M26.231,0.709H5.997c-2.793,0-5.059,2.266-5.059,5.059v20.236
c0,2.795,2.266,5.06,5.059,5.06h20.236c2.795,0,5.061-2.265,5.061-5.06V5.768C31.292,2.975,29.026,0.709,26.231,0.709z
M28.257,24.991c0,1.676-1.359,3.036-3.035,3.036H7.008c-1.676,0-3.035-1.36-3.035-3.036V6.78c0-1.676,1.359-3.035,3.035-3.035
h18.213c1.676,0,3.035,1.358,3.035,3.035V24.991z"/>
</g>
</g>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 929 B

41
pixelegg/mobile/fw_mobile.css
View File

@ -7078,6 +7078,10 @@ span.egw_tutorial_title {
body {
/*Chosen*/
/* View mode styles*/
/***************CHECKBOX *************/
/**************************************/
/*************** SLIDESWITCH **********/
/***************************************/
}
body span.egw_fw_mobile_popup_close.loaded {
background-image: url(../images/topmenu_items/mobile/back.svg);
@ -7135,6 +7139,7 @@ span.egw_tutorial_title {
body #egw_fw_basecontainer #egw_fw_sidemenu img[src$=".svg"] {
background: none;
box-shadow: none;
border: none;
}
body #egw_fw_basecontainer #egw_fw_main img[src$="svg"],
body #egw_fw_basecontainer #egw_fw_footer img[src$="svg"] {
@ -7618,7 +7623,7 @@ span.egw_tutorial_title {
body #popupMainDiv .et2_link,
body #popupMainDiv .et2_label,
body #popupMainDiv input {
height: 25px;
height: 32px;
}
body #popupMainDiv .et2_button_with_image,
body #popupMainDiv .et2_button_text {
@ -7850,4 +7855,38 @@ span.egw_tutorial_title {
border: none;
box-shado: none;
}
body input[type="checkbox"] {
width: 32px !important;
height: 32px !important;
}
body input[type="checkbox"]:before {
content: "";
width: 32px;
height: 32px;
background-image: url(../images/topmenu_items/mobile/checkbox.svg) !important;
display: inline-block;
}
body input[type="checkbox"]:checked {
background-image: url(../images/topmenu_items/mobile/checkbox.svg) !important;
width: 32px !important;
height: 32px !important;
}
body span.et2_checkbox_slideSwitch {
height: 50px;
vertical-align: bottom;
}
body span.et2_checkbox_slideSwitch input {
height: 100% !important;
}
body span.et2_checkbox_slideSwitch span.slideSwitch_container {
border-radius: 15px;
margin-top: 15px;
box-shadow: inset 0 2px 2px #474747, 0 0px 0 rgba(255, 255, 255, 0.2);
}
body span.et2_checkbox_slideSwitch span.slideSwitch_container a {
background-color: #E0E0E0;
border-radius: 50%;
box-shadow: 0 2px 2px #474747, 0 0px 0 rgba(255, 255, 255, 0.2);
z-index: 2;
}
}

44
pixelegg/mobile/fw_mobile.less
View File

@ -296,6 +296,7 @@
#egw_fw_sidemenu img[src$=".svg"] {
background: none;
box-shadow: none;
border:none;
}
#egw_fw_main img[src$="svg"], #egw_fw_footer img[src$="svg"] {
background:none;
@ -785,7 +786,7 @@
font-family: Verdana, "Lucida Grande", Helvetica, Sans-Serif;
}
.et2_textbox, .et2_date, .et2_dropdown, .et2_link, .et2_label, input{
height:25px;
height:32px;
}
.et2_button_with_image, .et2_button_text {
height: 46px;
@ -1049,5 +1050,46 @@
border:none;
box-shado:none;
}
/***************CHECKBOX *************/
/**************************************/
input[type="checkbox"] {
width: 32px !important;
height: 32px !important;
}
input[type="checkbox"]:before {
content:"";
width:32px;
height:32px;
background-image:url(../images/topmenu_items/mobile/checkbox.svg) !important;
display:inline-block;
}
input[type="checkbox"]:checked{
background-image:url(../images/topmenu_items/mobile/checkbox.svg) !important;
width:32px !important;
height:32px !important;
}
/*************** SLIDESWITCH **********/
/***************************************/
span.et2_checkbox_slideSwitch {
height: 50px;
vertical-align: bottom;
input {
height: 100% !important;
}
span.slideSwitch_container {
border-radius: 15px;
margin-top: 15px;
box-shadow: inset 0 2px 2px rgb(71, 71, 71), 0 0px 0 rgba(255, 255, 255, 0.2);
a {
background-color: #E0E0E0;
border-radius: 50%;
box-shadow: 0 2px 2px rgb(71, 71, 71), 0 0px 0 rgba(255, 255, 255, 0.2);
z-index: 2;
}
}
}
}
}