Improve save button styles

app/components/icon.gjs

@@ -1,6 +1,8 @@
 import Component from '@glimmer/component';
 import { htmlSafe } from '@ember/template';
 
+import arrowLeft from 'feather-icons/dist/icons/arrow-left.svg?raw';
+import bookmark from 'feather-icons/dist/icons/bookmark.svg?raw';
 import clock from 'feather-icons/dist/icons/clock.svg?raw';
 import globe from 'feather-icons/dist/icons/globe.svg?raw';
 import home from 'feather-icons/dist/icons/home.svg?raw';
@@ -8,22 +10,22 @@ import map from 'feather-icons/dist/icons/map.svg?raw';
 import mapPin from 'feather-icons/dist/icons/map-pin.svg?raw';
 import navigation from 'feather-icons/dist/icons/navigation.svg?raw';
 import phone from 'feather-icons/dist/icons/phone.svg?raw';
-import user from 'feather-icons/dist/icons/user.svg?raw';
 import settings from 'feather-icons/dist/icons/settings.svg?raw';
-import arrowLeft from 'feather-icons/dist/icons/arrow-left.svg?raw';
+import user from 'feather-icons/dist/icons/user.svg?raw';
 import x from 'feather-icons/dist/icons/x.svg?raw';
 
 const ICONS = {
+  'arrow-left': arrowLeft,
+  bookmark,
   clock,
   globe,
   home,
   map,
-  mapPin,
+  'map-pin': mapPin,
   navigation,
   phone,
-  user,
   settings,
-  'arrow-left': arrowLeft,
+  user,
   x
 };
 

app/components/place-details.gjs

@@ -130,10 +130,11 @@ export default class PlaceDetails extends Component {
       <div class="actions">
         <button
           type="button"
-          class={{if this.place.createdAt "btn-secondary" "btn-primary"}}
+          class={{if this.place.createdAt "btn btn-secondary" "btn btn-outline"}}
           {{on "click" (fn @onToggleSave this.place)}}
         >
-          {{if this.place.createdAt "Saved ✓" "Save"}}
+          <Icon @name="bookmark" @color={{if this.place.createdAt "currentColor" "#007bff"}} />
+          {{if this.place.createdAt "Saved" "Save"}}
         </button>
       </div>
 
@@ -185,7 +186,7 @@ export default class PlaceDetails extends Component {
         {{/if}}
 
         <p class="content-with-icon">
-          <Icon @name="mapPin" @title="Geo link" />
+          <Icon @name="map-pin" @title="Geo link" />
           <span>
             <a href={{this.geoLink}} target="_blank" rel="noopener noreferrer">
               {{this.visibleGeoLink}}