Commit f56eaffc authored by Romain Courteaud's avatar Romain Courteaud

erp5_document_scanner: add a less file to generate the css

parent 41013680
div[data-gadget-url$="gadget_document_scanner.html"] { div[data-gadget-url$="gadget_document_scanner.html"] {
text-align: center; text-align: center;
} }
@media only screen and (max-width: 750px) { @media only screen and (max-width: 750px) {
div[data-gadget-url$="gadget_document_scanner.html"] .camera { div[data-gadget-url$="gadget_document_scanner.html"] .camera {
max-width: 90%; max-width: 90%;
...@@ -10,7 +9,6 @@ div[data-gadget-url$="gadget_document_scanner.html"] { ...@@ -10,7 +9,6 @@ div[data-gadget-url$="gadget_document_scanner.html"] {
max-width: 50%; max-width: 50%;
} }
} }
div[data-gadget-url$="gadget_document_scanner.html"] .photo, div[data-gadget-url$="gadget_document_scanner.html"] .photo,
div[data-gadget-url$="gadget_document_scanner.html"] .video, div[data-gadget-url$="gadget_document_scanner.html"] .video,
div[data-gadget-url$="gadget_document_scanner.html"] .camera-output, div[data-gadget-url$="gadget_document_scanner.html"] .camera-output,
...@@ -21,36 +19,29 @@ div[data-gadget-url$="gadget_document_scanner.html"] .canvas { ...@@ -21,36 +19,29 @@ div[data-gadget-url$="gadget_document_scanner.html"] .canvas {
filter: brightness(1); filter: brightness(1);
text-align: center; text-align: center;
} }
div[data-gadget-url$="gadget_document_scanner.html"] .camera-input { div[data-gadget-url$="gadget_document_scanner.html"] .camera-input {
min-height: 360px; min-height: 360px;
} }
div[data-gadget-url$="gadget_document_scanner.html"] .page-number { div[data-gadget-url$="gadget_document_scanner.html"] .page-number {
display: inline; display: inline;
} }
div[data-gadget-url$="gadget_document_scanner.html"] .camera-header { div[data-gadget-url$="gadget_document_scanner.html"] .camera-header {
font-size: 12pt; font-size: 12pt;
font-weight: 400; font-weight: 400;
} }
div[data-gadget-url$="gadget_document_scanner.html"] .camera-input, div[data-gadget-url$="gadget_document_scanner.html"] .camera-input,
div[data-gadget-url$="gadget_document_scanner.html"] .camera-output, div[data-gadget-url$="gadget_document_scanner.html"] .camera-output,
div[data-gadget-url$="gadget_document_scanner.html"] .camera-header, div[data-gadget-url$="gadget_document_scanner.html"] .camera-header,
div[data-gadget-url$="gadget_document_scanner.html"] .edit-picture { div[data-gadget-url$="gadget_document_scanner.html"] .edit-picture {
text-align: center; text-align: center;
} }
div[data-gadget-url$="gadget_document_scanner.html"] .edit-picture { div[data-gadget-url$="gadget_document_scanner.html"] .edit-picture {
padding-top: 0.5em; padding-top: 0.5em;
} }
div[data-gadget-url$="gadget_document_scanner.html"] .camera, div[data-gadget-url$="gadget_document_scanner.html"] .camera,
div[data-gadget-url$="gadget_document_scanner.html"] .camera-input { div[data-gadget-url$="gadget_document_scanner.html"] .camera-input {
display: inline-block; display: inline-block;
} }
div[data-gadget-url$="gadget_document_scanner.html"] .reset-btn, div[data-gadget-url$="gadget_document_scanner.html"] .reset-btn,
div[data-gadget-url$="gadget_document_scanner.html"] .confirm-btn, div[data-gadget-url$="gadget_document_scanner.html"] .confirm-btn,
div[data-gadget-url$="gadget_document_scanner.html"] .edit-btn, div[data-gadget-url$="gadget_document_scanner.html"] .edit-btn,
...@@ -67,37 +58,30 @@ div[data-gadget-url$="gadget_document_scanner.html"] .confirm-btn { ...@@ -67,37 +58,30 @@ div[data-gadget-url$="gadget_document_scanner.html"] .confirm-btn {
display: inline-block; display: inline-block;
margin-right: 6pt; margin-right: 6pt;
} }
div[data-gadget-url$="gadget_document_scanner.html"] button:disabled, div[data-gadget-url$="gadget_document_scanner.html"] button:disabled,
div[data-gadget-url$="gadget_document_scanner.html"] button[disabled] { div[data-gadget-url$="gadget_document_scanner.html"] button[disabled] {
color: #999999; color: #999999;
} }
div[data-gadget-url$="gadget_document_scanner.html"] > .camera > .thumbnail-list { div[data-gadget-url$="gadget_document_scanner.html"] > .camera > .thumbnail-list {
padding-top: .5em; padding-top: 0.5em;
} }
div[data-gadget-url$="gadget_document_scanner.html"] .show-img { div[data-gadget-url$="gadget_document_scanner.html"] .show-img {
width: 6em; width: 6em;
height: 6em; height: 6em;
object-fit: cover; object-fit: cover;
float: left; float: left;
} }
div[data-gadget-url$="gadget_document_scanner.html"] .show-img,
div[data-gadget-url$="gadget_document_scanner.html"] .show-img , div[data-gadget-url$="gadget_document_scanner.html"] .new-btn {
div[data-gadget-url$="gadget_document_scanner.html"] .new-btn {
border-radius: 0.325em; border-radius: 0.325em;
} }
div[data-gadget-url$="gadget_document_scanner.html"] .btn-thumbnail,
div[data-gadget-url$="gadget_document_scanner.html"] .btn-thumbnail , div[data-gadget-url$="gadget_document_scanner.html"] .new-btn {
div[data-gadget-url$="gadget_document_scanner.html"] .new-btn {
margin-top: 0.2em; margin-top: 0.2em;
} }
div[data-gadget-url$="gadget_document_scanner.html"] button:before { div[data-gadget-url$="gadget_document_scanner.html"] button:before {
padding-right: 0.2em; padding-right: 0.2em;
} }
div[data-gadget-url$="gadget_document_scanner.html"] .thumbnail-list > button { div[data-gadget-url$="gadget_document_scanner.html"] .thumbnail-list > button {
display: inline; display: inline;
float: left; float: left;
...@@ -105,22 +89,18 @@ div[data-gadget-url$="gadget_document_scanner.html"] .thumbnail-list > button { ...@@ -105,22 +89,18 @@ div[data-gadget-url$="gadget_document_scanner.html"] .thumbnail-list > button {
border: 1px solid rgba(0, 0, 0, 0.14); border: 1px solid rgba(0, 0, 0, 0.14);
border-radius: 0.325em; border-radius: 0.325em;
} }
div[data-gadget-url$="gadget_document_scanner.html"] .upload-error { div[data-gadget-url$="gadget_document_scanner.html"] .upload-error {
border: 3px solid red; border: 3px solid red;
} }
div[data-gadget-url$="gadget_document_scanner.html"] .new-btn { div[data-gadget-url$="gadget_document_scanner.html"] .new-btn {
display: inline-grid !important; display: inline-grid !important;
width: calc(6em + 1px); width: calc(6em + 1px);
height: calc(6em + 1px); height: calc(6em + 1px);
} }
div[data-gadget-url$="gadget_document_scanner.html"] .img-container { div[data-gadget-url$="gadget_document_scanner.html"] .img-container {
/* Never limit the container height here */ /* Never limit the container height here */
max-width: 100%; max-width: 100%;
} }
div[data-gadget-url$="gadget_document_scanner.html"] .btn-thumbnail:before { div[data-gadget-url$="gadget_document_scanner.html"] .btn-thumbnail:before {
color: #000; color: #000;
position: absolute; position: absolute;
......
...@@ -244,7 +244,7 @@ ...@@ -244,7 +244,7 @@
</item> </item>
<item> <item>
<key> <string>serial</string> </key> <key> <string>serial</string> </key>
<value> <string>981.65281.59241.18807</string> </value> <value> <string>982.60019.31334.2372</string> </value>
</item> </item>
<item> <item>
<key> <string>state</string> </key> <key> <string>state</string> </key>
...@@ -262,7 +262,7 @@ ...@@ -262,7 +262,7 @@
</tuple> </tuple>
<state> <state>
<tuple> <tuple>
<float>1582746062.94</float> <float>1585753245.18</float>
<string>UTC</string> <string>UTC</string>
</tuple> </tuple>
</state> </state>
......
div[data-gadget-url$="gadget_document_scanner.html"] {
text-align: center;
@media only screen and (max-width: 750px) {
.camera {
max-width: 90%;
}
.thumbnail-list > button {
max-width: 50%;
}
}
.photo, .video, .camera-output, .canvas {
max-width: 100%;
width: auto;
max-height: 500px;
filter: brightness(1);
text-align: center;
}
.camera-input {
min-height: 360px;
}
.page-number {
display: inline;
}
.camera-header {
font-size: 12pt;
font-weight: 400;
}
.camera-input, .camera-output, .camera-header, .edit-picture {
text-align: center;
}
.edit-picture {
padding-top: 0.5em;
}
.camera, .camera-input {
display: inline-block;
}
.reset-btn, .confirm-btn, .edit-btn, .take-picture-btn, .capture-btn,
.delete-btn, .retry-btn, .change-camera-btn, .confirm-btn {
color: #212529;
padding: 3pt;
border: 1px solid rgba(0, 0, 0, 0.14);
border-radius: 0.325em;
display: inline-block;
margin-right: 6pt;
}
button:disabled, button[disabled] {
color: #999999;
}
> .camera > .thumbnail-list {
padding-top: .5em;
}
.show-img {
width: 6em;
height: 6em;
object-fit: cover;
float: left;
}
.show-img, .new-btn {
border-radius: 0.325em;
}
.btn-thumbnail, .new-btn {
margin-top: 0.2em;
}
button:before {
padding-right: 0.2em;
}
.thumbnail-list > button {
display: inline;
float: left;
margin-left: 0.2em;
border: 1px solid rgba(0, 0, 0, 0.14);
border-radius: 0.325em;
}
.upload-error {
border: 3px solid red;
}
.new-btn {
display: inline-grid !important;
width: calc(6em + 1px);
height: calc(6em + 1px);
}
.img-container {
/* Never limit the container height here */
max-width: 100%;
}
.btn-thumbnail:before {
color: #000;
position: absolute;
transform: translate(-50%, -50%);
-ms-transform: translate(-50%, -50%);
text-align: center;
font-size: 16pt;
}
}
<?xml version="1.0"?>
<ZopeData>
<record id="1" aka="AAAAAAAAAAE=">
<pickle>
<global name="File" module="OFS.Image"/>
</pickle>
<pickle>
<dictionary>
<item>
<key> <string>__name__</string> </key>
<value> <string>documentscannercss.less</string> </value>
</item>
<item>
<key> <string>content_type</string> </key>
<value> <string>text/plain</string> </value>
</item>
<item>
<key> <string>precondition</string> </key>
<value> <string></string> </value>
</item>
<item>
<key> <string>title</string> </key>
<value> <string></string> </value>
</item>
</dictionary>
</pickle>
</record>
</ZopeData>
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