jeff/umap
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Merge pull request #1393 from umap-project/fieldset-triangle

Browse source 
Add triangle icon to form fieldset to make toggle clearer
This commit is contained in:
Yohan Boniface 2023-11-07 22:39:00 +01:00 committed by GitHub
commit c16a01778b
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
5 changed files with 27 additions and 9 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

16
umap/static/umap/base.css
View file

@ -278,7 +278,7 @@ input[type="file"] + .error {
padding: 10px;
}
.fieldset.toggle .legend {
text-align: center;
text-align: left;
display: block;
cursor: pointer;
background-color: #232729;
@ -291,6 +291,20 @@ input[type="file"] + .error {
font-size: 1.2em;
padding: 0 5px;
}
.fieldset.toggle .legend:before {
background-repeat: no-repeat;
text-indent: 24px;
height: 24px;
line-height: 24px;
display: inline-block;
background-image: url('./img/16-white.svg');
vertical-align: bottom;
content: " ";
background-position: -144px -76px;
}
.fieldset.toggle.on .legend:before {
background-position: -144px -51px;
}
/* Switch */
input.switch:empty {
display: none;

2
umap/static/umap/img/16-white.svg
View file

@ -162,5 +162,7 @@
<path id="path438-6" d="m9 849.94v4.05c0 0.20708 0.1679 0.375 0.375 0.375h5.25c0.20708 0 0.375-0.16792 0.375-0.375v-4.05c0-0.20708-0.16792-0.375-0.375-0.375h-5.25c-0.2071 0-0.375 0.16792-0.375 0.375z"/>
<path id="save-7" d="m15.213 842.36h-8.8376c-0.2071 0-0.375 0.1679-0.375 0.37499v11.25c0 0.20708 0.1679 0.375 0.375 0.375h11.25c0.20708 0 0.375-0.16792 0.375-0.375v-8.6766c0-0.0953-0.0363-0.18697-0.1014-0.25648l-2.4124-2.5733c-0.07095-0.0756-0.16995-0.11853-0.2736-0.11853z"/>
</g>
<path id="arrow-down" d="m156 875.36 6-6h-12z" fill="#f2f2f2" fill-rule="evenodd"/>
<path id="arrow-right" d="m159 896.36-6-6v12z" fill="#f2f2f2" fill-rule="evenodd"/>
</g>
</svg>

Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 28 KiB

After

Width:  |  Height:  |  Size: 28 KiB

4
umap/static/umap/img/24-white.svg
View file

@ -38,8 +38,8 @@
<path id="rect4058-9" d="m11.906 29.898v0.13229 0.79375 0.13229h0.13229 0.79375 0.13229v-0.13229-0.09096l2.6458 1.0583v0.35555 0.11576l0.28939 0.0164h0.63665 0.13229v-0.13229-0.79375-0.13229h-0.13229-0.79375-0.13229v0.13229 0.14883l-2.6458-1.0583v-0.41341-0.13229h-0.13229-0.79375zm0.26458 0.26458h0.52917v0.52917h-0.52917zm3.7042 1.3229h0.52917v0.52917h-0.52917z" color="#000000" style="text-decoration-line:none;text-indent:0;text-transform:none"/>
<path id="rect4058-9-5" d="m12.989 32.32v0.35555 0.11576l1.8769 2.927h0.63665 0.13229v0.13229 0.79375 0.13229h-0.13229-0.79375-0.13229v-0.13229-0.79375-0.09922l-1.8769-2.9435h-0.63665-0.13229v-0.13229-0.79375-0.13229h0.13229 0.79375 0.13229v0.13229 0.14883zm-0.26458-0.30591h-0.52917v0.52917h0.52917zm2.6458 3.9688h-0.52917v0.52917h0.52917z" color="#000000" style="text-decoration-line:none;text-indent:0;text-transform:none"/>
</g>
<path id="arrow-up" d="m33.329 32.279-2.0498 2.0596h4.0995z" fill="#f2f2f2" fill-rule="evenodd" stroke="#999" stroke-width=".046891"/>
<path id="arrow-down" d="m23.802 34.339 2.0498-2.0596h-4.0995z" fill="#f2f2f2" fill-rule="evenodd" stroke="#999" stroke-width=".046831"/>
<path id="arrow-up" d="m33.329 32.279-2.1078 2.1167h4.2333z" fill="#f2f2f2" fill-rule="evenodd" stroke="#999" stroke-width=".046891"/>
<path id="arrow-down" d="m23.812 34.396 2.1167-2.1167h-4.2333z" fill="#f2f2f2" fill-rule="evenodd" stroke="#999" stroke-width=".046831"/>
<path id="datalayers" d="m11.394 23.743h4e-6c0.0102-0.0168 0.02435-0.0308 0.04124-0.04083l9e-6 -2.6e-5 0.35309-0.20972 2.4753 1.4703 0.01763 0.01048 0.01763-0.01048 2.4753-1.4703 0.35309 0.20972c0.05689 0.03382 0.07555 0.10711 0.04128 0.16374-0.01019 0.01679-0.02442 0.03085-0.0413 0.04091l-2.846 1.6904-2.846-1.6904h-3e-6c-0.05691-0.03382-0.07557-0.10716-0.04125-0.16379zm0 1.435h4e-6c0.0102-0.01682 0.02435-0.03083 0.04124-0.04086h9e-6l0.35309-0.20975 2.4753 1.4703 0.01763 0.01046 0.01763-0.01046 2.4753-1.4703 0.35309 0.20975c0.05689 0.03379 0.07555 0.10713 0.04125 0.16376l0.02915 0.01701-0.02912-0.01703c-0.01019 0.0168-0.02442 0.03083-0.0413 0.04091l-2.7049 1.6066c-0.08683 0.05158-0.19526 0.05158-0.28209 0l-2.7049-1.6067h-3e-6c-0.05691-0.03382-0.07557-0.10713-0.04125-0.16376zm0.04125-2.6909-0.01757 0.02848 0.01757-0.02848c-0.05691-0.0338-0.07557-0.10714-0.04125-0.16376l2e-6 -2e-6c0.01019-0.01679 0.02435-0.03081 0.04125-0.04086h2e-6l2.7049-1.6067c0.08683-0.05157 0.19526-0.05157 0.28209 0l2.7049 1.6067c0.05689 0.0338 0.07555 0.10714 0.04125 0.16377-0.01019 0.01681-0.02438 0.03082-0.04125 0.04086l-2.846 1.6905z" fill="#f2f2f2" stroke="#999" stroke-width=".066146"/>
<g id="tilelayers" transform="matrix(1.0025 0 0 1.0105 .44603 -.58487)" stroke-width=".99354">
<path id="path1257" d="m25.978 7.8844h0.03307v-3.6125h-3.7796v3.6125h0.03307zm-3.9787-4.1591h4.2439c0.06157 0 0.12062 0.024461 0.16417 0.068001 0.04352 0.04354 0.068 0.10259 0.068 0.16417v4.2439c0 0.061569-0.02447 0.12062-0.068 0.16417-0.04355 0.04355-0.1026 0.067998-0.16417 0.067998h-4.2439c-0.06158 0-0.12063-0.024448-0.16417-0.067998-0.04354-0.04355-0.068-0.10261-0.068-0.16417v-4.2439c0-0.061577 0.02446-0.12063 0.068-0.16417 0.04354-0.04354 0.1026-0.068001 0.16417-0.068001z" fill="#f2f2f2" stroke="#999" stroke-width=".065719"/>

Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 17 KiB

After

Width:  |  Height:  |  Size: 17 KiB

4
umap/static/umap/img/source/16-white.svg
View file

@ -13,7 +13,7 @@
<rect width="18" height="12.79" fill="#ffffff" id="rect4" x="0" y="0" />
</clipPath>
</defs>
<sodipodi:namedview id="base" pagecolor="#ffffff" bordercolor="#666666" borderopacity="1.0" inkscape:pageopacity="0.0" inkscape:pageshadow="2" inkscape:zoom="8.5078038" inkscape:cx="119.53731" inkscape:cy="21.157046" inkscape:document-units="px" inkscape:current-layer="layer1" showgrid="true" inkscape:window-width="1920" inkscape:window-height="1019" inkscape:window-x="0" inkscape:window-y="0" inkscape:window-maximized="1" showguides="true" inkscape:guide-bbox="true" inkscape:snap-grids="true" inkscape:snap-to-guides="true" inkscape:showpageshadow="2" inkscape:pagecheckerboard="0" inkscape:deskcolor="#d1d1d1">
<sodipodi:namedview id="base" pagecolor="#ffffff" bordercolor="#666666" borderopacity="1.0" inkscape:pageopacity="0.0" inkscape:pageshadow="2" inkscape:zoom="25.840251" inkscape:cx="154.56506" inkscape:cy="76.315049" inkscape:document-units="px" inkscape:current-layer="layer1" showgrid="true" inkscape:window-width="1920" inkscape:window-height="1019" inkscape:window-x="0" inkscape:window-y="0" inkscape:window-maximized="1" showguides="true" inkscape:guide-bbox="true" inkscape:snap-grids="true" inkscape:snap-to-guides="true" inkscape:showpageshadow="2" inkscape:pagecheckerboard="0" inkscape:deskcolor="#d1d1d1">
<inkscape:grid type="xygrid" id="grid3004" empspacing="4" visible="true" enabled="true" snapvisiblegridlinesonly="true" originx="0" originy="0" spacingy="1" spacingx="1" units="px" />
<sodipodi:guide orientation="-1,0" position="24,144" id="guide3084" inkscape:locked="false" inkscape:label="" inkscape:color="rgb(0,134,229)" />
<sodipodi:guide orientation="0,1" position="0,72" id="guide3086" inkscape:locked="false" inkscape:label="" inkscape:color="rgb(0,134,229)" />
@ -183,5 +183,7 @@
<path d="m 9,849.93721 v 4.04997 c 0,0.20708 0.167895,0.375 0.375,0.375 h 5.25 c 0.207075,0 0.375,-0.16792 0.375,-0.375 v -4.04997 c 0,-0.20708 -0.167925,-0.375 -0.375,-0.375 h -5.25 c -0.207105,0 -0.375,0.16792 -0.375,0.375 z" stroke="#f2f2f2" id="path438-6" style="fill:none;stroke:#42ece6;stroke-width:0.999997;stroke-opacity:1" />
<path d="m 15.21255,842.36218 h -8.83755 c -0.207105,0 -0.375,0.1679 -0.375,0.37499 v 11.24993 c 0,0.20708 0.167895,0.375 0.375,0.375 h 11.25 c 0.207075,0 0.375,-0.16792 0.375,-0.375 v -8.67664 c 0,-0.0953 -0.0363,-0.18697 -0.1014,-0.25648 l -2.41245,-2.57327 c -0.07095,-0.0756 -0.16995,-0.11853 -0.2736,-0.11853 z" stroke="#f2f2f2" id="save-7" style="fill:none;stroke:#42ece6;stroke-width:0.999997;stroke-opacity:1" />
</g>
<path style="fill:#f2f2f2;fill-opacity:1;fill-rule:evenodd;stroke:none;stroke-width:0.177;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1" d="m 156,875.36218 6,-6 h -12 z" id="arrow-down" inkscape:connector-curvature="0" sodipodi:nodetypes="cccc" />
<path style="fill:#f2f2f2;fill-opacity:1;fill-rule:evenodd;stroke:none;stroke-width:0.177;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1" d="m 159,896.36218 -6,-6 v 12 z" id="arrow-right" inkscape:connector-curvature="0" sodipodi:nodetypes="cccc" />
</g>
</svg>

Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 58 KiB

After

Width:  |  Height:  |  Size: 58 KiB

10
umap/static/umap/img/source/24-white.svg
View file

@ -1,9 +1,9 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<!-- Created with Inkscape (http://www.inkscape.org/) -->
<svg width="180" height="180" viewBox="0 0 47.624994 47.624994" version="1.1" id="svg2876" inkscape:version="1.2.2 (b0a8486541, 2022-12-01)" sodipodi:docname="24-white.svg" inkscape:export-filename="../24-white.svg" inkscape:export-xdpi="7.52" inkscape:export-ydpi="7.52" xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape" xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd" xmlns="http://www.w3.org/2000/svg" xmlns:svg="http://www.w3.org/2000/svg">
<sodipodi:namedview id="namedview2878" pagecolor="#ffffff" bordercolor="#666666" borderopacity="1.0" inkscape:showpageshadow="2" inkscape:pageopacity="0.0" inkscape:pagecheckerboard="0" inkscape:deskcolor="#d1d1d1" inkscape:document-units="px" showgrid="true" showguides="true" inkscape:zoom="16.185242" inkscape:cx="45.319063" inkscape:cy="127.55447" inkscape:window-width="1920" inkscape:window-height="1019" inkscape:window-x="0" inkscape:window-y="0" inkscape:window-maximized="1" inkscape:current-layer="layer1">
<inkscape:grid type="xygrid" id="grid2997" empspacing="4" originx="0" originy="0" />
<svg width="180" height="180" viewBox="0 0 47.624994 47.624994" version="1.1" id="svg2876" inkscape:version="1.3 (0e150ed6c4, 2023-07-21)" sodipodi:docname="24-white.svg" inkscape:export-filename="../24-white.svg" inkscape:export-xdpi="7.52" inkscape:export-ydpi="7.52" xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape" xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd" xmlns="http://www.w3.org/2000/svg" xmlns:svg="http://www.w3.org/2000/svg">
<sodipodi:namedview id="namedview2878" pagecolor="#ffffff" bordercolor="#666666" borderopacity="1.0" inkscape:showpageshadow="2" inkscape:pageopacity="0.0" inkscape:pagecheckerboard="0" inkscape:deskcolor="#d1d1d1" inkscape:document-units="px" showgrid="true" showguides="true" inkscape:zoom="8.6832784" inkscape:cx="145.10648" inkscape:cy="121.84338" inkscape:window-width="1920" inkscape:window-height="1019" inkscape:window-x="0" inkscape:window-y="0" inkscape:window-maximized="1" inkscape:current-layer="layer1">
<inkscape:grid type="xygrid" id="grid2997" empspacing="4" originx="0" originy="0" spacingy="0.2645833" spacingx="0.2645833" units="px" visible="true" />
<sodipodi:guide position="9.525,47.625" orientation="-1,0" id="guide3404" inkscape:locked="false" inkscape:label="" inkscape:color="rgb(0,134,229)" />
<sodipodi:guide position="0,38.099995" orientation="0,1" id="guide3408" inkscape:locked="false" inkscape:label="" inkscape:color="rgb(0,134,229)" />
<sodipodi:guide position="28.575,47.625" orientation="-1,0" id="guide3444" inkscape:locked="false" inkscape:label="" inkscape:color="rgb(0,134,229)" />
@ -59,8 +59,8 @@
<path inkscape:connector-curvature="0" style="color:#000000;font-style:normal;font-variant:normal;font-weight:normal;font-stretch:normal;font-size:medium;line-height:normal;font-family:Sans;-inkscape-font-specification:Sans;text-indent:0;text-align:start;text-decoration:none;text-decoration-line:none;letter-spacing:normal;word-spacing:normal;text-transform:none;writing-mode:lr-tb;direction:ltr;baseline-shift:baseline;text-anchor:start;display:inline;overflow:visible;visibility:visible;fill:#f2f2f2;fill-opacity:1;stroke:#999999;stroke-width:0.0661458;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1;marker:none;enable-background:accumulate" d="m 11.906249,29.898045 v 0.132292 0.79375 0.132292 h 0.132291 0.79375 0.132292 v -0.132292 -0.09096 l 2.645832,1.058334 v 0.355547 0.115755 l 0.289388,0.0164 h 0.636654 0.132292 v -0.132292 -0.79375 -0.132291 h -0.132292 -0.79375 -0.132292 v 0.132291 0.148829 l -2.645832,-1.058334 v -0.413411 -0.132292 h -0.132292 -0.79375 z m 0.264583,0.264584 h 0.529167 v 0.529166 h -0.529167 z m 3.704166,1.322916 h 0.529166 v 0.529167 h -0.529166 z" id="rect4058-9" sodipodi:nodetypes="ccccccccccccccccccccccccccccccccccccccc" />
<path inkscape:connector-curvature="0" style="color:#000000;font-style:normal;font-variant:normal;font-weight:normal;font-stretch:normal;font-size:medium;line-height:normal;font-family:Sans;-inkscape-font-specification:Sans;text-indent:0;text-align:start;text-decoration:none;text-decoration-line:none;letter-spacing:normal;word-spacing:normal;text-transform:none;writing-mode:lr-tb;direction:ltr;baseline-shift:baseline;text-anchor:start;display:inline;overflow:visible;visibility:visible;fill:#f2f2f2;fill-opacity:1;stroke:#999999;stroke-width:0.0661458;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1;marker:none;enable-background:accumulate" d="m 12.989387,32.320492 v 0.355547 0.115755 l 1.876888,2.926953 h 0.636653 0.132292 v 0.132292 0.79375 0.132291 h -0.132292 -0.79375 -0.132291 v -0.132291 -0.79375 -0.09922 l -1.876888,-2.94349 h -0.636654 -0.132292 v -0.132291 -0.79375 -0.132292 h 0.132292 0.79375 0.132292 v 0.132292 0.148828 z m -0.264584,-0.305912 h -0.529166 v 0.529167 h 0.529166 z m 2.645834,3.96875 h -0.529167 v 0.529167 h 0.529167 z" id="rect4058-9-5" sodipodi:nodetypes="ccccccccccccccccccccccccccccccccccccc" />
</g>
<path style="fill:#f2f2f2;fill-opacity:1;fill-rule:evenodd;stroke:#999999;stroke-width:0.0468913;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1" d="m 33.328633,32.279163 -2.049775,2.059569 h 4.099549 z" id="arrow-up" inkscape:connector-curvature="0" />
<path style="fill:#f2f2f2;fill-opacity:1;fill-rule:evenodd;stroke:#999999;stroke-width:0.0468312;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1" d="m 23.802018,34.338732 2.049774,-2.059569 h -4.099549 z" id="arrow-down" inkscape:connector-curvature="0" />
<path style="fill:#f2f2f2;fill-opacity:1;fill-rule:evenodd;stroke:#999999;stroke-width:0.0468913;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1" d="m 33.328633,32.279163 -2.107805,2.116665 h 4.233333 z" id="arrow-up" inkscape:connector-curvature="0" sodipodi:nodetypes="cccc" />
<path style="fill:#f2f2f2;fill-opacity:1;fill-rule:evenodd;stroke:#999999;stroke-width:0.0468312;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1" d="m 23.812496,34.395828 2.116666,-2.116667 h -4.233332 z" id="arrow-down" inkscape:connector-curvature="0" sodipodi:nodetypes="cccc" />
<path d="m 11.394294,23.74341 h 4e-6 c 0.0102,-0.0168 0.02435,-0.0308 0.04124,-0.04083 l 9e-6,-2.6e-5 0.353087,-0.209723 2.475253,1.470258 0.01763,0.01048 0.01763,-0.01048 2.475273,-1.470258 0.353093,0.209723 c 0,0 0,0 0,0 0.05689,0.03382 0.07555,0.107108 0.04128,0.163737 -0.01019,0.01679 -0.02442,0.03085 -0.0413,0.04091 0,0 0,0 0,0 l -2.845967,1.690437 -2.845965,-1.690437 c -10e-7,0 -2e-6,0 -3e-6,0 -0.05691,-0.03382 -0.07557,-0.107161 -0.04125,-0.16379 z m 0,1.434967 h 4e-6 c 0.0102,-0.01682 0.02435,-0.03083 0.04124,-0.04086 h 9e-6 l 0.353087,-0.209751 2.475253,1.470286 0.01763,0.01046 0.01763,-0.01046 2.475273,-1.470286 0.353093,0.209751 c 0.05689,0.03379 0.07555,0.107134 0.04125,0.163763 l 0.02915,0.01701 -0.02912,-0.01703 c -0.01019,0.0168 -0.02442,0.03083 -0.0413,0.04091 0,0 0,0 0,0 l -2.70492,1.606643 c -0.08683,0.05158 -0.195264,0.05158 -0.282094,0 l -2.704918,-1.60667 c -10e-7,0 -2e-6,0 -3e-6,0 -0.05691,-0.03382 -0.07557,-0.107134 -0.04125,-0.163763 z m 0.04125,-2.690882 -0.01757,0.02848 0.01757,-0.02848 c -0.05691,-0.0338 -0.07557,-0.107135 -0.04125,-0.163761 l 2e-6,-2e-6 c 0.01019,-0.01679 0.02435,-0.03081 0.04125,-0.04086 h 2e-6 l 2.704921,-1.606703 c 0.08683,-0.05157 0.195264,-0.05157 0.282093,0 l 2.704948,1.6067 c 0.05689,0.0338 0.07555,0.107141 0.04125,0.163771 -0.01019,0.01681 -0.02438,0.03082 -0.04125,0.04086 l -2.845994,1.690461 z" fill="#f2f2f2" stroke="#999999" stroke-width="0.0661458" id="datalayers" />
<g id="tilelayers" transform="matrix(1.0024854,0,0,1.0105262,0.44603182,-0.58486809)" style="stroke-width:0.993545">
<path d="m 25.978244,7.8843707 h 0.03307 v -0.033073 -3.5463476 -0.033073 h -0.03307 -3.713453 -0.03307 v 0.033073 3.5463476 0.033073 h 0.03307 z m -3.978701,-4.1590643 h 4.243946 c 0.06157,0 0.120623,0.024461 0.164173,0.068001 0.04352,0.04354 0.068,0.1025948 0.068,0.1641713 v 4.2439425 c 0,0.061569 -0.02447,0.1206236 -0.068,0.164174 -0.04355,0.04355 -0.102605,0.067998 -0.164173,0.067998 h -4.243946 c -0.06158,0 -0.120628,-0.024448 -0.164171,-0.067998 -0.04354,-0.04355 -0.068,-0.1026054 -0.068,-0.164174 v -4.2439425 c 0,-0.061577 0.02446,-0.1206315 0.068,-0.1641713 0.04354,-0.04354 0.102595,-0.068001 0.164171,-0.068001 z" fill="#f2f2f2" stroke="#999999" stroke-width="0.0657188" id="path1257" />

Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 29 KiB

After

Width:  |  Height:  |  Size: 29 KiB