Browse Source

fix: icônes de la saisie disposition

Obligé d'embarquer les svgs : si on met des img il y a un bug avec la modale d'insérer modèles.

Avantage : ça permet au passage de réutiliser la couleur du thème.
Inconvénient : ça empêche de réutiliser la saisie radio, les tags svgs sont zappés dans \#VALEUR dirait-on.
master
tcharlss 3 months ago
parent
commit
5dbcd00385
  1. 1
      prive/themes/spip/images/album-disposition-browse-xx.svg
  2. 1
      prive/themes/spip/images/album-disposition-download-xx.svg
  3. 2
      prive/themes/spip/images/album-disposition-inline-xx.svg
  4. 2
      prive/themes/spip/images/album-disposition-line-xx.svg
  5. 2
      prive/themes/spip/images/album-disposition-list-xx.svg
  6. 2
      prive/themes/spip/images/album-disposition-masonry-xx.svg
  7. 2
      prive/themes/spip/images/album-disposition-mosaic-xx.svg
  8. 2
      prive/themes/spip/images/album-disposition-simple-xx.svg
  9. 57
      saisies/disposition_album.html

1
prive/themes/spip/images/album-disposition-browse-xx.svg

@ -0,0 +1 @@
<svg class="icon-album-disposition" width="50" height="50" xmlns="http://www.w3.org/2000/svg"><rect class="background" style="display:inline;fill:#e6e6e6;stroke:none" width="50" height="50" rx="0" ry="0"/><path class="primary" style="display:inline;fill:#5386ff;stroke:none" d="M39.772 23.45a3.79 3.79 0 0 0-3.786 3.786 3.79 3.79 0 0 0 3.786 3.786 3.79 3.79 0 0 0 3.786-3.786 3.79 3.79 0 0 0-3.786-3.786zm-5.05 9.084a.507.507 0 0 0-.504.503v.004c0 .275.23.503.504.503H44.82a.507.507 0 0 0 .504-.503v-.004a.507.507 0 0 0-.504-.503zm0 2.02a.51.51 0 0 0-.504.507c0 .275.23.503.504.503H44.82a.507.507 0 0 0 .504-.503.51.51 0 0 0-.504-.506zM25.132 23.45a3.79 3.79 0 0 0-3.786 3.786 3.79 3.79 0 0 0 3.786 3.786 3.79 3.79 0 0 0 3.786-3.786 3.79 3.79 0 0 0-3.786-3.786zm-5.05 9.084a.507.507 0 0 0-.504.503v.004c0 .275.23.503.504.503H30.18a.507.507 0 0 0 .504-.503v-.004a.507.507 0 0 0-.504-.503zm0 2.02a.51.51 0 0 0-.504.507c0 .275.23.503.504.503H30.18a.507.507 0 0 0 .504-.503.51.51 0 0 0-.504-.506zm-9.59-11.104a3.79 3.79 0 0 0-3.786 3.786 3.79 3.79 0 0 0 3.786 3.786 3.79 3.79 0 0 0 3.787-3.786 3.79 3.79 0 0 0-3.787-3.786zm-5.05 9.084a.507.507 0 0 0-.503.503v.004c0 .275.228.503.503.503h10.099a.507.507 0 0 0 .503-.503v-.004a.507.507 0 0 0-.503-.503zm0 2.02a.51.51 0 0 0-.503.507c0 .275.228.503.503.503h10.099a.507.507 0 0 0 .503-.503.51.51 0 0 0-.503-.506zM39.772 5.275a3.79 3.79 0 0 0-3.786 3.786 3.79 3.79 0 0 0 3.786 3.786 3.79 3.79 0 0 0 3.786-3.786 3.79 3.79 0 0 0-3.786-3.786zm-5.05 9.085a.507.507 0 0 0-.504.502v.004c0 .275.23.503.504.503H44.82a.507.507 0 0 0 .504-.503v-.004a.507.507 0 0 0-.504-.502zm0 2.02a.51.51 0 0 0-.504.507c0 .275.23.502.504.502H44.82a.507.507 0 0 0 .504-.502.51.51 0 0 0-.504-.507zm-9.59-11.105a3.79 3.79 0 0 0-3.786 3.786 3.79 3.79 0 0 0 3.786 3.786 3.79 3.79 0 0 0 3.786-3.786 3.79 3.79 0 0 0-3.786-3.786zm-5.05 9.085a.507.507 0 0 0-.504.502v.004c0 .275.23.503.504.503H30.18a.507.507 0 0 0 .504-.503v-.004a.507.507 0 0 0-.504-.502zm0 2.02a.51.51 0 0 0-.504.507c0 .275.23.502.504.502H30.18a.507.507 0 0 0 .504-.502.51.51 0 0 0-.504-.507zm-9.59-11.105A3.79 3.79 0 0 0 6.706 9.06a3.79 3.79 0 0 0 3.786 3.786 3.79 3.79 0 0 0 3.787-3.786 3.79 3.79 0 0 0-3.787-3.786zm-5.05 9.085a.507.507 0 0 0-.503.502v.004c0 .275.228.503.503.503h10.099a.507.507 0 0 0 .503-.503v-.004a.507.507 0 0 0-.503-.502zm0 2.02a.51.51 0 0 0-.503.507c0 .275.228.502.503.502h10.099a.507.507 0 0 0 .503-.502.51.51 0 0 0-.503-.507z" transform="translate(-.132 3.572) scale(.99999)"/></svg>

