Home › Updates

Updates

Additional predefined styles for content blocks, and new button styles

 June 13, 2017
by Flavio Mester

Additional predefined styles for content blocks

AnimSlideLeft
Slides the content in from the left. Note: ignored if the whole page is set to animate, an option available in YWD Designer.

AnimSlideRight
Slides the content in from the right. Note: ignored if the whole page is set to animate, an option available in YWD Designer.

AnimFlip
Flips the content in. Note: ignored if the whole page is set to animate, an option available in YWD Designer.

MaxText500 – MaxText900
These options allow you to limit the width/length of the lines text within the content block. They can be useful if for instance on a page without a right sidebar and you would like to prevent the text from extending the full width, which might affect readability. It has no effect on mobile, where the lines are inherently narrower due to the much smaller viewpport.

Raised effect for buttons

To apply a raised effect to a button – similar to the Google Material Design style – use the raised class:

button green will produce button whereas button green raised will produce button

Note: you can also apply a raised or hollow effect globally to all buttons – including submit buttons – by selecting the effect in the Design settings, Forms Manager App.

 

Circular buttons

It’s also possible to create small circular buttons. Use the circle class for that, and keep the labels to 1 or to letters or numbers:

button cyan circle will produce Y and of course button cyan circle raised will produce Y

 

For more information on how to insert your custom CSS code into a website built in YWD please refer to this section of our Help website.


Flavio Mester

Flavio Mester is a graphic designer as well as a systems analyst (in a distant life he was an architect). A founding partner of Your Web Department, he's responsible for the design and development of all the YWD website management platform interfaces.
Google+ | Twitter | LinkedIn

 


  

 

 
Top of page