Commit a5db87a1 authored by Romain Courteaud's avatar Romain Courteaud

erp5_web_renderjs_ui: allow to use the css grid in multiple places

Use the `ui-list-grid` class on a `ul` element.
parent 293687c5
Pipeline #15941 canceled with stage
......@@ -1827,12 +1827,12 @@ div[data-gadget-scope='maximize'] button:active {
/**********************************************
* Front page
**********************************************/
div[data-gadget-url$="gadget_erp5_page_front.html"] > ul {
ul.ui-list-grid {
display: flex;
align-items: flex-start;
flex-wrap: wrap;
}
div[data-gadget-url$="gadget_erp5_page_front.html"] > ul > li {
ul.ui-list-grid > li {
flex-shrink: 1;
vertical-align: top;
padding: 3pt;
......@@ -1842,25 +1842,25 @@ div[data-gadget-url$="gadget_erp5_page_front.html"] > ul > li {
background-color: #FFFFFF;
}
@media not screen and (min-width: 45em) {
div[data-gadget-url$="gadget_erp5_page_front.html"] > ul > li {
ul.ui-list-grid > li {
flex-basis: 100%;
margin-bottom: 6pt;
}
}
@media only screen and (min-width: 45em) and (max-width: 85em), not screen and (max-width: 85em) {
div[data-gadget-url$="gadget_erp5_page_front.html"] > ul > li {
ul.ui-list-grid > li {
margin-right: 24pt;
margin-bottom: 24pt;
flex-basis: 20em;
}
}
div[data-gadget-url$="gadget_erp5_page_front.html"] > ul > li h2 {
ul.ui-list-grid > li h2 {
font-weight: 700;
background: #085078;
color: #FFFFFF;
padding: 6pt;
}
div[data-gadget-url$="gadget_erp5_page_front.html"] > ul > li li {
ul.ui-list-grid > li li {
padding: 3pt 6pt;
}
/**********************************************
......
......@@ -246,7 +246,7 @@
</item>
<item>
<key> <string>serial</string> </key>
<value> <string>989.49292.64608.7680</string> </value>
<value> <string>989.60433.59989.54698</string> </value>
</item>
<item>
<key> <string>state</string> </key>
......@@ -264,7 +264,7 @@
</tuple>
<state>
<tuple>
<float>1612445457.98</float>
<float>1612969527.49</float>
<string>UTC</string>
</tuple>
</state>
......
......@@ -22,7 +22,7 @@
</head>
<body>
<ul>
<ul class="ui-list-grid">
</ul>
</body>
</html>
\ No newline at end of file
......@@ -238,7 +238,7 @@
</item>
<item>
<key> <string>serial</string> </key>
<value> <string>981.53539.4987.28928</string> </value>
<value> <string>989.60433.59989.54698</string> </value>
</item>
<item>
<key> <string>state</string> </key>
......@@ -256,7 +256,7 @@
</tuple>
<state>
<tuple>
<float>1581602343.58</float>
<float>1612969553.17</float>
<string>UTC</string>
</tuple>
</state>
......
......@@ -2088,8 +2088,7 @@ div[data-gadget-scope='maximize'] button {
/**********************************************
* Front page
**********************************************/
div[data-gadget-url$="gadget_erp5_page_front.html"] {
> ul {
ul.ui-list-grid {
display: flex;
align-items: flex-start;
flex-wrap: wrap;
......@@ -2122,7 +2121,6 @@ div[data-gadget-url$="gadget_erp5_page_front.html"] {
padding: @half-margin-size @margin-size;
}
}
}
}
/**********************************************
......
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