After

Width:  |  Height:  |  Size: 2.4 KiB

1
prive/themes/spip/images/album-disposition-download-xx.svg

@ -1 +0,0 @@
<svg width="100" height="100" viewBox="0 0 26.458 26.458" xmlns="http://www.w3.org/2000/svg"><g transform="matrix(.99999 0 0 .99999 -.132 3.572)" style="display:inline"><rect style="display:inline;fill:#e6e6e6;stroke:#e6e6e6;stroke-width:.529166;stroke-linecap:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1" width="25.929" height="25.929" x=".397" y="-3.307" rx="0" ry="0"/><g transform="translate(.926 5.556)"><circle style="display:inline;fill:#5386ff;fill-opacity:1;stroke:#487fff;stroke-width:.264583;stroke-linecap:round;stroke-dasharray:none;stroke-opacity:1" cx="4.762" cy="-2.381" r="1.852"/><rect style="fill:#5386ff;fill-opacity:1;stroke:#5386ff;stroke-width:.264582;stroke-linecap:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1" width="5.556" height=".265" x="1.984" y=".529" rx=".132" ry=".132"/><rect style="fill:#5386ff;fill-opacity:1;stroke:#5386ff;stroke-width:.264582;stroke-linecap:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1" width="5.556" height=".265" x="1.984" y="1.588" rx=".132" ry=".132"/></g><g transform="translate(8.599 5.556)"><circle style="display:inline;fill:#5386ff;fill-opacity:1;stroke:#487fff;stroke-width:.264583;stroke-linecap:round;stroke-dasharray:none;stroke-opacity:1" cx="4.762" cy="-2.381" r="1.852"/><rect style="fill:#5386ff;fill-opacity:1;stroke:#5386ff;stroke-width:.264582;stroke-linecap:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1" width="5.556" height=".265" x="1.984" y=".529" rx=".132" ry=".132"/><rect style="fill:#5386ff;fill-opacity:1;stroke:#5386ff;stroke-width:.264582;stroke-linecap:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1" width="5.556" height=".265" x="1.984" y="1.588" rx=".132" ry=".132"/></g><g transform="translate(8.599 15.081)"><circle style="display:inline;fill:#5386ff;fill-opacity:1;stroke:#487fff;stroke-width:.264583;stroke-linecap:round;stroke-dasharray:none;stroke-opacity:1" cx="4.762" cy="-2.381" r="1.852"/><rect style="fill:#5386ff;fill-opacity:1;stroke:#5386ff;stroke-width:.264582;stroke-linecap:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1" width="5.556" height=".265" x="1.984" y=".529" rx=".132" ry=".132"/><rect style="fill:#5386ff;fill-opacity:1;stroke:#5386ff;stroke-width:.264582;stroke-linecap:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1" width="5.556" height=".265" x="1.984" y="1.588" rx=".132" ry=".132"/></g><g transform="translate(.926 15.081)"><circle style="display:inline;fill:#5386ff;fill-opacity:1;stroke:#487fff;stroke-width:.264583;stroke-linecap:round;stroke-dasharray:none;stroke-opacity:1" cx="4.762" cy="-2.381" r="1.852"/><rect style="fill:#5386ff;fill-opacity:1;stroke:#5386ff;stroke-width:.264582;stroke-linecap:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1" width="5.556" height=".265" x="1.984" y=".529" rx=".132" ry=".132"/><rect style="fill:#5386ff;fill-opacity:1;stroke:#5386ff;stroke-width:.264582;stroke-linecap:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1" width="5.556" height=".265" x="1.984" y="1.588" rx=".132" ry=".132"/></g><g transform="translate(16.272 5.556)"><circle style="display:inline;fill:#5386ff;fill-opacity:1;stroke:#487fff;stroke-width:.264583;stroke-linecap:round;stroke-dasharray:none;stroke-opacity:1" cx="4.762" cy="-2.381" r="1.852"/><rect style="fill:#5386ff;fill-opacity:1;stroke:#5386ff;stroke-width:.264582;stroke-linecap:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1" width="5.556" height=".265" x="1.984" y=".529" rx=".132" ry=".132"/><rect style="fill:#5386ff;fill-opacity:1;stroke:#5386ff;stroke-width:.264582;stroke-linecap:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1" width="5.556" height=".265" x="1.984" y="1.588" rx=".132" ry=".132"/></g><g transform="translate(16.272 15.081)"><circle style="display:inline;fill:#5386ff;fill-opacity:1;stroke:#487fff;stroke-width:.264583;stroke-linecap:round;stroke-dasharray:none;stroke-opacity:1" cx="4.762" cy="-2.381" r="1.852"/><rect style="fill:#5386ff;fill-opacity:1;stroke:#5386ff;stroke-width:.264582;stroke-linecap:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1" width="5.556" height=".265" x="1.984" y=".529" rx=".132" ry=".132"/><rect style="fill:#5386ff;fill-opacity:1;stroke:#5386ff;stroke-width:.264582;stroke-linecap:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1" width="5.556" height=".265" x="1.984" y="1.588" rx=".132" ry=".132"/></g></g></svg>

