- Merge request !19Issue #3195460: Posibility to change the icon manually? → (Merged) created by anacolautti
- Status changed to Needs review
over 1 year ago 11:13am 15 August 2023 - 🇩🇪Germany anacolautti
I added 2 fields in the settings form, allowing users to enter (version controlled) paths to images.
This overrides the CSS background-image style attribute.I made some other changes:
- at the JS I changed some selectors. I realized I was using them wrong.
- at the original CSS I changed the background-size attribute of the icons, and set it to "contain". This works better with different icons.I know this is a minor feature, but I believe this would provide users more flexibility.
I'm thinking of allowing file uploads as well in the next iteration, like I said in the ticket description a while ago.I'd appreciate if someone could test this.
- Status changed to RTBC
10 months ago 6:36am 25 January 2024 - 🇮🇳India sumit-k
I've verified the changes, and it seems that the uploaded icons are now successfully visible on the user login page. This enhancement not only adds a visual appeal but also provides a more personalized and engaging experience for users.
-
anacolautti →
committed e24f2e6f on 6.0.x
Issue #3195460 by anacolautti, sumit-k, felipecanedopero: Posibility to...
-
anacolautti →
committed e24f2e6f on 6.0.x
- Status changed to Fixed
8 months ago 2:52pm 25 March 2024 - 🇩🇪Germany anacolautti
Thank you very much @sumit-k. This will be in the next release, a week from now (1st April).
- 🇫🇷France mably
For those interested, the SVG images can easily be replaced in CSS using something like this (changing the fill color to Gray here):
.eye-open { background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' style='isolation:isolate' viewBox='0 0 24 16' width='24' height='16'><defs><clipPath id='_clipPath_zNqFDs7A04e5gw6PzL4Pwp30PPON3aDb'><rect width='24' height='16'/></clipPath></defs><g clip-path='url(%23_clipPath_zNqFDs7A04e5gw6PzL4Pwp30PPON3aDb)'><path d=' M 11.653 0.73 C 9.265 0.942 6.524 2.319 3.447 4.853 C 2.385 5.727 0.919 7.092 0.37 7.717 C 0.236 7.87 0.253 7.896 0.959 8.603 C 5.115 12.766 9.429 15.162 12.461 14.991 C 15.605 14.815 19.761 12.32 23.729 8.228 C 24.122 7.824 24.14 7.889 23.431 7.177 C 19.122 2.856 14.738 0.456 11.653 0.73 Z M 12.596 3.305 C 15.684 3.658 17.361 7.537 15.646 10.357 C 13.888 13.247 10.017 13.068 8.488 10.026 C 6.888 6.844 9.283 2.926 12.596 3.305 Z M 11.916 5.415 C 10.101 5.641 9.285 7.979 10.489 9.501 C 11.335 10.569 12.975 10.572 13.826 9.506 C 15.184 7.804 13.95 5.161 11.916 5.415 Z ' fill-rule='evenodd' fill='rgb(128,128,128)'/></g></svg>"); } .eye-close { background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' style='isolation:isolate' viewBox='0 0 24 16' width='24' height='16'><defs><clipPath id='_clipPath_hXFkOW2PDDbIXG5UwxQ5897ZvrAVu9UT'><rect width='24' height='16'/></clipPath></defs><g clip-path='url(%23_clipPath_hXFkOW2PDDbIXG5UwxQ5897ZvrAVu9UT)'><path d=' M 15.066 -0.197 C 14.876 -0.139 14.785 -0.038 14.464 0.473 C 14.089 1.072 14.188 1.008 13.716 0.954 C 8.463 0.356 3.51 2.464 0.413 6.616 C -0.189 7.423 -0.168 8.119 0.486 8.99 C 1.852 10.809 3.813 12.383 5.903 13.338 C 6.239 13.492 6.23 13.476 6.099 13.681 C 5.766 14.203 5.741 14.578 6.025 14.826 C 6.197 14.976 7.623 15.659 7.891 15.719 C 8.407 15.836 8.59 15.725 9.02 15.034 C 9.171 14.791 9.706 13.942 10.21 13.148 C 10.713 12.354 12.197 10.004 13.508 7.925 C 14.819 5.847 16.266 3.554 16.724 2.83 C 17.59 1.461 17.681 1.295 17.658 1.12 C 17.613 0.78 17.508 0.676 16.885 0.356 C 15.769 -0.218 15.452 -0.314 15.066 -0.197 Z M 18.932 2.882 C 18.879 2.905 18.823 2.942 18.808 2.963 C 18.675 3.151 18.083 4.103 18.046 4.187 C 17.934 4.447 18.007 4.571 18.445 4.861 C 19.588 5.618 20.502 6.449 21.359 7.509 C 21.56 7.758 21.561 7.747 21.318 8.045 C 19.237 10.593 16.395 12.172 13.263 12.522 C 12.659 12.59 12.745 12.521 12.211 13.361 C 11.75 14.085 11.696 14.187 11.696 14.339 C 11.694 14.644 11.943 14.697 13.015 14.623 C 16.743 14.366 20.081 12.759 22.635 9.994 C 24.193 8.307 24.328 7.661 23.388 6.397 C 22.622 5.366 21.543 4.343 20.28 3.453 C 19.445 2.863 19.206 2.762 18.932 2.882 Z M 12.08 3.126 C 12.45 3.295 12.245 3.582 11.731 3.614 C 10.161 3.713 9.071 4.71 8.936 6.172 C 8.903 6.54 8.548 6.657 8.385 6.353 C 8.309 6.212 8.382 5.708 8.54 5.282 C 8.838 4.48 9.732 3.652 10.661 3.319 C 11.167 3.137 11.888 3.039 12.08 3.126 Z M 6.088 4.65 C 5.701 5.754 5.741 7.094 6.192 8.169 C 6.567 9.063 7.181 9.844 7.992 10.458 C 8.101 10.541 8.126 10.48 7.728 11.115 C 7.356 11.709 7.419 11.673 7.05 11.499 C 5.305 10.681 3.886 9.572 2.647 8.055 C 2.382 7.731 2.387 7.769 2.573 7.538 C 3.532 6.346 4.578 5.416 5.807 4.664 C 6.149 4.454 6.156 4.454 6.088 4.65 Z M 17.511 5.13 C 17.381 5.183 17.557 4.917 15.612 7.993 C 13.598 11.176 13.696 11.001 13.826 11.196 C 13.96 11.398 14.207 11.384 14.765 11.143 C 17.126 10.127 18.509 7.742 18.063 5.455 C 18 5.134 17.798 5.015 17.511 5.13 Z ' fill-rule='evenodd' fill='rgb(128,128,128)'/></g></svg>"); }
Automatically closed - issue fixed for 2 weeks with no activity.