Low-resolution icon appears blurry in HiDPI screens #102

Use the unicode search character
Dominique92 · Sep 13, 2023 · df6d12f · df6d12f
1 parent 7043b2e
commit df6d12f
Show file tree

Hide file tree

Showing 6 changed files with 24 additions and 28 deletions.
diff --git a/dist/ol-geocoder-debug.js b/dist/ol-geocoder-debug.js
diff --git a/dist/ol-geocoder.css b/dist/ol-geocoder.css
@@ -2,7 +2,7 @@
  * ol-geocoder - v4.3.1-dev
  * A geocoder extension compatible with OpenLayers v7+ & v8+
  * https://github.com/Dominique92/ol-geocoder
- * Built: Wed Sep 13 2023 20:36:11 GMT+0200 (heure d’été d’Europe centrale)
+ * Built: Wed Sep 13 2023 20:58:28 GMT+0200 (heure d’été d’Europe centrale)
  */
 
  .ol-touch .ol-control.gcd-gl-control button {
@@ -74,11 +74,10 @@
   width: 1.5625em;
   height: 1.5625em;
   top: 0.125em;
-  left: 0.125em;
-  background-image: url("data:image/png;base64,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");
-  background-repeat: no-repeat;
-  background-position: center center;
-  background-size: 20px; }
+  left: 0.125em; }
+
+.ol-geocoder .gcd-gl-btn:after {
+  content: "\1F50D"; }
 
 .ol-geocoder ul.gcd-gl-result {
   position: absolute;
@@ -182,16 +181,15 @@
 
 .ol-geocoder .gcd-txt-glass {
   position: absolute;
-  top: 0;
-  left: 0;
+  top: 26px;
+  left: 9px;
   z-index: 100;
   display: inline-block;
   width: 2.5em;
-  height: 100%;
-  background-size: 1.38889em;
-  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='32' height='32' viewBox='0 0 32 32'%3E%3Cpath fill='%23333' d='M29.156 29.961l-.709.709a2.006 2.006 0 0 1-2.838 0l-5.676-5.674c-.656-.658-.729-1.644-.281-2.412l-3.104-3.102a9.975 9.975 0 0 1-5.965 1.979C5.043 21.461.552 16.97.552 11.43S5.043 1.398 10.583 1.398c5.541 0 10.031 4.491 10.031 10.032 0 2.579-.98 4.923-2.58 6.7l3.035 3.035c.768-.447 1.754-.375 2.41.283l5.676 5.674c.784.785.784 2.056.001 2.839zM18.088 11.389c0-4.155-3.369-7.523-7.524-7.523a7.523 7.523 0 1 0-.001 15.046 7.525 7.525 0 0 0 7.525-7.523z'/%3E%3C/svg%3E");
-  background-repeat: no-repeat;
-  background-position: center center; }
+  height: 100%; }
+
+.ol-geocoder .gcd-txt-glass:after {
+  content: "\1F50D"; }
 
 .ol-geocoder ul.gcd-txt-result {
   position: absolute;