Before

Width:  |  Height:  |  Size: 4.4 KiB

2
prive/themes/spip/images/album-disposition-inline-xx.svg

@ -1 +1 @@
<svg width="100" height="100" viewBox="0 0 26.458 26.458" xmlns="http://www.w3.org/2000/svg"><g transform="matrix(.99999 0 0 .99999 -.132 3.572)" style="display:inline"><rect style="display:inline;fill:#e6e6e6;stroke:#e6e6e6;stroke-width:.529165;stroke-linecap:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1" width="25.929" height="25.929" x=".397" y="-3.307" rx="0" ry="0"/><rect style="fill:#5386ff;fill-opacity:1;stroke:#3d77ff;stroke-width:.264583;stroke-linecap:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1" width="11.377" height="7.144" x="1.323" y="-2.381" rx=".661" ry=".661"/><rect style="fill:#5386ff;fill-opacity:1;stroke:#3d77ff;stroke-width:.264583;stroke-linecap:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1" width="7.144" height="7.144" x="1.323" y="6.085" rx=".397" ry=".397"/><rect style="fill:#5386ff;fill-opacity:1;stroke:#3d77ff;stroke-width:.264582;stroke-linecap:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1" width="7.144" height="7.144" x="9.79" y="6.085" rx=".397" ry=".397"/><rect style="fill:#5386ff;fill-opacity:1;stroke:#3d77ff;stroke-width:.264583;stroke-linecap:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1" width="11.377" height="7.144" x="1.323" y="14.552" rx=".397" ry=".397"/><rect style="fill:#5386ff;fill-opacity:1;stroke:#3d77ff;stroke-width:.264582;stroke-linecap:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1" width="11.377" height="7.144" x="14.023" y="14.552" rx=".397" ry=".397"/><rect style="fill:#5386ff;fill-opacity:1;stroke:#3d77ff;stroke-width:.264582;stroke-linecap:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1" width="11.377" height="7.144" x="14.023" y="-2.381" rx=".397" ry=".397"/></g></svg>
<svg class="icon-album-disposition" width="50" height="50" xmlns="http://www.w3.org/2000/svg"><rect class="background" style="display:inline;fill:#e6e6e6;stroke:none" width="50" height="50" rx="0" ry="0"/><path class="primary" style="display:inline;fill:#5386ff;stroke:none" d="M14.42 14.42a.53.53 0 0 0-.53.53v6.349c0 .29.239.529.53.529h10.584a.53.53 0 0 0 .529-.53V14.95a.53.53 0 0 0-.53-.529z" transform="translate(-.492 6.575) scale(1.90793)"/><path class="primary" style="display:inline;fill:#5386ff;stroke:none" d="M1.72 14.42a.53.53 0 0 0-.529.53v6.349c0 .29.239.529.53.529h10.582a.53.53 0 0 0 .529-.53V14.95a.53.53 0 0 0-.53-.529z" transform="translate(-.492 6.575) scale(1.90793)"/><path class="primary" style="display:inline;fill:#5386ff;stroke:none" d="M10.188 5.953a.532.532 0 0 0-.53.53v6.35c0 .29.239.528.53.528h6.35a.53.53 0 0 0 .528-.529v-6.35c0-.29-.238-.53-.529-.53z" transform="translate(-.492 6.575) scale(1.90793)"/><path class="primary" style="display:inline;fill:#5386ff;stroke:none" d="M1.72 5.953a.532.532 0 0 0-.529.53v6.35c0 .29.239.528.53.528h6.35a.53.53 0 0 0 .529-.529v-6.35c0-.29-.239-.53-.53-.53z" transform="translate(-.492 6.575) scale(1.90793)"/><path class="primary" style="display:inline;fill:#5386ff;stroke:none" d="M14.42-2.514a.53.53 0 0 0-.53.53v6.35c0 .29.239.529.53.529h10.584a.53.53 0 0 0 .529-.53v-6.35a.53.53 0 0 0-.53-.529z" transform="translate(-.492 6.575) scale(1.90793)"/><path class="primary" style="display:inline;fill:#5386ff;stroke:none" d="M1.985-2.514a.794.794 0 0 0-.794.794V4.1c0 .438.356.794.794.794h10.054a.794.794 0 0 0 .793-.794v-5.82a.794.794 0 0 0-.793-.794z" transform="translate(-.492 6.575) scale(1.90793)"/></svg>

