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 fontsize for infolog, timesheet, resources and addressbook
- Migrate mobile specific css classes into mobile theme for resources
This commit is contained in:
Hadi Nategh 2016-03-04 13:27:07 +00:00
parent 0bc507ca7e
commit 34c2ed32b9
11 changed files with 127 additions and 72 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
addressbook/templates/pixelegg/app.css
View File

@ -172,13 +172,13 @@ select#addressbook-index_col_filter\[tid\] {
margin-right: 5px; margin-right: 5px;
} }
div#addressbook_view_sidebox #addressbook-view_n_fn { div#addressbook_view_sidebox #addressbook-view_n_fn {
font-size: 14.3px; font-size: 14px;
font-weight: bold; font-weight: bold;
padding: 2px 0 2px 0; padding: 2px 0 2px 0;
width: 85%; width: 85%;
} }
div#addressbook_view_sidebox #addressbook-view_org_name { div#addressbook_view_sidebox #addressbook-view_org_name {
font-size: 14.3px; font-size: 14px;
padding: 2px 0 2px 0; padding: 2px 0 2px 0;
width: 85%; width: 85%;
} }

9
filemanager/templates/mobile/app.css
View File

@ -13,7 +13,7 @@
/* tablets and smartphones */ /* tablets and smartphones */
@media all { @media all {
#filemanager-index_nm table.egwGridView_outer tbody span[id^='filemanager-index'][id$='size]'] { #filemanager-index_nm table.egwGridView_outer tbody span[id^='filemanager-index'][id$='size]'] {
font-size: 9pt; font-size: 10pt;
text-align: right; text-align: right;
} }
#filemanager-index_nm table.egwGridView_outer tbody label[id^='filemanager-index'][id$='name]'] { #filemanager-index_nm table.egwGridView_outer tbody label[id^='filemanager-index'][id$='name]'] {
@ -22,8 +22,15 @@
max-width: 100%; max-width: 100%;
} }
#filemanager-index_nm table.egwGridView_outer tbody label[id^='filemanager-index'][id$='name]'] span { #filemanager-index_nm table.egwGridView_outer tbody label[id^='filemanager-index'][id$='name]'] span {
font-size: 12pt;
white-space: nowrap; white-space: nowrap;
} }
#filemanager-index_nm table.egwGridView_outer tbody span[id^='filemanager-index'][id$='comment]'] {
font-size: 10pt;
}
#filemanager-index_nm table.egwGridView_outer tbody label[id^='filemanager-index'][id$='mtime]'] time {
font-size: 10pt;
}
#filemanager-index_nm #filemanager-index_buttons { #filemanager-index_nm #filemanager-index_buttons {
position: relative; position: relative;
display: inline-block; display: inline-block;

13
filemanager/templates/mobile/app.less
View File

@ -18,7 +18,7 @@
#filemanager-index_nm { #filemanager-index_nm {
table.egwGridView_outer tbody { table.egwGridView_outer tbody {
span[id^='filemanager-index'][id$='size]']{ span[id^='filemanager-index'][id$='size]']{
.mob-fontsize-s; .mob-fontsize-n;
text-align: right; text-align: right;
} }
label[id^='filemanager-index'][id$='name]'] { label[id^='filemanager-index'][id$='name]'] {
@ -26,8 +26,17 @@
text-overflow: ellipsis; text-overflow: ellipsis;
max-width: 100%; max-width: 100%;
span{ span{
.mob-fontsize-l;
white-space: nowrap; white-space: nowrap;
}
}
span[id^='filemanager-index'][id$='comment]']
{
.mob-fontsize-n;
}
label[id^='filemanager-index'][id$='mtime]'] {
time{
.mob-fontsize-n;
} }
} }
} }

13
infolog/templates/mobile/app.css
View File

