Mobile theme W.I.P.:

- Addressbook layout improvement
This commit is contained in:
Hadi Nategh 2015-12-21 16:25:27 +00:00
parent 603c7ac290
commit bc5fe8ec9a
6 changed files with 78 additions and 47 deletions

View File

@ -17,8 +17,8 @@
<grid width="100%">
<columns>
<column width="10"/>
<column width="60%"/>
<column width="39%"/>
<column width="40%"/>
<column width="40%"/>
<column width="58"/>
</columns>
<rows>
@ -28,18 +28,21 @@
<description class=" cat_$row_cont[cat_id] mobile_cat_col"/>
<vbox class="addressbookCol1">
<vbox id="${row}[id]">
<description id="${row}[line1]" no_lang="1"/>
<description id="${row}[line2]" no_lang="1"/>
<description id="${row}[line1]" no_lang="1"/>
</vbox>
<hbox class="workphone">
<description value=" " id="${row}[adr_one_locality]" no_lang="1"/>
</vbox>
<vbox class="addressbookCol2">
<hbox>
<image src="email.png"/>
<url-email id="${row}[email]" readonly="true" class="telNumbers"/>
</hbox>
<hbox>
<image src="phone.png"/>
<url-phone id="${row}[tel_work]" readonly="true" class="telNumbers"/>
</hbox>
</vbox>
<vbox class="addressbookCol2">
<url-email id="${row}[email]" readonly="true" />
<description value=" " id="${row}[adr_one_locality]" no_lang="1"/>
<hbox class="cellphone">
<hbox>
<image src="cellphone.png"/>
<url-phone id="${row}[tel_cell]" readonly="true" class="telNumbers"/>
</hbox>

View File

@ -496,18 +496,24 @@ input.et2_radiobox {
background-size: 35px 35px;
background-repeat: no-repeat;
background-position: center;
position: absolute;
bottom: 25%;
top: 25%;
}
#addressbook-index table.egwGridView_outer tbody .addressbookCol3 div.avatar img {
padding-top: 0;
}
#addressbook-index table.egwGridView_outer tbody span[id^='addressbook-index_'][id$='line1]'] {
font-weight: bold;
font-size: 9pt;
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
padding-bottom: 5px;
}
#addressbook-index table.egwGridView_outer tbody span[id^='addressbook-index_'][id$='line2]'] {
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
font-weight: bold;
}
#addressbook-index table.egwGridView_outer tbody .addressbookCol2 {
text-overflow: ellipsis;
@ -515,35 +521,26 @@ input.et2_radiobox {
white-space: nowrap;
width: 99%;
}
#addressbook-index table.egwGridView_outer tbody td[class^="gridCont"] {
position: relative;
}
#addressbook-index table.egwGridView_outer tbody td[class^="gridCont"] .et2_hbox.et2_box_widget.cellphone {
margin-left: -4px;
position: absolute;
bottom: 0;
}
#addressbook-index table.egwGridView_outer tbody td[class^="gridCont"] .workphone {
position: absolute;
bottom: 0;
}
#addressbook-index table.egwGridView_outer tbody span[id^='addressbook-index_'][id$='adr_one_locality]'] {
font-size: 8pt;
font-size: 9pt;
display: inline-block;
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
}
#addressbook-index table.egwGridView_outer tbody a[id^='addressbook-index_'][id$='email]'] {
font-size: 8pt;
display: block;
font-size: 9pt;
padding-left: 4px;
padding-bottom: 2px;
display: inline;
overflow: hidden;
text-overflow: ellipsis;
padding-bottom: 5px;
color: #2C6398;
}
#addressbook-index table.egwGridView_outer tbody a[id^='addressbook-index_'][id$='tel_cell]'],
#addressbook-index table.egwGridView_outer tbody a[id^='addressbook-index_'][id$='tel_work]'] {
font-size: 8pt;
font-size: 9pt;
display: inline-block;
padding-left: 3px;
overflow: hidden;

View File