Before

Width:  |  Height:  |  Size: 1.7 KiB

After

Width:  |  Height:  |  Size: 1.6 KiB

2
prive/themes/spip/images/album-disposition-line-xx.svg

@ -1 +1 @@
<svg width="100" height="73" viewBox="0 0 26.458 19.314" xmlns="http://www.w3.org/2000/svg"><g style="display:inline" transform="matrix(.99999 0 0 .99999 0 -3.704)"><rect style="display:inline;fill:#ececec;stroke:#ececec;stroke-width:.529167;stroke-linecap:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1" width="20.638" height="8.996" x=".265" y="8.731" rx="0" ry="0"/><rect style="fill:#5386ff;fill-opacity:1;stroke:#3d77ff;stroke-width:.264583;stroke-linecap:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1" width="7.144" height="7.144" x="1.191" y="9.657" rx=".397" ry=".397"/><rect style="fill:#5386ff;fill-opacity:1;stroke:#3d77ff;stroke-width:.264582;stroke-linecap:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1" width="7.144" height="7.144" x="9.657" y="9.657" rx=".397" ry=".397"/><path style="fill:#ccdbff;stroke:#b8cdff;stroke-width:.264583;stroke-linecap:round;stroke-opacity:1" d="M24.87 9.657c.22 0 .398.177.398.397v6.35c0 .22-.177.397-.397.397h-3.572V9.657z"/><path style="display:inline;fill:#5386ff;stroke:#3d77ff;stroke-width:.264582;stroke-linecap:round;stroke-opacity:1" d="M18.52 9.657h2.514v7.144h-2.513a.396.396 0 0 1-.397-.397v-6.35c0-.22.177-.397.397-.397z"/></g></svg>
<svg class="icon-album-disposition" width="50" height="50" xmlns="http://www.w3.org/2000/svg"><rect class="background" style="display:inline;fill:#ececec;stroke:none" width="39.558" height="17.436" y="16.282" rx="0" ry="0"/><path class="primary" style="display:inline;fill:#5386ff;stroke:none" d="M10.054 9.588a.468.468 0 0 0-.466.467v6.35c0 .256.21.464.466.464h6.35a.465.465 0 0 0 .466-.465v-6.35a.467.467 0 0 0-.466-.466z" transform="matrix(1.90404 0 0 1.93817 -.505 -.64)"/><path class="primary" style="display:inline;fill:#5386ff;stroke:none" d="M1.588 9.588a.466.466 0 0 0-.465.467v6.35c0 .256.208.464.465.464h6.35a.466.466 0 0 0 .466-.465v-6.35a.468.468 0 0 0-.467-.466h-6.35z" transform="matrix(1.90404 0 0 1.93817 -.505 -.64)"/><path class="primary" style="display:inline;fill:#5386ff;stroke:none" d="M18.457 9.588v.002a.467.467 0 0 0-.465.465v6.35c0 .256.21.465.467.464h2.582v-7.28h-2.582z" transform="matrix(1.90404 0 0 1.93817 -.505 -.64)"/><path class="primary" style="display:inline;fill:#5386ff;stroke:none;opacity:0.33" d="M21.04 9.588v7.28h3.641a.465.465 0 0 0 .466-.464v-6.35a.468.468 0 0 0-.468-.466z" transform="matrix(1.90404 0 0 1.93817 -.505 -.64)"/></svg>

Before

Width:  |  Height:  |  Size: 1.2 KiB

After

Width:  |  Height:  |  Size: 1.2 KiB

2
prive/themes/spip/images/album-disposition-list-xx.svg

