# CSS Trick: Change Favorite Heart to Bookmark

**URL:** <https://community.glideapps.com/t/css-trick-change-favorite-heart-to-bookmark/17951>\
**Category:** Community Resources\
**Created:** [November 4, 2020, 4:08pm UTC](https://community.glideapps.com/t/css-trick-change-favorite-heart-to-bookmark/17951 "2020-11-04T16:08:38Z")\
**Posts on this page:** 12\
**Page:** 3

<div class="post-metadata">

**Author:** ![Cyezwa](https://avatars.discourse-cdn.com/v4/letter/c/ad7895/32.png) [@Cyezwa](https://community.glideapps.com/u/Cyezwa)\
**Post date:** [June 3, 2021, 8:33am UTC](https://community.glideapps.com/t/css-trick-change-favorite-heart-to-bookmark/17951/42 "2021-06-03T08:33:43Z")

</div>

Hi, I know this might be out of the topic but am kindly asking for help on how to change the glide app icon to anything that is not a thumbs up please…

---

<div class="post-metadata">

**Author:** ![Manu.n](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/manu.n/32/11679_2.png) [@Manu.n](https://community.glideapps.com/u/Manu.n)\
**Post date:** [June 3, 2021, 8:39am UTC](https://community.glideapps.com/t/css-trick-change-favorite-heart-to-bookmark/17951/43 "2021-06-03T08:39:40Z")

</div>

this ???

 ![image](https://us1.discourse-cdn.com/flex002/uploads/glideapps/original/3X/f/d/fd0b2c441f09dcedc7aa838309fd0e99e432262c.png)

---

<div class="post-metadata">

**Author:** ![Cyezwa](https://avatars.discourse-cdn.com/v4/letter/c/ad7895/32.png) [@Cyezwa](https://community.glideapps.com/u/Cyezwa)\
**Post date:** [June 3, 2021, 9:23am UTC](https://community.glideapps.com/t/css-trick-change-favorite-heart-to-bookmark/17951/44 "2021-06-03T09:23:05Z")

</div>

Yes and thank you

---

<div class="post-metadata">

**Author:** ![Kyan\_Lynch](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/kyan_lynch/32/28521_2.png) [@Kyan\_Lynch](https://community.glideapps.com/u/Kyan_Lynch)\
**Post date:** [October 21, 2021, 9:53pm UTC](https://community.glideapps.com/t/css-trick-change-favorite-heart-to-bookmark/17951/45 "2021-10-21T21:53:36Z")

</div>

> [@Robert\_Petitto](#):
>
> ```auto
> <pre><span><style>
> [data-test="app-switch-view"] :nth-child(2) :nth-child(1) :nth-child(1) {
> stroke: white;
> box-shadow: 1px 1px 45px 3px rgba(136,136,136,1);
> d: path("m 12 0 l 3 7 l 7 1 l -5 5 l 2 7 l -7 -4 l -7 4 l 2 -7 l -5 -5 l 7 -1 l 3 -7");
> }
> 
> ```

This is awesome! Is there any way to add a button, rather than replace the “favorite” button in an inline list?

---

<div class="post-metadata">

**Author:** ![Robert\_Petitto](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/robert_petitto/32/25193_2.png) [@Robert\_Petitto](https://community.glideapps.com/u/Robert_Petitto)\
**Post date:** [October 21, 2021, 10:13pm UTC](https://community.glideapps.com/t/css-trick-change-favorite-heart-to-bookmark/17951/46 "2021-10-21T22:13:57Z")

</div>

I wish.

---

<div class="post-metadata">

**Author:** ![Kyan\_Lynch](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/kyan_lynch/32/28521_2.png) [@Kyan\_Lynch](https://community.glideapps.com/u/Kyan_Lynch)\
**Post date:** [October 21, 2021, 10:20pm UTC](https://community.glideapps.com/t/css-trick-change-favorite-heart-to-bookmark/17951/47 "2021-10-21T22:20:20Z")

</div>

> [@Robert\_Petitto](#):
>
> `d: path("m 12 0 l 3 7 l 7 1 l -5 5 l 2 7 l -7 -4 l -7 4 l 2 -7 l -5 -5 l 7 -1 l 3 -7");`

Hmmm… could I replace the caption with a pseudo-button, and then set up an action associated with the rich text?

---

<div class="post-metadata">

**Author:** ![ThinhDinh](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/thinhdinh/32/49_2.png) [@ThinhDinh](https://community.glideapps.com/u/ThinhDinh)\
**Post date:** [October 21, 2021, 11:39pm UTC](https://community.glideapps.com/t/css-trick-change-favorite-heart-to-bookmark/17951/48 "2021-10-21T23:39:34Z")

</div>

Good idea, but you might run into problems if the inline list action overrides the underlying rich text action.

Pages let you have a button on the list item, if I recall right.

---

<div class="post-metadata">

**Author:** ![Kyan\_Lynch](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/kyan_lynch/32/28521_2.png) [@Kyan\_Lynch](https://community.glideapps.com/u/Kyan_Lynch)\
**Post date:** [October 22, 2021, 8:17pm UTC](https://community.glideapps.com/t/css-trick-change-favorite-heart-to-bookmark/17951/49 "2021-10-22T20:17:19Z")

</div>

> [@Robert\_Petitto](#):
>
> `[data-test="app-toggle-icon-overlay"] :nth-child(1) :nth-child(1) {`

Do you know how to accomplish this in a card list?

---

<div class="post-metadata">

**Author:** ![ThinhDinh](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/thinhdinh/32/49_2.png) [@ThinhDinh](https://community.glideapps.com/u/ThinhDinh)\
**Post date:** [October 22, 2021, 11:46pm UTC](https://community.glideapps.com/t/css-trick-change-favorite-heart-to-bookmark/17951/50 "2021-10-22T23:46:17Z")

</div>

The same code works I think.

 ![image](https://us1.discourse-cdn.com/flex002/uploads/glideapps/original/3X/a/8/a8742388e9ba6dea897b5af2eeb21dfd8c7093ee.jpeg)

---

<div class="post-metadata">

**Author:** ![callahan\_70](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/callahan_70/32/24725_2.png) [@callahan\_70](https://community.glideapps.com/u/callahan_70)\
**Post date:** [January 26, 2023, 4:04pm UTC](https://community.glideapps.com/t/css-trick-change-favorite-heart-to-bookmark/17951/51 "2023-01-26T16:04:48Z")

</div>

Hi,  
How can I apply this?  
I want a bookmark, but It doesn’t work for me.

Thanks in advance

 ![Captura de pantalla 2023-01-26 170337](https://us1.discourse-cdn.com/flex002/uploads/glideapps/original/3X/5/0/509981867f3fb9c6acddf2b3de71d127b4d1e947.png)

---

<div class="post-metadata">

**Author:** ![ThinhDinh](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/thinhdinh/32/49_2.png) [@ThinhDinh](https://community.glideapps.com/u/ThinhDinh)\
**Post date:** [January 27, 2023, 12:18am UTC](https://community.glideapps.com/t/css-trick-change-favorite-heart-to-bookmark/17951/52 "2023-01-27T00:18:50Z")

</div>

Please be careful with using CSS going forward with the looming transition to Pages. It would almost certainly break, pending what they want to do with legacy Apps.

---

<div class="post-metadata">

**Author:** ![callahan\_70](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/callahan_70/32/24725_2.png) [@callahan\_70](https://community.glideapps.com/u/callahan_70)\
**Post date:** [January 27, 2023, 12:01pm UTC](https://community.glideapps.com/t/css-trick-change-favorite-heart-to-bookmark/17951/53 "2023-01-27T12:01:29Z")

</div>

Yes, I hope the changes will allow customizing the different glide components 😅 😅

[Previous page](https://community.glideapps.com/t/css-trick-change-favorite-heart-to-bookmark/17951.md?page=2)