Skip to content

erp5
erp5
Commit 63975b4f authored by Romain Courteaud's avatar Romain Courteaud
Browse files
Options

[erp5_web_renderjs_ui] Improve main page UI 

Reduce field padding.
Move home link.
parent 273a659f
Show whitespace changes
Inline Side-by-side
Showing with 152 additions and 78 deletions
bt5/erp5_web_renderjs_ui/PathTemplateItem/web_page_module/rjs_gadget_erp5_css.css
View file @ 63975b4f
...@@ -265,7 +265,8 @@ label { ...@@ -265,7 +265,8 @@ label {
display: block; display: block;
color: #777777; color: #777777;
} }
input:not([type=submit]):not([type=file]):not([type=checkbox]):not([type=radio]):not([type=color]) { input:not([type=submit]):not([type=file]):not([type=checkbox]):not([type=radio]):not([type=color]),
textarea {
width: 100%; width: 100%;
margin: 0; margin: 0;
padding: 0.4em; padding: 0.4em;
...@@ -283,10 +284,13 @@ input:not([type=submit]):not([type=file]):not([type=checkbox]):not([type=radio]) ...@@ -283,10 +284,13 @@ input:not([type=submit]):not([type=file]):not([type=checkbox]):not([type=radio])
outline-offset: 0; outline-offset: 0;
} }
input:not([type=submit]):not([type=file]):not([type=checkbox]):not([type=radio]):not([type=color]):active, input:not([type=submit]):not([type=file]):not([type=checkbox]):not([type=radio]):not([type=color]):active,
input:not([type=submit]):not([type=file]):not([type=checkbox]):not([type=radio]):not([type=color]):focus { textarea:active,
input:not([type=submit]):not([type=file]):not([type=checkbox]):not([type=radio]):not([type=color]):focus,
textarea:focus {
outline-offset: 0; outline-offset: 0;
} }
input:not([type=submit]):not([type=file]):not([type=checkbox]):not([type=radio]):not([type=color]):focus { input:not([type=submit]):not([type=file]):not([type=checkbox]):not([type=radio]):not([type=color]):focus,
textarea:focus {
-webkit-box-shadow: 0 0 12px #3388cc; -webkit-box-shadow: 0 0 12px #3388cc;
-moz-box-shadow: 0 0 12px #3388cc; -moz-box-shadow: 0 0 12px #3388cc;
box-shadow: 0 0 12px #3388cc; box-shadow: 0 0 12px #3388cc;
...@@ -333,11 +337,13 @@ textarea { ...@@ -333,11 +337,13 @@ textarea {
height: 15em; height: 15em;
width: 100%; width: 100%;
margin: 0; margin: 0;
/*
padding: 0.5em; padding: 0.5em;
border: none; border: none;
background-color: #FFFFFF; background-color: @colortextboxbackground;
color: #1F1F1F; color: @colortextboxforeground;
border-radius: 0; border-radius: 0;
*/
font-family: "Courier New", Courier, monospace; font-family: "Courier New", Courier, monospace;
} }
::-webkit-input-placeholder { ::-webkit-input-placeholder {
...@@ -431,23 +437,27 @@ div[data-gadget-scope='panel'] { ...@@ -431,23 +437,27 @@ div[data-gadget-scope='panel'] {
} }
} }
div[data-gadget-scope='panel'] div[data-role="header"] { div[data-gadget-scope='panel'] div[data-role="header"] {
background-color: #252525;
color: #fff;
display: flex; display: flex;
justify-content: space-between; justify-content: flex-start;
border-color: rgba(255, 255, 255, 0.3); /*
border-width: 0 0 1px 0; > div {
border-style: solid; &:first-of-type {
} border-color: rgba(255,255,255, .3);
div[data-gadget-scope='panel'] div[data-role="header"] > div:first-of-type {
border-color: rgba(255, 255, 255, 0.3);
border-style: solid; border-style: solid;
border-width: 0 1px 0 0; border-width: 0 1px 0 0;
} }
div[data-gadget-scope='panel'] div[data-role="header"] > div:last-of-type { &:last-of-type {
border-color: rgba(255, 255, 255, 0.3); border-color: rgba(255,255,255, .3);
border-style: solid; border-style: solid;
border-width: 0 0 0 1px; border-width: 0 0 0 1px;
}
}
*/
}
div[data-gadget-scope='panel'] div[data-role="header"] .panel_img {
text-align: center;
flex: 1;
height: 2.6em;
} }
div[data-gadget-scope='panel'] div[data-role="header"] button, div[data-gadget-scope='panel'] div[data-role="header"] button,
div[data-gadget-scope='panel'] div[data-role="header"] a { div[data-gadget-scope='panel'] div[data-role="header"] a {
...@@ -455,7 +465,7 @@ div[data-gadget-scope='panel'] div[data-role="header"] a { ...@@ -455,7 +465,7 @@ div[data-gadget-scope='panel'] div[data-role="header"] a {
overflow: hidden; overflow: hidden;
text-indent: -9999px; text-indent: -9999px;
white-space: nowrap; white-space: nowrap;
background-color: #252525; background-color: #444444;
display: block; display: block;
line-height: 2.6em; line-height: 2.6em;
color: #FFFFFF; color: #FFFFFF;
...@@ -481,8 +491,7 @@ div[data-gadget-scope='panel'] div[data-role="header"] a::before { ...@@ -481,8 +491,7 @@ div[data-gadget-scope='panel'] div[data-role="header"] a::before {
} }
div[data-gadget-scope='panel'] img { div[data-gadget-scope='panel'] img {
text-align: left; text-align: left;
line-height: 2.6em; height: 100%;
max-height: 2.6em;
} }
div[data-gadget-scope='panel'] ul { div[data-gadget-scope='panel'] ul {
margin-top: 2.6em; margin-top: 2.6em;
...@@ -495,6 +504,7 @@ div[data-gadget-scope='panel'] ul li a { ...@@ -495,6 +504,7 @@ div[data-gadget-scope='panel'] ul li a {
border-style: solid; border-style: solid;
*/ */
padding: .4em; padding: .4em;
padding-left: 1em;
display: block; display: block;
text-overflow: ellipsis; text-overflow: ellipsis;
overflow: hidden; overflow: hidden;
...@@ -595,6 +605,14 @@ div[data-gadget-scope='header'] .ui-header a:active { ...@@ -595,6 +605,14 @@ div[data-gadget-scope='header'] .ui-header a:active {
background: -o-linear-gradient(bottom, #85D8CE, #0E81C2); background: -o-linear-gradient(bottom, #85D8CE, #0E81C2);
background: -ms-linear-gradient(bottom, #85D8CE, #0E81C2); background: -ms-linear-gradient(bottom, #85D8CE, #0E81C2);
} }
div[data-gadget-scope='header'] .ui-header > .ui-btn-left button,
div[data-gadget-scope='header'] .ui-header > .ui-btn-left a {
border-right: 1px solid rgba(255, 255, 255, 0.55);
}
div[data-gadget-scope='header'] .ui-header > .ui-btn-right button,
div[data-gadget-scope='header'] .ui-header > .ui-btn-right a {
border-left: 1px solid rgba(255, 255, 255, 0.55);
}
div[data-gadget-scope='header'] .ui-header .ui-controlgroup-controls button, div[data-gadget-scope='header'] .ui-header .ui-controlgroup-controls button,
div[data-gadget-scope='header'] .ui-header .ui-controlgroup-controls a { div[data-gadget-scope='header'] .ui-header .ui-controlgroup-controls a {
display: block; display: block;
...@@ -635,8 +653,6 @@ div[data-gadget-scope='header'] .ui-header h1 { ...@@ -635,8 +653,6 @@ div[data-gadget-scope='header'] .ui-header h1 {
line-height: 2.6em; line-height: 2.6em;
flex: 1; flex: 1;
color: #FFFFFF; color: #FFFFFF;
border-left: 1px solid rgba(255, 255, 255, 0.55);
border-right: 1px solid rgba(255, 255, 255, 0.55);
white-space: nowrap; white-space: nowrap;
overflow: hidden; overflow: hidden;
text-overflow: ellipsis; text-overflow: ellipsis;
...@@ -813,8 +829,7 @@ div[data-gadget-scope='header'] .ui-header ul { ...@@ -813,8 +829,7 @@ div[data-gadget-scope='header'] .ui-header ul {
} }
} }
.gadget-content .ui-field-contain { .gadget-content .ui-field-contain {
margin-bottom: 2em; padding: 0.5em 0;
padding: 0.8em 0;
} }
.gadget-content .ui-field-contain div { .gadget-content .ui-field-contain div {
width: 100%; width: 100%;
...@@ -824,8 +839,6 @@ div[data-gadget-scope='header'] .ui-header ul { ...@@ -824,8 +839,6 @@ div[data-gadget-scope='header'] .ui-header ul {
} }
.gadget-content .ui-content-title { .gadget-content .ui-content-title {
font-size: 150%; font-size: 150%;
margin-top: 1em;
margin-bottom: 1em;
} }
.gadget-content ul.document-listview li { .gadget-content ul.document-listview li {
border-color: rgba(0, 0, 0, 0.3); border-color: rgba(0, 0, 0, 0.3);
...@@ -871,17 +884,24 @@ div[data-gadget-scope='header'] .ui-header ul { ...@@ -871,17 +884,24 @@ div[data-gadget-scope='header'] .ui-header ul {
border-bottom-style: solid; border-bottom-style: solid;
} }
@media only screen and (min-width: 62em) { @media only screen and (min-width: 62em) {
.gadget-content .left, .gadget-content {
.gadget-content .right, /*
.gadget-content .center, .left, .right, .center, .bottom {
.gadget-content .bottom {
padding: 0 2%; padding: 0 2%;
} }
*/
}
.gadget-content .left, .gadget-content .left,
.gadget-content .right { .gadget-content .right {
vertical-align: top; vertical-align: top;
display: inline-block; display: inline-block;
width: 45%; width: 50%;
}
.gadget-content .left {
padding-right: 2%;
}
.gadget-content .right {
padding-left: 2%;
} }
} }
@media only screen and (min-width: 28em) and (max-width: 62em) { @media only screen and (min-width: 28em) and (max-width: 62em) {
...@@ -905,12 +925,8 @@ div[data-gadget-scope='header'] .ui-header ul { ...@@ -905,12 +925,8 @@ div[data-gadget-scope='header'] .ui-header ul {
} }
} }
@media only screen and (max-width: 28em) { @media only screen and (max-width: 28em) {
.gadget-content {
/* make sure there is a bottom border */
}
.gadget-content .ui-field-contain { .gadget-content .ui-field-contain {
padding: 0.8em 0; padding: 0.8em 0;
border-bottom: 1px solid rgba(0, 0, 0, 0.15);
} }
} }
.gadget-content form label span { .gadget-content form label span {
...@@ -933,7 +949,7 @@ div[data-gadget-scope='erp5_searchfield'] button { ...@@ -933,7 +949,7 @@ div[data-gadget-scope='erp5_searchfield'] button {
border-bottom: 2px solid rgba(0, 0, 0, 0.14902); border-bottom: 2px solid rgba(0, 0, 0, 0.14902);
} }
.document_table .ui-table-header h1 { .document_table .ui-table-header h1 {
opacity: .3; color: #777777;
flex: 2; flex: 2;
align-self: flex-end; align-self: flex-end;
} }
...@@ -976,7 +992,9 @@ div[data-gadget-scope='erp5_searchfield'] button { ...@@ -976,7 +992,9 @@ div[data-gadget-scope='erp5_searchfield'] button {
background-color: #eeeeee; background-color: #eeeeee;
background-color: rgba(0, 0, 0, 0.04); background-color: rgba(0, 0, 0, 0.04);
color: #777777; color: #777777;
text-align: center; }
.document_table table thead tr th {
padding: 0.4em 0.25em;
} }
@media only screen and (max-width: 28em) { @media only screen and (max-width: 28em) {
.document_table table thead { .document_table table thead {
...@@ -1024,10 +1042,16 @@ div[data-gadget-scope='erp5_searchfield'] button { ...@@ -1024,10 +1042,16 @@ div[data-gadget-scope='erp5_searchfield'] button {
background: #e4ebf1; background: #e4ebf1;
} }
@media only screen and (min-width: 62em), only screen and (min-width: 28em) and (max-width: 62em) { @media only screen and (min-width: 62em), only screen and (min-width: 28em) and (max-width: 62em) {
.document_table table tbody td:not(:last-child), .document_table table tbody {
.document_table table tbody th:not(:last-child) { /*
// Column border
td, th {
&:not(:last-child) {
border-right: 1px solid #DDD; border-right: 1px solid #DDD;
} }
}
*/
}
.document_table table tbody a { .document_table table tbody a {
display: block; display: block;
padding: 0.4em 0.25em; padding: 0.4em 0.25em;
......
bt5/erp5_web_renderjs_ui/PathTemplateItem/web_page_module/rjs_gadget_erp5_css.xml
View file @ 63975b4f
...@@ -230,7 +230,7 @@ ...@@ -230,7 +230,7 @@
</item> </item>
<item> <item>
<key> <string>serial</string> </key> <key> <string>serial</string> </key>
<value> <string>952.12740.62273.29252</string> </value> <value> <string>952.14349.56496.11042</string> </value>
</item> </item>
<item> <item>
<key> <string>state</string> </key> <key> <string>state</string> </key>
...@@ -248,7 +248,7 @@ ...@@ -248,7 +248,7 @@
</tuple> </tuple>
<state> <state>
<tuple> <tuple>
<float>1467271547.98</float> <float>1467291947.42</float>
<string>UTC</string> <string>UTC</string>
</tuple> </tuple>
</state> </state>
......
bt5/erp5_web_renderjs_ui/PathTemplateItem/web_page_module/rjs_gadget_erp5_panel_html.html
View file @ 63975b4f
...@@ -18,19 +18,22 @@ ...@@ -18,19 +18,22 @@
<button data-i18n="Close" class="ui-btn ui-btn-icon-notext ui-icon-delete">Close</button> <button data-i18n="Close" class="ui-btn ui-btn-icon-notext ui-icon-delete">Close</button>
</div> </div>
</div> </div>
<div class="panel_img">
<img class="ui-title" alt="ERP5" src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAJcAAAA/CAMAAADaDqrIAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyRpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuMy1jMDExIDY2LjE0NTY2MSwgMjAxMi8wMi8wNi0xNDo1NjoyNyAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENTNiAoTWFjaW50b3NoKSIgeG1wTU06SW5zdGFuY2VJRD0ieG1wLmlpZDowMEM5NUE4MzQ5NjQxMUUzOUZEQUU2NUY1RTI1RjdCQiIgeG1wTU06RG9jdW1lbnRJRD0ieG1wLmRpZDowMEM5NUE4NDQ5NjQxMUUzOUZEQUU2NUY1RTI1RjdCQiI+IDx4bXBNTTpEZXJpdmVkRnJvbSBzdFJlZjppbnN0YW5jZUlEPSJ4bXAuaWlkOjAwQzk1QTgxNDk2NDExRTM5RkRBRTY1RjVFMjVGN0JCIiBzdFJlZjpkb2N1bWVudElEPSJ4bXAuZGlkOjAwQzk1QTgyNDk2NDExRTM5RkRBRTY1RjVFMjVGN0JCIi8+IDwvcmRmOkRlc2NyaXB0aW9uPiA8L3JkZjpSREY+IDwveDp4bXBtZXRhPiA8P3hwYWNrZXQgZW5kPSJyIj8+J9MJsAAAAwBQTFRF///////M//+Z//9m//8z//8A/8z//8zM/8yZ/8xm/8wz/8wA/5n//5nM/5mZ/5lm/5kz/5kA/2b//2bM/2aZ/2Zm/2Yz/2YA/zP//zPM/zOZ/zNm/zMz/zMA/wD//wDM/wCZ/wBm/wAz/wAAzP//zP/MzP+ZzP9mzP8zzP8AzMz/zMzMzMyZzMxmzMwzzMwAzJn/zJnMzJmZzJlmzJkzzJkAzGb/zGbMzGaZzGZmzGYzzGYAzDP/zDPMzDOZzDNmzDMzzDMAzAD/zADMzACZzABmzAAzzAAAmf//mf/Mmf+Zmf9mmf8zmf8Amcz/mczMmcyZmcxmmcwzmcwAmZn/mZnMmZmZmZlmmZkzmZkAmWb/mWbMmWaZmWZmmWYzmWYAmTP/mTPMmTOZmTNmmTMzmTMAmQD/mQDMmQCZmQBmmQAzmQAAZv//Zv/MZv+ZZv9mZv8zZv8AZsz/ZszMZsyZZsxmZswzZswAZpn/ZpnMZpmZZplmZpkzZpkAZmb/ZmbMZmaZZmZmZmYzZmYAZjP/ZjPMZjOZZjNmZjMzZjMAZgD/ZgDMZgCZZgBmZgAzZgAAM///M//MM/+ZM/9mM/8zM/8AM8z/M8zMM8yZM8xmM8wzM8wAM5n/M5nMM5mZM5lmM5kzM5kAM2b/M2bMM2aZM2ZmM2YzM2YAMzP/MzPMMzOZMzNmMzMzMzMAMwD/MwDMMwCZMwBmMwAzMwAAAP//AP/MAP+ZAP9mAP8zAP8AAMz/AMzMAMyZAMxmAMwzAMwAAJn/AJnMAJmZAJlmAJkzAJkAAGb/AGbMAGaZAGZmAGYzAGYAADP/ADPMADOZADNmADMzADMAAAD/AADMAACZAABmAAAzAAAAHHa7K3/AOojESZHJWZvNaKTSd63Whrbblb/fpMjks9Howtrt4e320uTx8Pb6AAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAdfKHSQAAAOh0Uk5T////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////ALItoLoAAAJkSURBVHja7NlZsqsgEABQ979C5kGGddxo4os0Q8BAynoFn0nUU23TNGRB9xzLdE3XdE3XdP2fLnIzF2VSrsYvC72HizAh9eZ5DVuOl15S4/jWwC+kDC8HPzCSJVHcRY8QXV2PwQuujUYTsYrvYlBv1yKLrsXHsPghnvR3Lazoip/JKuwpF8sm6/bY01Ow9CBlTXi53PNoRcUktEZT1NV1PIPnXAjtMJIMlzerFIzU1dVWF7aPj3Tetae4gjdxktG2et/qQjJ4kZFrv6ED4bK4eR1qduHzvEi4+PbGwD0EGu9CQQLFrv1F4jBc6BcuW3YhkPiPX1hOfxQvnHfh0HVMRqc4HuqiQf5k3mO6dq1s8Hx0H/Le5kq9YaNcxAcrZLpOvAv+ClcgNcZFtnrucd5Fwx4mXj0drnbBYXMuJmFDAV3Uhm4qlbHh3ddOrmholHNxFTVC+xTl2mf6pI4uVe4LwSp0DPGOmh/hAnM94bKZjkHlWuiLeV+cTab4luMKk82wy/Px2fLJskvKUk03hRf9RZ0wiYiZ4uVwVwTb9E71y0XboTYXGuTaa33Y47W5zBjXM3P11y7TfR2ycFdxyaW7uwSc5m0un9ix91m3TWJfW+1ijfW+wcVAfjS5dOP62LyvZZdcLHnA1MkFAtbgwq+Vm47po8OA1buwyy/a1ec5urzveAes2sV8kfW963mFaHNhlT0b6+Yi5+StchH1CtaK0ThXELDPLiyOPZHldzm/J1z9O/B14g7/K+DtkP7U8ivSeD4xaPCTSQvy+YIfubZWzRgtRe1iMP+3mq7pmq7p6jv+BBgAPrgi/TzwWzkAAAAASUVORK5CYII="/> <img class="ui-title" alt="ERP5" src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAJcAAAA/CAMAAADaDqrIAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyRpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuMy1jMDExIDY2LjE0NTY2MSwgMjAxMi8wMi8wNi0xNDo1NjoyNyAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENTNiAoTWFjaW50b3NoKSIgeG1wTU06SW5zdGFuY2VJRD0ieG1wLmlpZDowMEM5NUE4MzQ5NjQxMUUzOUZEQUU2NUY1RTI1RjdCQiIgeG1wTU06RG9jdW1lbnRJRD0ieG1wLmRpZDowMEM5NUE4NDQ5NjQxMUUzOUZEQUU2NUY1RTI1RjdCQiI+IDx4bXBNTTpEZXJpdmVkRnJvbSBzdFJlZjppbnN0YW5jZUlEPSJ4bXAuaWlkOjAwQzk1QTgxNDk2NDExRTM5RkRBRTY1RjVFMjVGN0JCIiBzdFJlZjpkb2N1bWVudElEPSJ4bXAuZGlkOjAwQzk1QTgyNDk2NDExRTM5RkRBRTY1RjVFMjVGN0JCIi8+IDwvcmRmOkRlc2NyaXB0aW9uPiA8L3JkZjpSREY+IDwveDp4bXBtZXRhPiA8P3hwYWNrZXQgZW5kPSJyIj8+J9MJsAAAAwBQTFRF///////M//+Z//9m//8z//8A/8z//8zM/8yZ/8xm/8wz/8wA/5n//5nM/5mZ/5lm/5kz/5kA/2b//2bM/2aZ/2Zm/2Yz/2YA/zP//zPM/zOZ/zNm/zMz/zMA/wD//wDM/wCZ/wBm/wAz/wAAzP//zP/MzP+ZzP9mzP8zzP8AzMz/zMzMzMyZzMxmzMwzzMwAzJn/zJnMzJmZzJlmzJkzzJkAzGb/zGbMzGaZzGZmzGYzzGYAzDP/zDPMzDOZzDNmzDMzzDMAzAD/zADMzACZzABmzAAzzAAAmf//mf/Mmf+Zmf9mmf8zmf8Amcz/mczMmcyZmcxmmcwzmcwAmZn/mZnMmZmZmZlmmZkzmZkAmWb/mWbMmWaZmWZmmWYzmWYAmTP/mTPMmTOZmTNmmTMzmTMAmQD/mQDMmQCZmQBmmQAzmQAAZv//Zv/MZv+ZZv9mZv8zZv8AZsz/ZszMZsyZZsxmZswzZswAZpn/ZpnMZpmZZplmZpkzZpkAZmb/ZmbMZmaZZmZmZmYzZmYAZjP/ZjPMZjOZZjNmZjMzZjMAZgD/ZgDMZgCZZgBmZgAzZgAAM///M//MM/+ZM/9mM/8zM/8AM8z/M8zMM8yZM8xmM8wzM8wAM5n/M5nMM5mZM5lmM5kzM5kAM2b/M2bMM2aZM2ZmM2YzM2YAMzP/MzPMMzOZMzNmMzMzMzMAMwD/MwDMMwCZMwBmMwAzMwAAAP//AP/MAP+ZAP9mAP8zAP8AAMz/AMzMAMyZAMxmAMwzAMwAAJn/AJnMAJmZAJlmAJkzAJkAAGb/AGbMAGaZAGZmAGYzAGYAADP/ADPMADOZADNmADMzADMAAAD/AADMAACZAABmAAAzAAAAHHa7K3/AOojESZHJWZvNaKTSd63Whrbblb/fpMjks9Howtrt4e320uTx8Pb6AAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAdfKHSQAAAOh0Uk5T////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////ALItoLoAAAJkSURBVHja7NlZsqsgEABQ979C5kGGddxo4os0Q8BAynoFn0nUU23TNGRB9xzLdE3XdE3XdP2fLnIzF2VSrsYvC72HizAh9eZ5DVuOl15S4/jWwC+kDC8HPzCSJVHcRY8QXV2PwQuujUYTsYrvYlBv1yKLrsXHsPghnvR3Lazoip/JKuwpF8sm6/bY01Ow9CBlTXi53PNoRcUktEZT1NV1PIPnXAjtMJIMlzerFIzU1dVWF7aPj3Tetae4gjdxktG2et/qQjJ4kZFrv6ED4bK4eR1qduHzvEi4+PbGwD0EGu9CQQLFrv1F4jBc6BcuW3YhkPiPX1hOfxQvnHfh0HVMRqc4HuqiQf5k3mO6dq1s8Hx0H/Le5kq9YaNcxAcrZLpOvAv+ClcgNcZFtnrucd5Fwx4mXj0drnbBYXMuJmFDAV3Uhm4qlbHh3ddOrmholHNxFTVC+xTl2mf6pI4uVe4LwSp0DPGOmh/hAnM94bKZjkHlWuiLeV+cTab4luMKk82wy/Px2fLJskvKUk03hRf9RZ0wiYiZ4uVwVwTb9E71y0XboTYXGuTaa33Y47W5zBjXM3P11y7TfR2ycFdxyaW7uwSc5m0un9ix91m3TWJfW+1ijfW+wcVAfjS5dOP62LyvZZdcLHnA1MkFAtbgwq+Vm47po8OA1buwyy/a1ec5urzveAes2sV8kfW963mFaHNhlT0b6+Yi5+StchH1CtaK0ThXELDPLiyOPZHldzm/J1z9O/B14g7/K+DtkP7U8ivSeD4xaPCTSQvy+YIfubZWzRgtRe1iMP+3mq7pmq7p6jv+BBgAPrgi/TzwWzkAAAAASUVORK5CYII="/>
<div class="ui-controlgroup ui-controlgroup-horizontal ui-btn-right"> </div>
<!--div class="ui-controlgroup ui-controlgroup-horizontal ui-btn-right">
<div class="ui-controlgroup-controls"> <div class="ui-controlgroup-controls">
<a href="#" class="ui-btn ui-btn-icon-notext ui-icon-home" data-i18n="Home">Home</a> <a href="#" class="ui-btn ui-btn-icon-notext ui-icon-home" data-i18n="Home">Home</a>
</div> </div>
</div> </div-->
</div> </div>
</script> </script>
<script id="panel-template-body" type="text/x-handlebars-template"> <script id="panel-template-body" type="text/x-handlebars-template">
<div class="ui-content"> <div class="ui-content">
<ul data-role="listview" class="ui-listview" data-enhanced="true"> <ul data-role="listview" class="ui-listview" data-enhanced="true">
<li class="ui-first-child"><a href="{{module_href}}" class="ui-btn ui-btn-icon-left ui-icon-puzzle-piece" data-i18n="Modules" accesskey="m">Modules</a></li> <li class="ui-first-child"><a href="#" class="ui-btn ui-btn-icon-left ui-icon-home" data-i18n="Home">Home</a></li>
<li><a href="{{module_href}}" class="ui-btn ui-btn-icon-left ui-icon-puzzle-piece" data-i18n="Modules" accesskey="m">Modules</a></li>
<li><a href="{{worklist_href}}" class="ui-btn ui-btn-icon-left ui-icon-clipboard" data-i18n="Worklists" accesskey="w">Worklists</a></li> <li><a href="{{worklist_href}}" class="ui-btn ui-btn-icon-left ui-icon-clipboard" data-i18n="Worklists" accesskey="w">Worklists</a></li>
<li><a href="{{history_href}}" class="ui-btn ui-btn-icon-left ui-icon-history" data-i18n="History" accesskey="h">History</a></li> <li><a href="{{history_href}}" class="ui-btn ui-btn-icon-left ui-icon-history" data-i18n="History" accesskey="h">History</a></li>
<li><a href="{{search_href}}" class="ui-btn ui-btn-icon-left ui-icon-search" data-i18n="History" accesskey="s">Search</a></li> <li><a href="{{search_href}}" class="ui-btn ui-btn-icon-left ui-icon-search" data-i18n="History" accesskey="s">Search</a></li>
......
bt5/erp5_web_renderjs_ui/PathTemplateItem/web_page_module/rjs_gadget_erp5_panel_html.xml
View file @ 63975b4f
...@@ -234,7 +234,7 @@ ...@@ -234,7 +234,7 @@
</item> </item>
<item> <item>
<key> <string>serial</string> </key> <key> <string>serial</string> </key>
<value> <string>952.1567.4220.17373</string> </value> <value> <string>952.14137.61057.25617</string> </value>
</item> </item>
<item> <item>
<key> <string>state</string> </key> <key> <string>state</string> </key>
...@@ -252,7 +252,7 @@ ...@@ -252,7 +252,7 @@
</tuple> </tuple>
<state> <state>
<tuple> <tuple>
<float>1467031987.88</float> <float>1467279122.77</float>
<string>UTC</string> <string>UTC</string>
</tuple> </tuple>
</state> </state>
......
bt5/erp5_web_renderjs_ui/SkinTemplateItem/portal_skins/erp5_web_renderjs_ui/erp5css.less.txt
View file @ 63975b4f
...@@ -315,7 +315,7 @@ label { ...@@ -315,7 +315,7 @@ label {
color: @grey; color: @grey;
} }
input:not([type=submit]):not([type=file]):not([type=checkbox]):not([type=radio]):not([type=color]) { input:not([type=submit]):not([type=file]):not([type=checkbox]):not([type=radio]):not([type=color]), textarea {
width: 100%; width: 100%;
margin: 0; margin: 0;
...@@ -402,11 +402,13 @@ textarea { ...@@ -402,11 +402,13 @@ textarea {
height: 15em; height: 15em;
width: 100%; width: 100%;
margin: 0; margin: 0;
/*
padding: 0.5em; padding: 0.5em;
border: none; border: none;
background-color: @colortextboxbackground; background-color: @colortextboxbackground;
color: @colortextboxforeground; color: @colortextboxforeground;
border-radius: 0; border-radius: 0;
*/
font-family: @monospace; font-family: @monospace;
} }
...@@ -514,16 +516,16 @@ div[data-gadget-scope='panel'] { ...@@ -514,16 +516,16 @@ div[data-gadget-scope='panel'] {
div[data-role="header"] { div[data-role="header"] {
background-color: #252525; // background-color: #252525;
color: #fff; // color: #fff;
display: flex; display: flex;
justify-content: space-between; justify-content: flex-start;
border-color: rgba(255,255,255, .3); // border-color: rgba(255,255,255, .3);
border-width: 0 0 1px 0; // border-width: 0 0 1px 0;
border-style: solid; // border-style: solid;
/*
> div { > div {
&:first-of-type { &:first-of-type {
border-color: rgba(255,255,255, .3); border-color: rgba(255,255,255, .3);
...@@ -536,11 +538,18 @@ div[data-gadget-scope='panel'] { ...@@ -536,11 +538,18 @@ div[data-gadget-scope='panel'] {
border-width: 0 0 0 1px; border-width: 0 0 0 1px;
} }
} }
*/
.panel_img {
text-align: center;
flex: 1;
height: @headerheight;
}
button, a { button, a {
.hide_text(); .hide_text();
background-color: #252525; // XXX TODO: same color than panel background
background-color: #444444;
&::before { &::before {
float: left; float: left;
...@@ -572,8 +581,9 @@ div[data-gadget-scope='panel'] { ...@@ -572,8 +581,9 @@ div[data-gadget-scope='panel'] {
img { img {
text-align: left; text-align: left;
line-height: @headerheight; // line-height: @headerheight;
max-height: @headerheight; // max-height: @headerheight;
height: 100%;
// flex: 1; // flex: 1;
} }
...@@ -590,6 +600,7 @@ div[data-gadget-scope='panel'] { ...@@ -590,6 +600,7 @@ div[data-gadget-scope='panel'] {
border-style: solid; border-style: solid;
*/ */
padding: .4em; padding: .4em;
padding-left: 1em;
display: block; display: block;
// position: relative; // position: relative;
// text-align: left; // text-align: left;
...@@ -727,7 +738,20 @@ div[data-gadget-scope='header'] .ui-header { ...@@ -727,7 +738,20 @@ div[data-gadget-scope='header'] .ui-header {
} }
} }
// XXX TODO: restore border to separate title from button/links
& > .ui-btn-left {
button, a {
border-right: 1px solid rgba(255, 255, 255, 0.55);
}
}
& > .ui-btn-right {
button, a {
border-left: 1px solid rgba(255, 255, 255, 0.55);
}
}
.ui-controlgroup-controls { .ui-controlgroup-controls {
button, a { button, a {
display: block; display: block;
...@@ -768,8 +792,9 @@ div[data-gadget-scope='header'] .ui-header { ...@@ -768,8 +792,9 @@ div[data-gadget-scope='header'] .ui-header {
color: @white; color: @white;
border-left: 1px solid rgba(255, 255, 255, 0.55); // XXX Restore border
border-right: 1px solid rgba(255, 255, 255, 0.55); // border-left: 1px solid rgba(255, 255, 255, 0.55);
// border-right: 1px solid rgba(255, 255, 255, 0.55);
// Do not put title on multi line in case of small screen // Do not put title on multi line in case of small screen
white-space: nowrap; white-space: nowrap;
...@@ -900,6 +925,7 @@ div[data-gadget-scope='header'] .ui-header { ...@@ -900,6 +925,7 @@ div[data-gadget-scope='header'] .ui-header {
.gadget-content { .gadget-content {
@media @desktop { @media @desktop {
// Keep the panel always visible
margin-left: @panelwidth; margin-left: @panelwidth;
} }
...@@ -921,9 +947,7 @@ div[data-gadget-scope='header'] .ui-header { ...@@ -921,9 +947,7 @@ div[data-gadget-scope='header'] .ui-header {
// Label // Label
.ui-field-contain { .ui-field-contain {
margin-bottom: 2em; padding: 0.5em 0;
padding: 0.8em 0;
// margin: 0 0 12px 0;
div { div {
width: 100%; width: 100%;
...@@ -945,8 +969,8 @@ div[data-gadget-scope='header'] .ui-header { ...@@ -945,8 +969,8 @@ div[data-gadget-scope='header'] .ui-header {
.ui-content-title { .ui-content-title {
font-size: 150%; font-size: 150%;
margin-top: 1em; // margin-top: 1em;
margin-bottom: 1em; // margin-bottom: 1em;
} }
...@@ -1002,13 +1026,22 @@ div[data-gadget-scope='header'] .ui-header { ...@@ -1002,13 +1026,22 @@ div[data-gadget-scope='header'] .ui-header {
} }
@media @desktop { @media @desktop {
/*
.left, .right, .center, .bottom { .left, .right, .center, .bottom {
padding: 0 2%; padding: 0 2%;
} }
*/
.left, .right { .left, .right {
vertical-align: top; vertical-align: top;
display: inline-block; display: inline-block;
width: 45%; width: 50%;
}
.left {
padding-right: 2%;
}
.right {
padding-left: 2%;
} }
} }
...@@ -1035,10 +1068,11 @@ div[data-gadget-scope='header'] .ui-header { ...@@ -1035,10 +1068,11 @@ div[data-gadget-scope='header'] .ui-header {
} }
@media @smartphone { @media @smartphone {
/* make sure there is a bottom border */
.ui-field-contain { .ui-field-contain {
padding: 0.8em 0; padding: 0.8em 0;
border-bottom: 1px solid rgba(0, 0, 0, 0.15); // make sure there is a bottom border
// XXX TODO: border should be visible only if not input
// border-bottom: 1px solid rgba(0, 0, 0, 0.15);
} }
} }
...@@ -1073,7 +1107,8 @@ div[data-gadget-scope='erp5_searchfield'] { ...@@ -1073,7 +1107,8 @@ div[data-gadget-scope='erp5_searchfield'] {
border-bottom: 2px solid rgba(0, 0, 0, 0.14902); border-bottom: 2px solid rgba(0, 0, 0, 0.14902);
h1 { h1 {
opacity: .3; // XXX TODO Same color than label
color: @grey;
flex: 2; flex: 2;
align-self: flex-end; align-self: flex-end;
} }
...@@ -1115,7 +1150,14 @@ div[data-gadget-scope='erp5_searchfield'] { ...@@ -1115,7 +1150,14 @@ div[data-gadget-scope='erp5_searchfield'] {
background-color: #eeeeee; background-color: #eeeeee;
background-color: rgba(0, 0, 0, .04); background-color: rgba(0, 0, 0, .04);
color: #777777; color: #777777;
text-align: center;
// XXX Same than cells
tr { th {
padding: 0.4em 0.25em;
}}
// text-align: center;
@media @smartphone { @media @smartphone {
display: none; display: none;
...@@ -1139,11 +1181,16 @@ div[data-gadget-scope='erp5_searchfield'] { ...@@ -1139,11 +1181,16 @@ div[data-gadget-scope='erp5_searchfield'] {
} }
@media @desktop, @tablet { @media @desktop, @tablet {
/*
// Column border
td, th { td, th {
&:not(:last-child) { &:not(:last-child) {
border-right: 1px solid #DDD; border-right: 1px solid #DDD;
} }
} }
*/
a { a {
display: block; display: block;
padding: 0.4em 0.25em; padding: 0.4em 0.25em;
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment
GitLab Nexedi Edition | About GitLab | About Nexedi | 沪ICP备2021021310号-2 | 沪ICP备2021021310号-7