@ -1 +1 @@
<svg width="100" height="100" viewBox="0 0 26.458 26.458" xmlns="http://www.w3.org/2000/svg"><g transform="matrix(.99999 0 0 .99999 -.132 3.572)" style="display:inline"><rect style="display:inline;fill:#e6e6e6;stroke:#e6e6e6;stroke-width:.529166;stroke-linecap:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1" width="25.929" height="25.929" x=".397" y="-3.307" rx="0" ry="0"/><g transform="translate(0 2.91)"><circle style="display:inline;fill:#5285ff;fill-opacity:1;stroke:#3d77ff;stroke-width:.264583;stroke-linecap:round;stroke-dasharray:none;stroke-opacity:1" cx="4.101" cy="1.72" r="1.191"/><rect style="fill:#5386ff;fill-opacity:1;stroke:#5386ff;stroke-width:.264582;stroke-linecap:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1" width="16.669" height=".265" x="7.144" y="1.588" rx=".132" ry=".132"/></g><g transform="translate(0 6.35)"><circle style="display:inline;fill:#5285ff;fill-opacity:1;stroke:#3d77ff;stroke-width:.264583;stroke-linecap:round;stroke-dasharray:none;stroke-opacity:1" cx="4.101" cy="1.72" r="1.191"/><rect style="fill:#5386ff;fill-opacity:1;stroke:#5386ff;stroke-width:.264582;stroke-linecap:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1" width="16.669" height=".265" x="7.144" y="1.588" rx=".132" ry=".132"/></g><g transform="translate(0 9.79)"><circle style="display:inline;fill:#5285ff;fill-opacity:1;stroke:#3d77ff;stroke-width:.264583;stroke-linecap:round;stroke-dasharray:none;stroke-opacity:1" cx="4.101" cy="1.72" r="1.191"/><rect style="fill:#5386ff;fill-opacity:1;stroke:#5386ff;stroke-width:.264582;stroke-linecap:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1" width="16.669" height=".265" x="7.144" y="1.588" rx=".132" ry=".132"/></g><g transform="translate(0 13.23)"><circle style="display:inline;fill:#5285ff;fill-opacity:1;stroke:#3d77ff;stroke-width:.264583;stroke-linecap:round;stroke-dasharray:none;stroke-opacity:1" cx="4.101" cy="1.72" r="1.191"/><rect style="fill:#5386ff;fill-opacity:1;stroke:#5386ff;stroke-width:.264582;stroke-linecap:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1" width="16.669" height=".265" x="7.144" y="1.588" rx=".132" ry=".132"/></g></g></svg>
<svg class="icon-album-disposition" width="50" height="50" xmlns="http://www.w3.org/2000/svg"><rect class="background" style="display:inline;fill:#e6e6e6;stroke:none" width="50" height="50" rx="0" ry="0"/><path class="primary" style="display:inline;fill:#5285ff;stroke:none" d="M4.102 13.69c-.695 0-1.262.564-1.262 1.26a1.261 1.261 0 1 0 1.262-1.26zm3.173 1.058a.203.203 0 0 0-.201.202c0 .111.091.202.201.202h16.407a.2.2 0 0 0 .2-.201v-.001c0-.11-.09-.202-.2-.202H7.275zM4.102 10.25c-.695 0-1.262.565-1.262 1.26a1.26 1.26 0 1 0 1.262-1.26zm3.173 1.058a.203.203 0 0 0-.201.202v.002c0 .11.091.2.201.2h16.407a.2.2 0 0 0 .2-.2v-.002c0-.11-.09-.202-.2-.202H7.275zM4.102 6.81c-.695 0-1.262.565-1.262 1.26a1.26 1.26 0 1 0 1.262-1.26zm3.173 1.06a.203.203 0 0 0-.201.202c0 .11.091.2.201.2h16.407a.201.201 0 0 0 0-.402H7.275zM4.102 3.369c-.695 0-1.262.567-1.262 1.262a1.26 1.26 0 1 0 1.262-1.262zm3.173 1.058a.205.205 0 0 0-.201.204c0 .11.091.2.201.2h16.407a.2.2 0 0 0 .2-.2c0-.11-.09-.204-.2-.204H7.275z" transform="translate(-.492 6.575) scale(1.90793)"/></svg>

Before

Width:  |  Height:  |  Size: 2.2 KiB

After

Width:  |  Height:  |  Size: 1.0 KiB

2
prive/themes/spip/images/album-disposition-masonry-xx.svg

