# Beautiful Design App

**URL:** <https://community.glideapps.com/t/beautiful-design-app/16191>\
**Category:** Project Showcase\
**Created:** [September 22, 2020, 12:23pm UTC](https://community.glideapps.com/t/beautiful-design-app/16191 "2020-09-22T12:23:59Z")\
**Posts on this page:** 20\
**Page:** 18

<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 30, 2021, 12:21pm UTC](https://community.glideapps.com/t/beautiful-design-app/16191/346 "2021-01-30T12:21:49Z")

</div>

What color do you want it to be?

---

<div class="post-metadata">

**Author:** ![kyleheney](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/kyleheney/32/41173_2.png) [@kyleheney](https://community.glideapps.com/u/kyleheney)\
**Post date:** [January 30, 2021, 12:49pm UTC](https://community.glideapps.com/t/beautiful-design-app/16191/347 "2021-01-30T12:49:00Z")

</div>

Maybe a light blue (similar to default hint style)? If I have the basics, I can play with the specifics. Thanks @ThinhDinh

---

<div class="post-metadata">

**Author:** ![Pedroydzito](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/pedroydzito/32/85187_2.png) [@Pedroydzito](https://community.glideapps.com/u/Pedroydzito)\
**Post date:** [January 30, 2021, 2:25pm UTC](https://community.glideapps.com/t/beautiful-design-app/16191/348 "2021-01-30T14:25:09Z")

</div>

Oh my God, that second calendar is so beautiful, perfect to see, congratulations on your effort

---

<div class="post-metadata">

**Author:** ![Pedroydzito](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/pedroydzito/32/85187_2.png) [@Pedroydzito](https://community.glideapps.com/u/Pedroydzito)\
**Post date:** [January 30, 2021, 2:36pm UTC](https://community.glideapps.com/t/beautiful-design-app/16191/349 "2021-01-30T14:36:41Z")

</div>

How did you manage to create a calendar using only the codes? When I try to create in a normal way, just with code, I don’t create anything, but just 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:** [January 30, 2021, 3:39pm UTC](https://community.glideapps.com/t/beautiful-design-app/16191/350 "2021-01-30T15:39:11Z")

</div>

Sorry but I can’t seem to find a stable class name to target it. Had to use the randomized string class name. Please note that the class name might be different in your app.

 ![image](https://us1.discourse-cdn.com/flex002/uploads/glideapps/original/3X/6/c/6c2cfa851b00c2976eb4ce054b4a456d5199c99e.jpeg)

```
<pre><span><style>
.eCKCnW {
color: black;
background: gold;
}
```

---

<div class="post-metadata">

**Author:** ![kyleheney](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/kyleheney/32/41173_2.png) [@kyleheney](https://community.glideapps.com/u/kyleheney)\
**Post date:** [January 30, 2021, 4:02pm UTC](https://community.glideapps.com/t/beautiful-design-app/16191/351 "2021-01-30T16:02:54Z")

</div>

Thanks @ThinhDinh. Yeah I was having similar struggles and wasn’t able to figure out a more stable way to do it. I may go back to separate inline lists and just create hint text titles for them.

Thanks for trying!!

---

<div class="post-metadata">

**Author:** ![Jeff\_Hager](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/jeff_hager/32/43_2.png) [@Jeff\_Hager](https://community.glideapps.com/u/Jeff_Hager)\
**Post date:** [January 30, 2021, 4:53pm UTC](https://community.glideapps.com/t/beautiful-design-app/16191/352 "2021-01-30T16:53:36Z")

</div>

@Pedroydzito It’s all a combination of the data in the sheet, using the right components, and combining that with the CSS. They all work together to make the calendar work.

---

<div class="post-metadata">

**Author:** ![everys](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/everys/32/10724_2.png) [@everys](https://community.glideapps.com/u/everys)\
**Post date:** [January 30, 2021, 7:43pm UTC](https://community.glideapps.com/t/beautiful-design-app/16191/353 "2021-01-30T19:43:21Z")

</div>

you guys’ sooo blew me away!!!

---

<div class="post-metadata">

**Author:** ![Nadir\_Abdelrahman\_MD](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/nadir_abdelrahman_md/32/5237_2.png) [@Nadir\_Abdelrahman\_MD](https://community.glideapps.com/u/Nadir_Abdelrahman_MD)\
**Post date:** [January 31, 2021, 1:42am UTC](https://community.glideapps.com/t/beautiful-design-app/16191/354 "2021-01-31T01:42:41Z")

</div>

Don’t mind me. I needed some coffee it seems. This is great work.  
Thanks for sharing.

---

<div class="post-metadata">

**Author:** ![Uzo](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/uzo/32/22639_2.png) [@Uzo](https://community.glideapps.com/u/Uzo)\
**Post date:** [February 5, 2021, 4:28am UTC](https://community.glideapps.com/t/beautiful-design-app/16191/356 "2021-02-05T04:28:20Z")

</div>

what is !important command do for this code? and is there a way to attach dynamic text to floating button?

---

<div class="post-metadata">

**Author:** ![Uzo](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/uzo/32/22639_2.png) [@Uzo](https://community.glideapps.com/u/Uzo)\
**Post date:** [February 5, 2021, 6:04am UTC](https://community.glideapps.com/t/beautiful-design-app/16191/357 "2021-02-05T06:04:33Z")

</div>

how to find class name for cellphone? i did it for tablet view, but when im trying it on my cell, is not working

---

<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:** [February 5, 2021, 12:06pm UTC](https://community.glideapps.com/t/beautiful-design-app/16191/358 "2021-02-05T12:06:27Z")

</div>

`!important` overrides any styling that may already be originally set as `important`.

---

<div class="post-metadata">

**Author:** ![SantiagoPerez](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/santiagoperez/32/16807_2.png) [@SantiagoPerez](https://community.glideapps.com/u/SantiagoPerez)\
**Post date:** [February 5, 2021, 8:10pm UTC](https://community.glideapps.com/t/beautiful-design-app/16191/359 "2021-02-05T20:10:20Z")

</div>

Hey guys @Robert_Petitto @ThinhDinh @Lucas_Pires and every one else.

Is there a way to have a button like in the picture?

![image](https://us1.discourse-cdn.com/flex002/uploads/glideapps/original/3X/7/2/7201fa4e50726e1bdb46ce0056f752a7c4ef30a5.jpeg)

I am working on a conference app and the client would like something like that.

---

<div class="post-metadata">

**Author:** ![Lucas\_Pires](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/lucas_pires/32/64863_2.png) [@Lucas\_Pires](https://community.glideapps.com/u/Lucas_Pires)\
**Post date:** [February 5, 2021, 8:41pm UTC](https://community.glideapps.com/t/beautiful-design-app/16191/360 "2021-02-05T20:41:52Z")

</div>

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

```
<pre><span><style>
div[id*='screenScrollView'] > div > div:nth-of-type(#) {
-webkit-transform: rotate(-90deg);
    width: 42px;
    margin-left: auto;
    margin-top: 60%;
}

```

Replace the # in `div:nth-of-type(#)` as the number of the component in th screen. Eg:

`div:nth-of-type(3)`

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

---

<div class="post-metadata">

**Author:** ![SantiagoPerez](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/santiagoperez/32/16807_2.png) [@SantiagoPerez](https://community.glideapps.com/u/SantiagoPerez)\
**Post date:** [February 5, 2021, 8:48pm UTC](https://community.glideapps.com/t/beautiful-design-app/16191/361 "2021-02-05T20:48:22Z")

</div>

Thanks man!!!

---

<div class="post-metadata">

**Author:** ![gvalero](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/gvalero/32/1037_2.png) [@gvalero](https://community.glideapps.com/u/gvalero)\
**Post date:** [February 5, 2021, 9:58pm UTC](https://community.glideapps.com/t/beautiful-design-app/16191/362 "2021-02-05T21:58:51Z")

</div>

you are a crack @Lucas_Pires !!

---

<div class="post-metadata">

**Author:** ![Daniel\_Canup](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/daniel_canup/32/32850_2.png) [@Daniel\_Canup](https://community.glideapps.com/u/Daniel_Canup)\
**Post date:** [February 6, 2021, 5:55pm UTC](https://community.glideapps.com/t/beautiful-design-app/16191/363 "2021-02-06T17:55:36Z")

</div>

I have an app I have been developing for a client. I have all the functionality I need for it to perform the way I need it to, however, I do not have a clue as to how to design it the way the client wants. I have attempted it on multiple occasions. ☹ Could anyone help me with this design? Thank-you in advance for any assistance.

 ![Screen Shot 2020-10-08 at 5.29.40 PM](https://us1.discourse-cdn.com/flex002/uploads/glideapps/original/3X/d/a/da6cf42704ff8efb915f7e327e15739fb9eec450.jpeg)

---

<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:** [February 6, 2021, 10:43pm UTC](https://community.glideapps.com/t/beautiful-design-app/16191/364 "2021-02-06T22:43:26Z")

</div>

This is a lot even with CSS, any insights @Lucas_Pires ?

---

<div class="post-metadata">

**Author:** ![Daniel\_Canup](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/daniel_canup/32/32850_2.png) [@Daniel\_Canup](https://community.glideapps.com/u/Daniel_Canup)\
**Post date:** [February 7, 2021, 1:10am UTC](https://community.glideapps.com/t/beautiful-design-app/16191/365 "2021-02-07T01:10:58Z")

</div>

I am considering starting all over in Adalo. Because I don’t think I can do this here. ☹

---

<div class="post-metadata">

**Author:** ![Eric\_Penn](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/eric_penn/32/73888_2.png) [@Eric\_Penn](https://community.glideapps.com/u/Eric_Penn)\
**Post date:** [February 7, 2021, 3:04am UTC](https://community.glideapps.com/t/beautiful-design-app/16191/366 "2021-02-07T03:04:12Z")

</div>

For the part that says drop-down, how many choices are there?

For the part that says “no functionality just a visual” is it pulling data?

I think I could pull off the middle section with a spreadsheet formula. I wouldn’t know how to add the “x” though.

[Previous page](https://community.glideapps.com/t/beautiful-design-app/16191.md?page=17)

[Next page](https://community.glideapps.com/t/beautiful-design-app/16191.md?page=19)