CSS for hiding stuff!

Hola @Proyecto_Kolectivo

Exactamente que es lo que quieres lograr? Y que es lo que tienes? Si muestras quizás algún screenshot, ayudarías a conseguir una solución más rápida.

Cordial saludo,

Es posible lograr esto en Glide:

http://elcssar.com/html/enlace-href-whatsapp?fbclid=IwAR0nLwweZQRAhRfcop5rHUadfbQWPY8isH6lTo3utRQX0A0uWB86wNHlP-k

Ocultar un componente en función del tamaño de la pantalla?

Gracias

@Proyecto_Kolectivo

Si entiendo lo que quieres es posible que debas usar un Experimental Column para ver la Agent information y luego usar el ITE para lo que quieres.

Echale un vistazo a este hilo: Agent for information

Lo logre, muchas gracias Santiago.

1 Like

I’m wondering whether I could use CSS to hide the “Made with Glide” in Glide Pages

CSS isn’t allowed on Glide Pages. That might be one of the reasons why…because they want to make it an optional add-on to have it removed in the future.

1 Like

Did I miss how to hide the actual back “arrow” (versus the “Back” text)? Can someone share?

This should cover both the arrow and the text.

[data-test="back-button"] {
display: none;
}

Or do you just want to hide the arrow?

I’m using CSS to create a background color at the top and then I want both the “back” and the arrow" to be white. This is the CSS that I have as rich text and its only making the “back” word white. The arrow is the same color as the background so its not visible and I can’t seem to find the right CSS to change it.



[data-test="back-button"]{ color: #FFFFFF; }

#app-root [opacity='1'] { color: transparent; }

[data-test="glide-app-bar"] :nth-child(1) { background: #E174A1; color: #000000}

Try this

[data-test="back-button"] svg {
fill: #008080 !important;
}

Here’s the full link for how I approached this.

4 Likes

Thank you so much. That did the trick!!!

1 Like

Hi @ThinhDinh

I was looking at your CSS trick for creating a custom see-all which works but I need to hide the default see all and also have the custom see all, actually see all :slight_smile:

<div class="see-all-custom">→ See all</div>

<pre><span><style>
.see-all-custom {
font-weight: 600;
font-size: 0.875rem;
line-height: 1.0625rem;
color: #F19E39;
position: relative;
float: right;
}
2 Likes

I believe you would just need to to set your lnline List to only show a few items with the See All turned off. Then put the above code in a rich text component with an action to Show New Screen → This Item and put an Inline List on that new screen without any filters.

1 Like

@Jeff_Hager Excellent stuff. That totally works. Thanks so much

2 Likes

Using the trick to hide the hamburger menu moves the tab label all the way to the left instead of keeping it centered:

Any suggestions to re-center the label will be met with a :heart: on your post. Thanks!!

Sorry for the late reply. I saw your comment on Notion as well.

Thanks @Jeff_Hager for the answer. Let me copy your comment over to Notion so in the future people who have the same issue can figure it out.

2 Likes

Do you have any other CSS snippets on that tab? I can’t reproduce here.

1 Like

I think that behaviour might be specific to Android devices?

1 Like

Hey Thinh,

I do -
image

Do you think that’s the problem? The issue occurs across three separate but related tabs (NOTE: related, like, similar - not related by RELATION) where I need to hide the same stuff. Or, is my CSS missing something? Do I need to close the SPAN?

I think @Darren_Murphy was right about it being an Android problem.

Here’s my fix.

<pre><span><style>

[data-test="nav-button-menu"] {
display: none
}

[data-test="nav-bar"] > h1 {
text-align: center !important;
}
4 Likes