In the Navigation Bar in Header. If I select “Willkommen” it is shaded in orange. But on the other three (“Massagen”, “Reservierung”, “Kontakt”) it is not working. It worked before but I am not sure what I did that its not working now?
The page called “Massagen” has a text. At the desktop and tablet view it is working fine. If you go to a mobile view its not in the same line… it is postponed. If I put in a return in the mobile view it is also changed in the desktop view and then in the desktop view postponed and wrong. How can I handle this?
It looks like the current class is styled with the orange link and the other links which are not using the Current class are using a different color. The Current class is automatically applied to links that are linked to the current page, or visible section shown in the viewport.
You may need to change the Current class link color in typography on the other pages to some other color than orange, and then back to orange before that shows in the designer. I am checking further on that behavior with the Current class styling in the designer view.
The fonts in desktop and tablet look the same, however the fonts in the tablet view and lower look bolder. This is usually due to the way the browser renders the font. This behavior can usually be turned off so the font looks the same on all views on the published site, by adding the following code to the head of the site in site settings:
body {
-webkit-font-smoothing: antialiased;
-moz-font-smoothing: antialiased;
-o-font-smoothing: antialiased;
}
I would suggest to change the layout of the text layout, currently you have all text within a text block using hard breaks. It might be better to use three div blocks per row with display inline block and float left with a width of 33.333%. I would try and use separate text blocks within each div.
I changed the color, but another color is still not working. If the page “Massage” is open and I click on the nav bar massage current is show up. If I select “Reservierung” or “Kontakt” it is not showing up. But if I select “Willkommen” there is also current shown up. So in “Willkommen” and “Massage” although the page Massage is open.
DONE - worked fine
I am using already a row with three columns. In each is a text block. I don’t understand what you mean what I should do instead?
Hi @zoomlike, thanks for your patience. For item #1, there seems to be some corruption in the symbol, where the page link need to be reset for the nav links.
Take a look at a quick video I made:
I am still investigating this strange behavior, but this workaround to reset the links in the symbol, should work. Only one instance of the symbol need to be updated.
On #2, I am making some instruction on an alternative div layout. I will get back to you on that.
hope you got a great weekend. I checked again the webflow official videos but I still didn’t find a solution for our open point 3). No stress but I hoped to solve it by myself :-))
The image (Banner) at the background is at “Massage” and “Termin” bigger then in “Kontakt” and “Impressum” because the typo in “Massage” and “Termin” has two lines. How can I set in “Kontakt”, “Impressum” the same size as in “Massage” and “Termin” for the Image in the background? (both in mobile view)
In “Willkommen” on the first side the first image with the roses/flowers (banner) is not fixed, it is set as scrolled because it looks better… however I would like to get the effect for the Logo (Image) as it is when I use the banner in fixed mode. Then the logo is moving (parallax effect). Is that possible?
Hey @cyberdave, sorry for asking again. Just to plan my release date, when do you think are you done? Most important for the release is the text issue - 3. Best, Alex
Hi @zoomlike, I would suggest to break out the text that you have in those text blocks, into individual rows, with three columns each. It will be much more manageable and predictable how it will render on mobile devices.
I made a quick video, I hope it helps:
Also sorry, are points #4 and #5 still giving an issue?
Hi @zoomlike, well, one thing I would try for #4 is to give the Header White class (the text) a fixed height of say 125px. This way that class will be same height on all pages regardless of text height.
On #5, at the moment it is not possible to use fixed elements on a slider, so to get parallax on a slider element probably would take some custom code. I would suggest to create interactions for your content and use the interaction slide trigger to animate content when the slide changes.
