Time for unsolicited praise! Since most support forums are full of negative comments, I thought I’d take a minute to post a compliment.
Blocs has matured into a really great software! I have tried and used a lot of Apps in the past, Dreamweaver, Muse, Bootstrap Studio, Pinegrow … and I have to say: I keep returning to Blocs!
I am a graphic designer first, and web designer second, and for the last 3 years or so I’ve been mainly building sites in Muse because of the freedom it gives you to move things around.
I have to say, Blocs is a more than worthy alternative! I judge the value of a software by its learning curve. and with Blocs I’ve had little trouble getting up to speed with it. ( Example work in progress: https://vmedia.de/claire-2019/index.html - this is the result of about 3 hours of work )
Its interface is intuitive and I’ve had no trouble writing my own classes in comparison to the other Bootstrap editors. I’ve even built 2 custom Blocs already
So here’s a big “atta boy”! Keep up the good work Blocs rockers!
Gary
@gary nice work! Yes, the forum is a lot different than most. We like to help users as much as possible. I really think credit first goes out to @Norm for his positive outlook dealing with the development process of Blocs. Blocs 3 Rocks!
I like the underline hover on the menu. Can you share your structure tree for this? I cannot have a hover border thickness greater than 3px, otherwise the whole nav jumps. The thicker the border, the more it jumps on hover
Thats exactly what i think. Blocs rocketstarts my workflow. you can go advanced if you want to. in many cases now i need more time for the styleguide, logodesign and photography than coding the website.
Keep on that good work - Blocs is really impresive - and 4 me one of the best tools of its kind.
Yea i struggled with that for awhile too. The way to do this doesn’t really have anything to do with the “structure tree”, but with your CSS border values.
The trick here:
After adding your menu set the menu type (Data Source) to none. For some reason, I can’t add custom CSS when I set my menu data source to “PRIMARY” (?)
Now make a custom class, which you want to attach to the innermost level on your tree (list item > link).
Set only the bottom border to a thickness and color you like.
Now here’s the trick: set the opacity (alpha) in the bottom border to 0% for all states other than the hover state. DO NOT change the thickness or the type of border (solid, etc.) - just set the opacity to 0%.
The reason you version is “jumping” is that you probably set the border width to 0px, or the border type to “none” for the states where you didn’t want a border. This means the html is rendered with no border, but your hover state is rendered with a border, so it it has to compensate for the space needed for the border and pushes the text up accordingly.
But if the border is rendered with it’s opacity set to 0%, the browser allocates the necessary space and renders it - at 0% opacity …
the CSS looks like this:
.navi-hover {
border-style: solid;
border-color: rgba(254,255,254,0.0)!important;
border-width: 0px 0px 3px 0px;
}
I forgot to mention that all sides of the border should have the same thickness and type (solid, etc.). Then you hide the ones you don’t want by setting the opacity to 0%.