@ -1 +1 @@
<svg width="100" height="100" viewBox="0 0 26.458 26.458" xmlns="http://www.w3.org/2000/svg"><g transform="matrix(0 .99999 -.99999 0 22.886 -.132)" style="display:inline"><rect style="display:inline;fill:#e6e6e6;stroke:#e6e6e6;stroke-width:.529165;stroke-linecap:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1" width="25.929" height="25.929" x=".397" y="-3.307" rx="0" ry="0"/><rect style="fill:#5386ff;fill-opacity:1;stroke:#3d77ff;stroke-width:.264583;stroke-linecap:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1" width="11.377" height="7.144" x="1.323" y="-2.381" rx=".397" ry=".397"/><rect style="fill:#5386ff;fill-opacity:1;stroke:#3d77ff;stroke-width:.264583;stroke-linecap:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1" width="7.144" height="7.144" x="1.323" y="6.085" rx=".397" ry=".397"/><rect style="fill:#5386ff;fill-opacity:1;stroke:#3d77ff;stroke-width:.264582;stroke-linecap:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1" width="7.144" height="7.144" x="9.79" y="6.085" rx=".397" ry=".397"/><rect style="fill:#5386ff;fill-opacity:1;stroke:#3d77ff;stroke-width:.264583;stroke-linecap:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1" width="11.377" height="7.144" x="1.323" y="14.552" rx=".397" ry=".397"/><rect style="fill:#5386ff;fill-opacity:1;stroke:#3d77ff;stroke-width:.264582;stroke-linecap:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1" width="11.377" height="7.144" x="14.023" y="14.552" rx=".397" ry=".397"/><rect style="fill:#5386ff;fill-opacity:1;stroke:#3d77ff;stroke-width:.264582;stroke-linecap:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1" width="11.377" height="7.144" x="14.023" y="-2.381" rx=".397" ry=".397"/></g></svg>
<svg class="icon-album-disposition" width="50" height="50" xmlns="http://www.w3.org/2000/svg"><rect class="background" style="display:inline;fill:#e6e6e6;stroke:none" width="50" height="50" rx="0" ry="0"/><path class="primary" style="display:inline;fill:#5386ff;stroke:none" d="M15.914 27.02a1.011 1.011 0 0 0-1.01-1.01H2.79a1.011 1.011 0 0 0-1.01 1.01v20.194c0 .553.454 1.01 1.012 1.01h12.113a1.011 1.011 0 0 0 1.01-1.012z"/><path class="primary" style="display:inline;fill:#5386ff;stroke:none" d="M15.914 2.792a1.011 1.011 0 0 0-1.01-1.012H2.79a1.011 1.011 0 0 0-1.01 1.012v20.19c0 .553.454 1.009 1.012 1.009h12.113a1.011 1.011 0 0 0 1.01-1.012z"/><path class="primary" style="display:inline;fill:#5386ff;stroke:none" d="M32.069 18.946c0-.555-.456-1.011-1.011-1.011H18.942c-.553 0-1.007.456-1.007 1.011v12.115c0 .554.454 1.008 1.01 1.008h12.114c.554 0 1.012-.454 1.012-1.01z"/><path class="primary" style="display:inline;fill:#5386ff;stroke:none" d="M32.069 2.792c0-.556-.456-1.012-1.011-1.012H18.942a1.011 1.011 0 0 0-1.007 1.012v12.115c0 .553.454 1.01 1.01 1.01h12.114c.554 0 1.012-.457 1.012-1.012z"/><path class="primary" style="display:inline;fill:#5386ff;stroke:none" d="M48.223 27.02a1.011 1.011 0 0 0-1.011-1.01H35.097a1.011 1.011 0 0 0-1.01 1.01v20.194c0 .553.456 1.01 1.012 1.01h12.115a1.011 1.011 0 0 0 1.01-1.012z"/><path class="primary" style="display:inline;fill:#5386ff;stroke:none" d="M48.223 3.293a1.515 1.515 0 0 0-1.515-1.513H35.602a1.515 1.515 0 0 0-1.515 1.515v19.183c0 .833.68 1.513 1.515 1.513h11.106a1.515 1.515 0 0 0 1.515-1.513z"/></svg>

Before

Width:  |  Height:  |  Size: 1.7 KiB

After

Width:  |  Height:  |  Size: 1.5 KiB

2
prive/themes/spip/images/album-disposition-mosaic-xx.svg