@ -16,7 +16,7 @@
} }
div.infoDescRow { div.infoDescRow {
height: 32px; height: 32px;
font-size: 9pt; font-size: 10pt;
max-width: 99%; max-width: 99%;
overflow: hidden; overflow: hidden;
text-overflow: ellipsis; text-overflow: ellipsis;
@ -25,21 +25,21 @@
} }
div.infoLinksRow, div.infoLinksRow,
div.infoLinksRow ul[id^='infolog-index_'][id$='filelinks]'] { div.infoLinksRow ul[id^='infolog-index_'][id$='filelinks]'] {
font-size: 9pt; font-size: 10pt;
max-width: 99%; max-width: 99%;
overflow: hidden; overflow: hidden;
text-overflow: ellipsis; text-overflow: ellipsis;
white-space: nowrap !important; white-space: nowrap !important;
} }
label[id^='infolog-index_'][id$='info_enddate]'] { label[id^='infolog-index_'][id$='info_enddate]'] {
font-size: 8pt; font-size: 10pt;
} }
label[id^='infolog-index_'][id$='info_enddate]'] time { label[id^='infolog-index_'][id$='info_enddate]'] time {
float: none; float: none;
font-weight: normal; font-weight: normal;
} }
label[id^='infolog-index_'][id$='info_startdate]'] { label[id^='infolog-index_'][id$='info_startdate]'] {
font-size: 8pt; font-size: 10pt;
} }
label[id^='infolog-index_'][id$='info_startdate]'] time { label[id^='infolog-index_'][id$='info_startdate]'] time {
float: none; float: none;
@ -50,7 +50,7 @@
max-height: 15px; max-height: 15px;
} }
ul[id^='infolog-index_'][id$='info_responsible]'] li { ul[id^='infolog-index_'][id$='info_responsible]'] li {
font-size: 9pt; font-size: 10pt;
text-align: right; text-align: right;
text-overflow: ellipsis; text-overflow: ellipsis;
white-space: nowrap; white-space: nowrap;
@ -62,13 +62,14 @@
} }
.infoSubRow span[id^='infolog-index_'][id$='info_subject]'] { .infoSubRow span[id^='infolog-index_'][id$='info_subject]'] {
white-space: nowrap; white-space: nowrap;
font-size: 12pt;
} }
label[id^='infolog-index_'][id$='info_link]'] { label[id^='infolog-index_'][id$='info_link]'] {
white-space: nowrap; white-space: nowrap;
text-overflow: ellipsis; text-overflow: ellipsis;
overflow: hidden; overflow: hidden;
width: 100%; width: 100%;
font-size: 9pt; font-size: 10pt;
font-weight: normal; font-weight: normal;
} }
infolog_rowHasSubs span.arrow, infolog_rowHasSubs span.arrow,

13
infolog/templates/mobile/app.less
View File

@ -21,7 +21,7 @@
} }
div.infoDescRow { div.infoDescRow {
height:32px; height:32px;
.mob-fontsize-s; .mob-fontsize-n;
max-width: 99%; max-width: 99%;
overflow: hidden; overflow: hidden;
text-overflow: ellipsis; text-overflow: ellipsis;
@ -29,14 +29,14 @@
padding-top: 8px; padding-top: 8px;
} }
div.infoLinksRow, div.infoLinksRow ul[id^='infolog-index_'][id$='filelinks]'] { div.infoLinksRow, div.infoLinksRow ul[id^='infolog-index_'][id$='filelinks]'] {
.mob-fontsize-s; .mob-fontsize-n;
max-width: 99%; max-width: 99%;
overflow: hidden; overflow: hidden;
text-overflow: ellipsis; text-overflow: ellipsis;
white-space: nowrap !important; white-space: nowrap !important;
} }
label[id^='infolog-index_'][id$='info_enddate]'] { label[id^='infolog-index_'][id$='info_enddate]'] {
.mob-fontsize-xs; .mob-fontsize-n;
time { time {
float: none; float: none;
@ -44,7 +44,7 @@
} }
} }
label[id^='infolog-index_'][id$='info_startdate]']{ label[id^='infolog-index_'][id$='info_startdate]']{
.mob-fontsize-xs; .mob-fontsize-n;
time { time {
float: none; float: none;
} }
@ -54,7 +54,7 @@
white-space:nowrap; white-space:nowrap;
max-height: 15px; max-height: 15px;
li{ li{
.mob-fontsize-s; .mob-fontsize-n;
text-align: right; text-align: right;
text-overflow: ellipsis; text-overflow: ellipsis;
white-space: nowrap; white-space: nowrap;
@ -69,6 +69,7 @@
.infoSubRow { .infoSubRow {
span[id^='infolog-index_'][id$='info_subject]'] { span[id^='infolog-index_'][id$='info_subject]'] {
white-space: nowrap; white-space: nowrap;
.mob-fontsize-l;
} }
} }
label[id^='infolog-index_'][id$='info_link]'] label[id^='infolog-index_'][id$='info_link]']
@ -77,7 +78,7 @@
text-overflow: ellipsis; text-overflow: ellipsis;
overflow: hidden; overflow: hidden;
width: 100%; width: 100%;
.mob-fontsize-s; .mob-fontsize-n;
font-weight: normal; font-weight: normal;
} }
infolog_rowHasSubs span.arrow, infolog_rowHasSubs span.arrow,

34
resources/templates/mobile/app.css Normal file
View File

@ -0,0 +1,34 @@
/**
*
* Resources - Mobile
*
* Please do NOT change app.css directly, instead change app.less and compile it!
* Pixleegg Template app.css
* @link http://www.egroupware.org
* @license http://opensource.org/licenses/gpl-license.php GPL - GNU General Public License
* @author Hadi Nategh <hn@stylite.de>
* @package resources
* @version $Id: app.less 55033 2016-02-16 18:49:17Z hnategh $
*/
/* tablets and smartphones */
@media all {
#resources-show table.egwGridView_outer tbody img[id^="resources-show_"][id$="picture_thumb]"] {
border: 1px solid silver;
border-radius: 50%;
}
#resources-show table.egwGridView_outer tbody div.resourcesCol2 {
font-size: 10pt;
}
#resources-show table.egwGridView_outer tbody span[id^="resources-show_"][id$="name]"] {
font-weight: bold;
font-size: 12pt;
}
#resources-show table.egwGridView_outer tbody span[id^="resources-show_"][id$="name]"],
#resources-show table.egwGridView_outer tbody span[id^="resources-show_"][id$="short_description]"],
#resources-show table.egwGridView_outer tbody span[id^="resources-show_"][id$="accessory_of_label]"],
#resources-show table.egwGridView_outer tbody span[id^="resources-show_"][id$="accessories]"] {
text-overflow: ellipsis;
overflow: hidden;
white-space: nowrap;
}
}