@ -403,18 +403,24 @@ div.addressbook_edit_general_picture img {
background-size: 35px 35px;
background-repeat: no-repeat;
background-position: center;
position: absolute;
bottom:25%;
top:25%;
img{
padding-top:0;
}
}
span[id^='addressbook-index_'][id$='line1]'] {
font-weight: bold;
.mob-fontsize-s;
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
padding-bottom: 5px;
}
span[id^='addressbook-index_'][id$='line2]']{
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
font-weight: bold;
}
.addressbookCol2 {
text-overflow: ellipsis;
@ -422,19 +428,7 @@ div.addressbook_edit_general_picture img {
white-space: nowrap;
width:99%;
}
td[class^="gridCont"]{
position:relative;
.et2_hbox.et2_box_widget.cellphone {
margin-left: -4px;
position: absolute;
bottom:0;
}
.workphone {
position: absolute;
bottom:0;
}
}
span[id^='addressbook-index_'][id$='adr_one_locality]']
{
.mob-fontsize-s;
@ -446,10 +440,13 @@ div.addressbook_edit_general_picture img {
}
a[id^='addressbook-index_'][id$='email]']{
.mob-fontsize-s;
display:block;
padding-left: 4px;
padding-bottom:2px;
display: inline;
overflow: hidden;
text-overflow: ellipsis;
padding-bottom: 5px;
color: #2C6398;
}
a[id^='addressbook-index_'][id$='tel_cell]'],
a[id^='addressbook-index_'][id$='tel_work]']

View File

@ -6709,7 +6709,7 @@ span.egw_tutorial_title {
background: white;
}
#egw_fw_basecontainer #egw_fw_main #egw_fw_tabs {
margin-top: 0;
margin-top: -3px;
}
#egw_fw_basecontainer #egw_fw_top_toolbar div.egw_fw_ui_tabs_header {
max-height: 60px;
@ -7316,6 +7316,7 @@ span.egw_tutorial_title {
}
.egw_fw_content_browser_div {
padding: 0;
background-color: white;
}
.egw_fw_mobile_popup_container {
width: 100%;
@ -7448,6 +7449,9 @@ span.egw_tutorial_title {
body #egw_fw_basecontainer.sidebar-toggle div#egw_fw_top_toolbar {
z-index: 0;
}
body #egw_fw_basecontainer.sidebar-toggle #egw_fw_main {
margin-left: 0 !important ;
}
body #egw_fw_basecontainer.sidebar-toggle #egw_fw_main #egw_fw_tabs {
-webkit-filter: none;
-moz-filter: none;
@ -7720,6 +7724,23 @@ span.egw_tutorial_title {
body .et2_nextmatch table.egwGridView_grid tbody tr:hover {
background: transparent;
}
body .et2_nextmatch table.egwGridView_grid tbody tr td {
padding: 10px 0px 10px 0px;
}
body .et2_nextmatch table.egwGridView_grid tbody tr td .et2_label,
body .et2_nextmatch table.egwGridView_grid tbody tr td .et2_button,
body .et2_nextmatch table.egwGridView_grid tbody tr td .et2_link,
body .et2_nextmatch table.egwGridView_grid tbody tr td .et2_textbox,
body .et2_nextmatch table.egwGridView_grid tbody tr td .et2_textbox_ro,
body .et2_nextmatch table.egwGridView_grid tbody tr td .et2_email,
body .et2_nextmatch table.egwGridView_grid tbody tr td img,
body .et2_nextmatch table.egwGridView_grid tbody tr td span {
padding: 8px 0px 0px 0px;
}
body .et2_nextmatch table.egwGridView_grid tbody tr td time.et2_label,
body .et2_nextmatch table.egwGridView_grid tbody tr td span.mobile_cat_col {
padding: 0;
}
body .et2_nextmatch table.egwGridView_grid tbody tr.swipe {
background-color: #ffc200;
border: none;

View File

@ -148,7 +148,7 @@
#egw_fw_main {
#egw_fw_tabs {
margin-top:0;
margin-top:-3px;
}
}
//###################
@ -786,6 +786,7 @@
.egw_fw_content_browser_div {
padding: 0;
background-color: white;
}
//###################################
@ -957,6 +958,7 @@
z-index: 0;
}
#egw_fw_main {
margin-left:0 !important ;
#egw_fw_tabs {
-webkit-filter: none;
-moz-filter: none;
@ -1272,6 +1274,16 @@
&: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;
}
}
}
tr.swipe{
background-color:rgba(255, 194, 0, 1);

View File

@ -13,8 +13,9 @@
@mobile-fontsize-base : 10pt;
.mob-fontsize-xs {font-size: @mobile-fontsize-base*0.6;}
.mob-fontsize-s {font-size: @mobile-fontsize-base*0.8;}
.mob-fontsize-xxs {font-size: @mobile-fontsize-base*0.6;}
.mob-fontsize-xs {font-size: @mobile-fontsize-base*0.8;}
.mob-fontsize-s {font-size: @mobile-fontsize-base*0.9;}
.mob-fontsize-n {font-size: @mobile-fontsize-base}
.mob-fontsize-l {font-size: @mobile-fontsize-base*1.2;}
.mob-fontsize-xl {font-size: @mobile-fontsize-base*1.5;}