@ -1 +1 @@
<svg width="100" height="100" viewBox="0 0 26.458 26.458" xmlns="http://www.w3.org/2000/svg"><g transform="matrix(.99999 0 0 .99999 0 3.572)" style="display:inline"><rect style="display:inline;fill:#e6e6e6;stroke:#e6e6e6;stroke-width:.529167;stroke-linecap:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1" width="25.929" height="25.929" x=".265" y="-3.307" rx="0" ry="0"/><rect style="fill:#5386ff;fill-opacity:1;stroke:#3d77ff;stroke-width:.264584;stroke-linecap:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1" width="7.144" height="15.61" x="1.191" y="-2.381" rx=".397" ry=".397"/><rect style="fill:#5386ff;fill-opacity:1;stroke:#3d77ff;stroke-width:.264582;stroke-linecap:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1" width="15.61" height="7.144" x="9.657" y="-2.381" rx=".397" ry=".397"/><rect style="fill:#5386ff;fill-opacity:1;stroke:#3d77ff;stroke-width:.264584;stroke-linecap:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1" width="7.144" height="7.144" x="9.657" y="6.085" rx=".397" ry=".397"/><rect style="fill:#5386ff;fill-opacity:1;stroke:#3d77ff;stroke-width:.264584;stroke-linecap:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1" width="7.144" height="7.144" x="18.124" y="6.085" rx=".397" ry=".397"/><rect style="fill:#5386ff;fill-opacity:1;stroke:#3d77ff;stroke-width:.264582;stroke-linecap:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1" width="15.61" height="7.144" x="1.191" y="14.552" rx=".397" ry=".397"/><rect style="fill:#5386ff;fill-opacity:1;stroke:#3d77ff;stroke-width:.264584;stroke-linecap:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1" width="7.144" height="7.144" x="18.124" y="14.552" rx=".397" ry=".397"/></g></svg>
<svg class="icon-album-disposition" width="50" height="50" xmlns="http://www.w3.org/2000/svg"><rect class="background" style="display:inline;fill:#e6e6e6;stroke:none" width="50" height="50" rx="0" ry="0"/><path class="primary" style="display:inline;fill:#5386ff;stroke:none" d="M35.097 34.087c-.555 0-1.01.455-1.01 1.01v12.115c0 .555.455 1.01 1.01 1.01h12.116c.555 0 1.01-.455 1.01-1.01V35.097c0-.555-.455-1.01-1.01-1.01z"/><path class="primary" style="color:#000;display:inline;fill:#5386ff;stroke-width:.264579;stroke-linecap:round" d="M2.79 34.087c-.556 0-1.01.455-1.01 1.01v12.115c0 .555.454 1.01 1.01 1.01h28.268c.555 0 1.01-.455 1.01-1.01V35.097c0-.555-.455-1.01-1.01-1.01z"/><path class="primary" style="display:inline;fill:#5386ff;stroke:none" d="M35.097 17.932c-.555 0-1.01.456-1.01 1.01v12.116c0 .555.455 1.01 1.01 1.01h12.116c.555 0 1.01-.455 1.01-1.01V18.942c0-.555-.455-1.01-1.01-1.01zm-16.154 0c-.555 0-1.01.456-1.01 1.01v12.116c0 .555.455 1.01 1.01 1.01h12.115c.555 0 1.01-.455 1.01-1.01V18.942c0-.555-.455-1.01-1.01-1.01z"/><path class="primary" style="display:inline;fill:#5386ff;stroke:none" d="M18.943 1.779c-.555 0-1.01.454-1.01 1.01v12.115c0 .555.455 1.01 1.01 1.01H47.21c.555 0 1.01-.455 1.01-1.01V2.788c0-.555-.455-1.01-1.01-1.01z"/><path class="primary" style="display:inline;fill:#5386ff;stroke:none" d="M2.79 1.779c-.556 0-1.01.454-1.01 1.01v28.269c0 .555.454 1.01 1.01 1.01h12.114c.555 0 1.01-.455 1.01-1.01V2.788c0-.555-.455-1.01-1.01-1.01z"/></svg>

Before

Width:  |  Height:  |  Size: 1.7 KiB

After

Width:  |  Height:  |  Size: 1.4 KiB

2
prive/themes/spip/images/album-disposition-simple-xx.svg

@ -1 +1 @@
<svg width="100" height="100" viewBox="0 0 26.458 26.458" xmlns="http://www.w3.org/2000/svg"><g transform="matrix(.99999 0 0 .99999 -.132 3.572)" style="display:inline"><rect style="display:inline;fill:#e6e6e6;stroke:#e6e6e6;stroke-width:.529166;stroke-linecap:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1" width="25.929" height="25.929" x=".397" y="-3.307" rx="0" ry="0"/><rect style="display:inline;fill:none;fill-opacity:1;stroke:#5386ff;stroke-width:.529167;stroke-linecap:round;stroke-dasharray:none;stroke-opacity:1" width="10.583" height="5.292" x="8.07" y="-.661" rx=".394" ry=".462"/><rect style="display:inline;fill:none;fill-opacity:1;stroke:#5386ff;stroke-width:.529167;stroke-linecap:round;stroke-dasharray:none;stroke-opacity:1" width="10.583" height="5.292" x="8.07" y="7.011" rx=".394" ry=".462"/><rect style="display:inline;fill:none;fill-opacity:1;stroke:#5386ff;stroke-width:.529167;stroke-linecap:round;stroke-dasharray:none;stroke-opacity:1" width="10.583" height="5.292" x="8.07" y="14.684" rx=".394" ry=".462"/></g></svg>
<svg class="icon-album-disposition" width="50" height="50" xmlns="http://www.w3.org/2000/svg"><rect class="background" style="display:inline;fill:#e6e6e6;stroke:none" width="50" height="50" rx="0" ry="0"/><rect class="primary" style="display:inline;fill:#5386ff;stroke:none" width="19.999" height="10.001" x="15.001" y="5.501" rx=".745" ry=".873"/><rect class="primary" style="display:inline;fill:#5386ff;stroke:none" width="19.999" height="10.001" x="15.001" y="19.999" rx=".745" ry=".873"/><rect class="primary" style="display:inline;fill:#5386ff;stroke:none" width="19.999" height="10.001" x="15.001" y="34.5" rx=".745" ry=".873"/></svg>