41
resources/templates/mobile/app.less Normal file
View File

@ -0,0 +1,41 @@
/**
*
* Resources - Mobile
*
* Please do NOT change app.css directly, instead change app.less and compile it!
* Pixleegg Template app.css
* @link http://www.egroupware.org
* @license http://opensource.org/licenses/gpl-license.php GPL - GNU General Public License
* @author Hadi Nategh <hn@stylite.de>
* @package resources
* @version $Id: app.less 55033 2016-02-16 18:49:17Z hnategh $
*/
@import (reference) "../../../pixelegg/less/def_buttons.less";
@import (reference) "../../../pixelegg/less/def_mobile.less";
/* tablets and smartphones */
@media all {
#resources-show {
table.egwGridView_outer tbody {
img[id^="resources-show_"][id$="picture_thumb]"]{
border: 1px solid silver;
border-radius: 50%;
}
div.resourcesCol2 {
.mob-fontsize-n;
}
span[id^="resources-show_"][id$="name]"]{
font-weight: bold;
.mob-fontsize-l;
}
span[id^="resources-show_"][id$="name]"],
span[id^="resources-show_"][id$="short_description]"],
span[id^="resources-show_"][id$="accessory_of_label]"],
span[id^="resources-show_"][id$="accessories]"]{
text-overflow: ellipsis;
overflow: hidden;
white-space: nowrap;
}
}
}
}

21
resources/templates/pixelegg/app.css
View File

@ -75,24 +75,3 @@ div.resources_pictureFile div.progress {
#resources-edit .et2_container { #resources-edit .et2_container {
width: 848px; width: 848px;
} }
/* tablets and smartphones */
@media only screen and (max-device-width: 1024px) {
#resources-show table.egwGridView_outer tbody img[id^="resources-show_"][id$="picture_thumb]"] {
border: 1px solid silver;
border-radius: 50%;
}
#resources-show table.egwGridView_outer tbody div.resourcesCol2 {
font-size: 8pt;
}
#resources-show table.egwGridView_outer tbody span[id^="resources-show_"][id$="name]"] {
font-weight: bold;
}
#resources-show table.egwGridView_outer tbody span[id^="resources-show_"][id$="name]"],
#resources-show table.egwGridView_outer tbody span[id^="resources-show_"][id$="short_description]"],
#resources-show table.egwGridView_outer tbody span[id^="resources-show_"][id$="accessory_of_label]"],
#resources-show table.egwGridView_outer tbody span[id^="resources-show_"][id$="accessories]"] {
text-overflow: ellipsis;
overflow: hidden;
white-space: nowrap;
}
}

27
resources/templates/pixelegg/app.less
View File

