Style help on how to achieve 0 border top of mobile

[ryanp]

if you look at the screen shot on the Glide website they are using custom components to style, i’m looking for the same affect but no matter what i do i can’t get it to work, since im using the ai its rendering all in an iframe and i can’t seem to manage the classes or see how to make the page header transparent to achieve this look. any help would be awesome

!

[ThinhDinh]

It was something that they seemed to develop internally and not released yet.

Here’s my attempt with CSS.

#nav-root > div:first-of-type {
display: none;
}

div[data-testid="title-cover"] img {
height: 300px;
}

#app-root > div:first-of-type svg {
fill: white;
}

[ryanp]

@ThinhDinh

#nav-root > div:first-of-type {
display: none;
}

div[data-testid="title-cover"] img {
height: 300px;
}

#app-root > div:first-of-type svg {
fill: white;
}

really appreciate it! I was trying to keep the hamburger any trick to that?

[ryanp]

love the direction, but i cant lose the hamburger menu. could you help with that code?

[ThinhDinh]

#app-root > div:first-of-type {
  display: none;
}

#nav-root .section-container {
padding-top: 0;
}

button[data-testid="menu-left-button"] {
margin-top: 20px;
}

div[data-testid="title-cover"] img {
height: 300px;
}

#app-root > div:first-of-type svg {
fill: white;
}

[Mariusz]

That looks really good, nice work Thinh!

Since you’re talking CSS, @ryanp, how did you achieve the floating bottom menu look on your app?

[Darren_Murphy]

@Mariusz

how did you achieve the floating bottom menu look on your app?

CSS Library by LowCode Agency

[Mariusz]

Thanks, haven’t seen this one before!