Before

Width:  |  Height:  |  Size: 1.0 KiB

After

Width:  |  Height:  |  Size: 640 B

57
saisies/disposition_album.html

@ -2,23 +2,50 @@
Saisie permettant de choisir la disposition d'affichage d'un album
Nb : on ne réutilise pas la saisie radio de base car on veut embarquer les svg, ce qui n'est pas possible actuellement avec le param data.
Paramètres :
- multiple : n'importe quelle valeur évaluée à true pour saisir plusieurs choix
+ params des saisies checkbox ou radio
- valeur_forcee
- defaut
- id
- obligatoire
- disable
- readonly
- attributs
- class
]
#SET{saisie,#ENV{multiple}|?{checkbox,radio}}
#SET{data,#ARRAY}
#SET{dispositions,#REM|albums_decrire_dispositions|array_keys}
#SET{defaut, #ENV{defaut,#GET{dispositions/0}}}
<BOUCLE_set_data(DATA) {source table, #GET{dispositions}} {valeur != *}>
#SET{data,#GET{data}|array_merge{#ARRAY{
#VALEUR,#CHEMIN_IMAGE{album-disposition-#VALEUR-xx.svg}
|balise_img
|image_reduire{50}
|inserer_attribut{title,#VAL{album:disposition_}|concat{#VALEUR,_explication}|_T}
|concat{' ',#VAL{album:disposition_#VALEUR}|_T}
}}}
</BOUCLE_set_data>
#SET{valeur, #ENV{valeur_forcee,#ENV{valeur,#ENV{defaut,#GET{dispositions/0}}}}}
#SET{disable_choix, #ENV{disable_choix}|saisies_normaliser_disable_choix}
#SET{compteur_id,0}
<BOUCLE_dispositions(DATA) {source table, #GET{dispositions}} {valeur != *}>
#SET{compteur_id,#GET{compteur_id}|plus{1}}
#SET{disabled, #ENV{disable}|is_string|?{#ENV{disable}, #ENV{disable/#CLE}}}
#SET{checked,#GET{valeur}|strval|=={#VALEUR|strval}}
<div class="#ENV{choix,choix}[ (#ENV{choix,choix})_#VALEUR] choix_disposition-album[ (#ENV{class})]">
<input type="radio" name="#ENV{nom}" class="radio"[ (#HTML5|oui)[(#ENV{obligatoire}|et{#ENV{obligatoire}|!={non}}|oui) required="required"]] id="champ_[(#ENV{id,#ENV{nom}}|saisie_nom2classe)]_#GET{compteur_id}"[ (#GET{checked}|oui)checked="checked"] value="#VALEUR"[(#GET{disabled}|ou{#CLE|in_array{#GET{disable_choix}}}) disabled="disabled"][ readonly="(#ENV{readonly})"][ aria-describedby="(#ENV{describedby})"][ (#ENV*{attributs})] />
<label for="champ_[(#ENV{id,#ENV{nom}}|saisie_nom2classe)]_#GET{compteur_id}"[ (#GET{checked}|oui)class="on"] title="[(#VAL{album:disposition_}|concat{#VALEUR,_explication}|_T)]">[(#INCLURE{#CHEMIN_IMAGE{album-disposition-#VALEUR-xx.svg}}) ][<span>(#VAL{album:disposition_#VALEUR}|_T)</span>]</label>
</div>
</BOUCLE_dispositions>
<INCLURE{fond=saisies/#GET{saisie}, data=#GET{data}, defaut=#GET{defaut}, env}>
<style>
.choix.choix_disposition-album,
.choix.choix_disposition-album label {
display: flex !important;
align-items: center;
}
.choix.choix_disposition-album label {
margin-inline-start: 0.5em !important;
margin-inline-end: 0;
}
.choix.choix_disposition-album svg {
margin-inline-end: 0.5em;
}
.choix.choix_disposition-album svg .primary {
fill: var(--spip-color-theme, #5386ff) !important;
}
.choix.choix_disposition-album svg .background {
fill: var(--spip-color-gray-lightest, #eee) !important;
}
</style>
Loading…
Cancel
Save