Skip to content

erp5
erp5
Commit 7aab18e6 authored by Romain Courteaud's avatar Romain Courteaud
Browse files
Options

[erp5_web_renderjs_ui] Clean up a bit the CSS

parent 57a1cb9c
Hide whitespace changes
Inline Side-by-side
Showing with 33 additions and 303 deletions
bt5/erp5_web_renderjs_ui/PathTemplateItem/web_page_module/rjs_gadget_erp5_css.css
View file @ 7aab18e6
......@@ -274,7 +274,7 @@ textarea {
border: none;
background-color: #FFFFFF;
color: #1F1F1F;
border-radius: .325em;
border-radius: 0.325em;
border-width: 1px;
border-style: solid;
border-color: rgba(0, 0, 0, 0.3);
......@@ -304,7 +304,7 @@ select {
border: none;
background-color: #FFFFFF;
color: #1F1F1F;
border-radius: .325em;
border-radius: 0.325em;
border-width: 1px;
border-style: solid;
border-color: rgba(0, 0, 0, 0.3);
......@@ -312,15 +312,6 @@ select {
-moz-box-shadow: inset 0 1px 3px rgba(0, 0, 0, 0.2);
box-shadow: inset 0 1px 3px rgba(0, 0, 0, 0.2);
outline-offset: 0;
/*
appearance: none;
-webkit-appearance: none;
-moz-appearance: none;
&:after {
content: "â–¶";
text-align: right;
float:right
}*/
}
select:hover,
select:active,
......@@ -337,13 +328,6 @@ textarea {
height: 15em;
width: 100%;
margin: 0;
/*
padding: 0.5em;
border: none;
background-color: @colortextboxbackground;
color: @colortextboxforeground;
border-radius: 0;
*/
font-family: "Courier New", Courier, monospace;
}
::-webkit-input-placeholder {
......@@ -362,11 +346,6 @@ textarea {
}
input[type=submit],
button {
/*
margin: 0;
margin-bottom: 1em;
padding: 0.5em 2em;
*/
margin: 0;
padding: 0;
border: none;
......@@ -411,7 +390,7 @@ img {
div[data-gadget-scope='panel'] {
background-color: #444444;
border-color: #888888;
color: #fff;
color: #FFFFFF;
width: 17em;
min-height: 100%;
max-height: none;
......@@ -439,20 +418,6 @@ div[data-gadget-scope='panel'] {
div[data-gadget-scope='panel'] div[data-role="header"] {
display: flex;
justify-content: flex-start;
/*
> div {
&:first-of-type {
border-color: rgba(255,255,255, .3);
border-style: solid;
border-width: 0 1px 0 0;
}
&:last-of-type {
border-color: rgba(255,255,255, .3);
border-style: solid;
border-width: 0 0 0 1px;
}
}
*/
}
div[data-gadget-scope='panel'] div[data-role="header"] .panel_img {
text-align: center;
......@@ -469,13 +434,6 @@ div[data-gadget-scope='panel'] div[data-role="header"] a {
display: block;
line-height: 2.6em;
color: #FFFFFF;
/*
&[name="panel"] {
@media @desktop {
display: none;
}
}
*/
}
div[data-gadget-scope='panel'] div[data-role="header"] button::before,
div[data-gadget-scope='panel'] div[data-role="header"] a::before {
......@@ -497,12 +455,7 @@ div[data-gadget-scope='panel'] ul {
margin-top: 2.6em;
}
div[data-gadget-scope='panel'] ul li a {
color: #ffffff;
/*
border-color: rgba(255,255,255, .3);
border-width: 1px 0 0 0;
border-style: solid;
*/
color: #FFFFFF;
padding: .4em;
padding-left: 1em;
display: block;
......@@ -520,7 +473,7 @@ div[data-gadget-scope='editor_panel'] {
background-color: #444444;
border-color: #888888;
box-shadow: 5px 0 0 5px rgba(0, 0, 0, 0.15);
color: #fff;
color: #FFFFFF;
width: 17em;
min-height: 100%;
max-height: none;
......@@ -538,7 +491,7 @@ div[data-gadget-scope='editor_panel'].visible {
}
div[data-gadget-scope='editor_panel'] div[data-role="header"] {
background-color: #252525;
color: #fff;
color: #FFFFFF;
display: flex;
justify-content: space-between;
border-color: rgba(255, 255, 255, 0.3);
......@@ -767,11 +720,6 @@ div[data-gadget-scope='header'] .ui-header ul {
.gadget-content {
padding: 2em;
padding-top: 9em;
/*
.ui-has-subheader {
padding-top: 7em;
}
*/
/* middle screen */
/* form validation (assuming label>span is used) */
}
......@@ -842,13 +790,6 @@ div[data-gadget-scope='header'] .ui-header ul {
border-bottom-style: solid;
}
@media only screen and (min-width: 62em) {
.gadget-content {
/*
.left, .right, .center, .bottom {
padding: 0 2%;
}
*/
}
.gadget-content .left,
.gadget-content .right {
vertical-align: top;
......@@ -918,7 +859,7 @@ div[data-gadget-scope='erp5_searchfield'] button {
.document_table .ui-table-header button {
padding: 0.5em;
border: 1px solid rgba(0, 0, 0, 0.14);
border-radius: 0.315em;
border-radius: 0.325em;
margin-right: 0.5em;
}
.document_table .ui-table-header button:last-of-type {
......@@ -951,11 +892,6 @@ div[data-gadget-scope='erp5_searchfield'] button {
vertical-align: middle;
}
.document_table table thead {
/*
background-color: #eeeeee;
background-color: rgba(0, 0, 0, .04);
color: #777777;
*/
background-color: #0E81C2;
color: #FFFFFF;
}
......@@ -970,36 +906,6 @@ div[data-gadget-scope='erp5_searchfield'] button {
.document_table table a {
color: #1F1F1F;
}
.document_table table tbody {
/*
@media @smartphone {
tr {
line-height: 3em;
}
th {
display: none;
&:first-of-type {
display: block;
a {
display: block;
text-align: left;
padding-left: 0.5em;
&:after {
// XXX copy/pasted
font-family: FontAwesome;
content: "\f0da";
text-align: right;
float:right;
padding-right: 0.5em;
padding-left: 0.5em;
}
}
}
}
}
*/
}
.document_table table tbody tr:nth-child(even) {
background-color: #eeeeee;
background-color: rgba(0, 0, 0, 0.04);
......@@ -1008,16 +914,6 @@ div[data-gadget-scope='erp5_searchfield'] button {
background: #e4ebf1;
}
@media only screen and (min-width: 62em), only screen and (min-width: 28em) and (max-width: 62em) {
.document_table table tbody {
/*
// Column border
td, th {
&:not(:last-child) {
border-right: 1px solid #DDD;
}
}
*/
}
.document_table table tbody a {
display: block;
padding: 0.4em 0.25em;
......@@ -1097,7 +993,7 @@ div[data-gadget-scope='erp5_searchfield'] button {
.document_table table tfoot .ui-controlgroup-controls a {
padding: 0.5em;
border: 1px solid rgba(0, 0, 0, 0.14);
border-radius: 0.315em;
border-radius: 0.325em;
margin-right: 0.5em;
}
.document_table table tfoot .ui-controlgroup-controls a:last-of-type {
......
bt5/erp5_web_renderjs_ui/PathTemplateItem/web_page_module/rjs_gadget_erp5_css.xml
View file @ 7aab18e6
......@@ -230,7 +230,7 @@
</item>
<item>
<key> <string>serial</string> </key>
<value> <string>952.21277.40593.7202</string> </value>
<value> <string>952.24208.10266.65160</string> </value>
</item>
<item>
<key> <string>state</string> </key>
......@@ -248,7 +248,7 @@
</tuple>
<state>
<tuple>
<float>1467621439.3</float>
<float>1467798268.0</float>
<string>UTC</string>
</tuple>
</state>
......
bt5/erp5_web_renderjs_ui/SkinTemplateItem/portal_skins/erp5_web_renderjs_ui/erp5css.less.txt
View file @ 7aab18e6
......@@ -14,18 +14,6 @@
@colorbackground: @white;
// Default foreground and border color
@colorforeground: @black;
// Background for contrasting elements
@colorcontrastbackground: @black;
// Foreground for contrasting elements
@colorcontrastforeground: @white;
// @colorinactive: @;
// Disabled foreground color
// @colordisabled: @;
// Subtle foreground and border
// @colorsubtle: @;
// @colorborder: @;
@colortextselection: @txtgreen;
// Foreground color to single-out items of interest
@coloraccent: @txtorange;
......@@ -39,6 +27,10 @@
@colorsubheaderbackground: #0E81C2;
@colorsubheaderlink: #f8fff3;
@panelbackgroundcolor: #444444;
@radius: .325em;
@headerheight: 2.6em;
@headertitleleftlargemargin: 4em;
@headertitleleftsmallmargin: 2em;
......@@ -326,7 +318,7 @@ input:not([type=submit]):not([type=file]):not([type=checkbox]):not([type=radio])
background-color: @colortextboxbackground;
color: @colortextboxforeground;
border-radius: .325em;
border-radius: @radius;
border-width: 1px;
border-style: solid;
......@@ -360,29 +352,16 @@ select {
border: none;
background-color: @colortextboxbackground;
color: @colortextboxforeground;
// border-radius: 0;
border-radius: .325em;
border-radius: @radius;
border-width: 1px;
border-style: solid;
// border-color: #ddd;
border-color: rgba(0, 0, 0, 0.3);
// box-shadow: inset 0 1px 3px;
-webkit-box-shadow: inset 0 1px 3px rgba(0,0,0,.2);
-moz-box-shadow: inset 0 1px 3px rgba(0,0,0,.2);
box-shadow: inset 0 1px 3px rgba(0,0,0,.2);
// font-family: @monospace;
// outline: 2px @border-type @colortextboxbackground;
outline-offset: 0;
/*
appearance: none;
-webkit-appearance: none;
-moz-appearance: none;
&:after {
content: "â–¶";
text-align: right;
float:right
}*/
&:hover, &:active, &:focus {
background-color: #e0e0e0;
background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#eeeeee), to(#f5f5f5));
......@@ -391,24 +370,13 @@ select {
background: -moz-linear-gradient(bottom, #eeeeee, #f5f5f5);
background: -o-linear-gradient(bottom, #eeeeee, #f5f5f5);
background: -ms-linear-gradient(bottom, #eeeeee, #f5f5f5);
// color: #222222;
// text-shadow: none;
// border-color: rgb(0, 0, 0);
// border-color: rgba(0, 0, 0, 0.5);
}
}
textarea {
height: 15em;
width: 100%;
margin: 0;
/*
padding: 0.5em;
border: none;
background-color: @colortextboxbackground;
color: @colortextboxforeground;
border-radius: 0;
*/
width: 100%;
margin: 0;
font-family: @monospace;
}
......@@ -434,15 +402,9 @@ input[type=submit], button {
padding: 0px;
}
/*
margin: 0;
margin-bottom: 1em;
padding: 0.5em 2em;
*/
margin: 0;
padding: 0;
border: none;
// background-image: none;
background-color: @colorbackground;
color: @colorforeground;
......@@ -484,16 +446,14 @@ img {
**********************************************/
div[data-gadget-scope='panel'] {
// background-color: #252525;
background-color: #444444;
background-color: @panelbackgroundcolor;
// border-color: #454545;
border-color: #888888;
@media @smartphone, @tablet {
box-shadow: 5px 0 5px rgba(0,0,0,.15);
}
color: #fff;
color: @white;
width: @panelwidth;
min-height: 100%;
......@@ -515,30 +475,9 @@ div[data-gadget-scope='panel'] {
div[data-role="header"] {
// background-color: #252525;
// color: #fff;
display: flex;
justify-content: flex-start;
// border-color: rgba(255,255,255, .3);
// border-width: 0 0 1px 0;
// border-style: solid;
/*
> div {
&:first-of-type {
border-color: rgba(255,255,255, .3);
border-style: solid;
border-width: 0 1px 0 0;
}
&:last-of-type {
border-color: rgba(255,255,255, .3);
border-style: solid;
border-width: 0 0 0 1px;
}
}
*/
.panel_img {
text-align: center;
flex: 1;
......@@ -547,8 +486,7 @@ div[data-gadget-scope='panel'] {
button, a {
.hide_text();
// XXX TODO: same color than panel background
background-color: #444444;
background-color: @panelbackgroundcolor;
&::before {
......@@ -567,24 +505,12 @@ div[data-gadget-scope='panel'] {
line-height: @headerheight;
color: @white;
// background-color: @colorheaderbackground;
/*
&[name="panel"] {
@media @desktop {
display: none;
}
}
*/
}
}
img {
text-align: left;
// line-height: @headerheight;
// max-height: @headerheight;
height: 100%;
// flex: 1;
}
......@@ -593,23 +519,15 @@ div[data-gadget-scope='panel'] {
margin-top: @headerheight;
li {
a {
color: #ffffff;
/*
border-color: rgba(255,255,255, .3);
border-width: 1px 0 0 0;
border-style: solid;
*/
color: @white;
padding: .4em;
padding-left: 1em;
display: block;
// position: relative;
// text-align: left;
text-overflow: ellipsis;
overflow: hidden;
white-space: nowrap;
&::before {
// margin-right: 1em;
width: 2em;
}
}
......@@ -624,14 +542,12 @@ div[data-gadget-scope='panel'] {
div[data-gadget-scope='editor_panel'] {
// background-color: #252525;
background-color: #444444;
background-color: @panelbackgroundcolor;
// border-color: #454545;
border-color: #888888;
box-shadow: 5px 0 0 5px rgba(0,0,0,.15);
color: #fff;
color: @white;
width: @panelwidth;
min-height: 100%;
......@@ -654,7 +570,7 @@ div[data-gadget-scope='editor_panel'] {
div[data-role="header"] {
background-color: #252525;
color: #fff;
color: @white;
display: flex;
justify-content: space-between;
......@@ -667,7 +583,6 @@ div[data-gadget-scope='editor_panel'] {
text-align: left;
line-height: @headerheight;
max-height: @headerheight;
// flex: 1;
}
> div {
......@@ -698,7 +613,6 @@ div[data-gadget-scope='editor_panel'] {
line-height: @headerheight;
color: @white;
// background-color: @colorheaderbackground;
}
}
......@@ -712,7 +626,6 @@ div[data-gadget-scope='editor_panel'] {
**********************************************/
div[data-gadget-scope='header'] .ui-header {
// width: 100%;
position: fixed;
z-index: 1000;
text-align: center;
......@@ -726,7 +639,7 @@ div[data-gadget-scope='header'] .ui-header {
button, a {
&:hover, &:active {
background-color: #085078;
background-color: @colorheaderbackground;
background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#85D8CE), to(#0E81C2));
background: -webkit-linear-gradient(bottom, #85D8CE, #0E81C2);
background: linear-gradient(bottom, #85D8CE, #0E81C2);
......@@ -849,7 +762,6 @@ div[data-gadget-scope='header'] .ui-header {
.ui-subheader {
// display: block;
@media @desktop {
text-align: left;
}
......@@ -888,7 +800,6 @@ div[data-gadget-scope='header'] .ui-header {
&::before {
display: none;
// padding-right: 0.3em;
}
}
......@@ -948,13 +859,6 @@ div[data-gadget-scope='header'] .ui-header {
padding-top: 8em;
}
/*
.ui-has-subheader {
padding-top: 7em;
}
*/
// Label
.ui-field-contain {
......@@ -966,23 +870,11 @@ div[data-gadget-scope='header'] .ui-header {
label {
margin: 0 0 0.4em;
// padding: 0.4em;
// line-height: 1.4em;
// text-align: left;
// margin: 0 8px 0 0;
// padding: 2px 0;
}
}
.ui-content-title {
font-size: 150%;
// margin-top: 1em;
// margin-bottom: 1em;
}
ul.document-listview {
......@@ -1011,10 +903,6 @@ div[data-gadget-scope='header'] .ui-header {
background: -moz-linear-gradient(bottom, #eeeeee, #f5f5f5);
background: -o-linear-gradient(bottom, #eeeeee, #f5f5f5);
background: -ms-linear-gradient(bottom, #eeeeee, #f5f5f5);
// color: #222222;
// text-shadow: none;
// border-color: rgb(0, 0, 0);
// border-color: rgba(0, 0, 0, 0.5);
}
&:focus {
-webkit-box-shadow: 0 0 12px #3388cc;
......@@ -1023,26 +911,18 @@ div[data-gadget-scope='header'] .ui-header {
}
}
&:first-child {
border-top-left-radius: 0.325em;
border-top-right-radius: 0.325em;
border-top-left-radius: @radius;
border-top-right-radius: @radius;
}
&:last-child {
border-bottom-left-radius: 0.325em;
border-bottom-right-radius: 0.325em;
border-bottom-left-radius: @radius;
border-bottom-right-radius: @radius;
border-bottom-style: solid;
// box-shadow: 0 1px 3px;
}
}
}
@media @desktop {
/*
.left, .right, .center, .bottom {
padding: 0 2%;
}
*/
.left, .right {
vertical-align: top;
display: inline-block;
......@@ -1128,7 +1008,7 @@ div[data-gadget-scope='erp5_searchfield'] {
button {
padding: 0.5em;
border: 1px solid rgba(0, 0, 0, 0.14);
border-radius: 0.315em;
border-radius: @radius;
margin-right: 0.5em;
&:last-of-type {
......@@ -1160,13 +1040,7 @@ div[data-gadget-scope='erp5_searchfield'] {
}
thead {
/*
background-color: #eeeeee;
background-color: rgba(0, 0, 0, .04);
color: #777777;
*/
background-color: @colorsubheaderbackground;
// background-color: @colorheaderbackground;
color: @white;
......@@ -1199,16 +1073,6 @@ div[data-gadget-scope='erp5_searchfield'] {
}
@media @desktop, @tablet {
/*
// Column border
td, th {
&:not(:last-child) {
border-right: 1px solid #DDD;
}
}
*/
a {
display: block;
padding: 0.4em 0.25em;
......@@ -1279,36 +1143,6 @@ div[data-gadget-scope='erp5_searchfield'] {
}
}
}
/*
@media @smartphone {
tr {
line-height: 3em;
}
th {
display: none;
&:first-of-type {
display: block;
a {
display: block;
text-align: left;
padding-left: 0.5em;
&:after {
// XXX copy/pasted
font-family: FontAwesome;
content: "\f0da";
text-align: right;
float:right;
padding-right: 0.5em;
padding-left: 0.5em;
}
}
}
}
}
*/
}
......@@ -1325,7 +1159,7 @@ div[data-gadget-scope='erp5_searchfield'] {
a {
padding: 0.5em;
border: 1px solid rgba(0, 0, 0, 0.14);
border-radius: 0.315em;
border-radius: @radius;
margin-right: 0.5em;
&:last-of-type {
......
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