# Combine codes

**URL:** <https://community.glideapps.com/t/combine-codes/60756>\
**Category:** Ask for Help\
**Created:** [April 20, 2023, 10:30am UTC](https://community.glideapps.com/t/combine-codes/60756 "2023-04-20T10:30:14Z")\
**Posts on this page:** 2\
**Page:** 1

<div class="post-metadata">

**Author:** ![Sales\_Manager](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/sales_manager/32/16172_2.png) [@Sales\_Manager](https://community.glideapps.com/u/Sales_Manager)\
**Post date:** [April 20, 2023, 10:30am UTC](https://community.glideapps.com/t/combine-codes/60756/1 "2023-04-20T10:30:14Z")

</div>

How can I combine these 3 codes into one component.  
any help.  
Thanks

```auto
<pre><span><style>

[data-test="app-comments-preview"] {
  display:flex;
  flex-direction: column-reverse;
}

[data-test="app-comments-preview"] >:last-child {
 padding: 0px 16px 16px 16px;
}

[data-test="app-comments-preview"] >:first-child{
display: none;
}

```

```auto
<pre><span><style>

[id="tabBar"]{

display: none;

}

```

```auto
<pre><span><style>
.bottom-left-overlay .floating-overlay-text {
margin-top: 10px;
overflow: visible !important;
white-space: pre-wrap !important;
}

.bottom-right-overlay [data-test="app-avatar-text"] {
position: absolute;
right: 10px !important;
top: 15px;
}

```

![1](https://us1.discourse-cdn.com/flex002/uploads/glideapps/original/3X/6/2/628566c73a62981f210f92d77de61491f77be026.png)

---

<div class="post-metadata">

**Author:** ![Darren\_Murphy](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/darren_murphy/32/47326_2.png) [@Darren\_Murphy](https://community.glideapps.com/u/Darren_Murphy)\
**Post date:** [April 20, 2023, 10:44am UTC](https://community.glideapps.com/t/combine-codes/60756/2 "2023-04-20T10:44:41Z")

</div>

You just need the `<pre><span><style>` tags once at the top, like so:

```auto
<pre><span><style>

[data-test="app-comments-preview"] {
  display:flex;
  flex-direction: column-reverse;
}

[data-test="app-comments-preview"] >:last-child {
 padding: 0px 16px 16px 16px;
}

[data-test="app-comments-preview"] >:first-child{
display: none;
}

[id="tabBar"]{

display: none;

}

.bottom-left-overlay .floating-overlay-text {
margin-top: 10px;
overflow: visible !important;
white-space: pre-wrap !important;
}

.bottom-right-overlay [data-test="app-avatar-text"] {
position: absolute;
right: 10px !important;
top: 15px;
}

```