@ -66,30 +66,3 @@ div.resources_pictureFile div.progress{
} }
margin: 0.5em; margin: 0.5em;
} }
/* tablets and smartphones */
@media only screen and (max-device-width:1024px) {
#resources-show {
table.egwGridView_outer tbody {
img[id^="resources-show_"][id$="picture_thumb]"]{
border: 1px solid silver;
border-radius: 50%;
}
div.resourcesCol2 {
.mob-fontsize-s;
}
span[id^="resources-show_"][id$="name]"]{
font-weight: bold;
}
span[id^="resources-show_"][id$="name]"],
span[id^="resources-show_"][id$="short_description]"],
span[id^="resources-show_"][id$="accessory_of_label]"],
span[id^="resources-show_"][id$="accessories]"]{
text-overflow: ellipsis;
overflow: hidden;
white-space: nowrap;
}
}
}
}

11
timesheet/templates/mobile/app.css
View File

@ -21,7 +21,7 @@
width: 90px; width: 90px;
white-space: nowrap; white-space: nowrap;
text-overflow: ellipsis; text-overflow: ellipsis;
font-size: 9pt; font-size: 10pt;
} }
#timesheet-index table.egwGridView_outer tbody tr.timesheetRow td { #timesheet-index table.egwGridView_outer tbody tr.timesheetRow td {
position: relative; position: relative;
@ -29,22 +29,27 @@
#timesheet-index table.egwGridView_outer tbody span[id^='timesheet-index'][id$='cat_id]'] { #timesheet-index table.egwGridView_outer tbody span[id^='timesheet-index'][id$='cat_id]'] {
position: absolute; position: absolute;
bottom: 5px; bottom: 5px;
font-size: 9pt; font-size: 10pt;
} }
#timesheet-index table.egwGridView_outer tbody span[id^='timesheet-index'][id$='ts_description]'] { #timesheet-index table.egwGridView_outer tbody span[id^='timesheet-index'][id$='ts_description]'] {
height: 30px; height: 30px;
white-space: nowrap; white-space: nowrap;
overflow: hidden; overflow: hidden;
text-overflow: ellipsis; text-overflow: ellipsis;
font-size: 10pt;
}
#timesheet-index table.egwGridView_outer tbody span[id^='timesheet-index'][id$='ts_title]'] {
font-size: 12pt;
} }
#timesheet-index table.egwGridView_outer tbody div.timesheet3Col { #timesheet-index table.egwGridView_outer tbody div.timesheet3Col {
font-size: 9pt; font-size: 10pt;
} }
#timesheet-index table.egwGridView_outer tbody span[id^='timesheet-index'][id$='ts_duration]'] { #timesheet-index table.egwGridView_outer tbody span[id^='timesheet-index'][id$='ts_duration]'] {
font-weight: bold; font-weight: bold;
} }
#timesheet-index table.egwGridView_outer tbody label[id^='timesheet-index'][id$='ts_link]'] > span.et2_link { #timesheet-index table.egwGridView_outer tbody label[id^='timesheet-index'][id$='ts_link]'] > span.et2_link {
font-weight: normal; font-weight: normal;
font-size: 10pt;
} }
#timesheet-edit_pl_id { #timesheet-edit_pl_id {
width: 69%; width: 69%;

11
timesheet/templates/mobile/app.less
View File

@ -27,7 +27,7 @@
width: 90px; width: 90px;
white-space: nowrap; white-space: nowrap;
text-overflow: ellipsis; text-overflow: ellipsis;
.mob-fontsize-s; .mob-fontsize-n;
} }
tr.timesheetRow td { tr.timesheetRow td {
position: relative; position: relative;
@ -35,22 +35,27 @@
span[id^='timesheet-index'][id$='cat_id]'] { span[id^='timesheet-index'][id$='cat_id]'] {
position: absolute; position: absolute;
bottom: 5px; bottom: 5px;
.mob-fontsize-s; .mob-fontsize-n;
} }
span[id^='timesheet-index'][id$='ts_description]'] { span[id^='timesheet-index'][id$='ts_description]'] {
height: 30px; height: 30px;
white-space: nowrap; white-space: nowrap;
overflow: hidden; overflow: hidden;
text-overflow: ellipsis; text-overflow: ellipsis;
.mob-fontsize-n;
}
span[id^='timesheet-index'][id$='ts_title]'] {
.mob-fontsize-l;
} }
div.timesheet3Col { div.timesheet3Col {
.mob-fontsize-s; .mob-fontsize-n;
} }
span[id^='timesheet-index'][id$='ts_duration]'] { span[id^='timesheet-index'][id$='ts_duration]'] {
font-weight: bold; font-weight: bold;
} }
label[id^='timesheet-index'][id$='ts_link]'] > span.et2_link { label[id^='timesheet-index'][id$='ts_link]'] > span.et2_link {
font-weight: normal; font-weight: normal;
.mob-fontsize-n;
} }
} }
} }