Combine codes

Ask for Help
1

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

<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;
}

<pre><span><style>

[id="tabBar"]{

display: none;

}

<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

2

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

<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;
}
1 Like