{"id":43,"date":"2020-01-15T21:33:50","date_gmt":"2020-01-15T20:33:50","guid":{"rendered":"https:\/\/themedemos.webmandesign.eu\/michelle\/?page_id=43"},"modified":"2020-01-15T21:33:50","modified_gmt":"2020-01-15T20:33:50","slug":"css-classes","status":"publish","type":"page","link":"https:\/\/www.56kproductions.it\/en\/css-classes\/","title":{"rendered":"Helper CSS Classes"},"content":{"rendered":"

Text & typography classes<\/h2>\n\n\n\n
<\/div>\n\n\n\n
\n
\n

h1<\/code>, h2<\/code>, h3<\/code>, h4<\/code><\/h3>\n<\/div>\n\n\n\n
\n

Styles the text the way H1, H2, H3 and H4 headings are styled. <\/p>\n<\/div>\n<\/div>\n\n\n\n

\n
\n

has-left\/center\/right-text-align<\/code><\/h3>\n<\/div>\n\n\n\n
\n

Apply on any element. Forces text alignment. <\/p>\n<\/div>\n<\/div>\n\n\n\n

\n
\n

has-uppercase-text-transform<\/code><\/h3>\n<\/div>\n\n\n\n
\n

Transforms elements text to uppercase letters.<\/p>\n<\/div>\n<\/div>\n\n\n\n

\n
\n

has-SIZE-font-size<\/code><\/h3>\n<\/div>\n\n\n\n
\n

Sets element’s font size.
Possible SIZE<\/strong> values: extra-small<\/code>, small<\/code>, smaller<\/code>, regular<\/code>, large<\/code>, extra-large<\/code><\/p>\n<\/div>\n<\/div>\n\n\n\n

\n
\n

has-100\/200...\/900-font-weight<\/code><\/h3>\n<\/div>\n\n\n\n
\n

Applies specific font weight on an element.<\/p>\n<\/div>\n<\/div>\n\n\n\n

\n
\n

has-italic\/normal-font-style<\/code><\/h3>\n<\/div>\n\n\n\n
\n

Applies specific font style on an element.<\/p>\n<\/div>\n<\/div>\n\n\n\n

\n
\n

has-SIZE-line-height<\/code><\/h3>\n<\/div>\n\n\n\n
\n

Sets element’s line height.
Possible SIZE<\/strong> values: extra-small<\/code>, small<\/code>, regular<\/code><\/p>\n<\/div>\n<\/div>\n\n\n\n

<\/div>\n\n\n\n

Layout classes<\/h2>\n\n\n\n
<\/div>\n\n\n\n
\n
\n

has-half\/phi\/full-screen-min-height<\/code><\/h3>\n<\/div>\n\n\n\n
\n

Sets the minimum height of the element as a portion of browser window height (50%, 61.8%, 100%). Best applied on full width Cover block, for example. <\/p>\n<\/div>\n<\/div>\n\n\n\n

\n
\n

has-wide-content-width<\/code><\/h3>\n<\/div>\n\n\n\n
\n

Apply on Cover or Group block to make the block content wider. <\/p>\n<\/div>\n<\/div>\n\n\n\n

\n
\n

has-phi\/no-padding<\/code><\/h3>\n<\/div>\n\n\n\n
\n

Sets element’s padding (1.618em, 0). Can be applied on Column block to force a specific column padding.<\/p>\n<\/div>\n<\/div>\n\n\n\n

\n
\n

has-SIZE-padding<\/code><\/h3>\n<\/div>\n\n\n\n
\n

Sets element’s padding size.
Possible SIZE<\/strong> values: extra-small<\/code>, small<\/code>, regular<\/code>, large<\/code>, extra-large<\/code> <\/p>\n<\/div>\n<\/div>\n\n\n\n

\n
\n

has-no-padding<\/code>, has-no-<\/code> padding<\/code> -left\/right\/top\/bottom\/vertical\/horizontal<\/code><\/h3>\n<\/div>\n\n\n\n
\n

Removes any padding<\/code>from an element.<\/p>\n<\/div>\n<\/div>\n\n\n\n

\n
\n

has-regular-margin-bottom<\/code><\/h3>\n<\/div>\n\n\n\n
\n

Applies theme’s default bottom margin on the element.<\/p>\n<\/div>\n<\/div>\n\n\n\n

\n
\n

has-no-margin<\/code>, has-no-margin-left\/right\/top\/bottom\/vertical\/horizontal<\/code><\/h3>\n<\/div>\n\n\n\n
\n

Removes any margin from an element.<\/p>\n<\/div>\n<\/div>\n\n\n\n

<\/div>\n\n\n\n

Widget classes<\/h2>\n\n\n\n
<\/div>\n\n\n\n
\n
\n

has-2\/3\/4\/5\/6-flex-grow<\/code><\/h3>\n<\/div>\n\n\n\n
\n

As the theme uses CSS flexbox layout<\/a> in its horizontal widgetized areas you can control the width of widgets displayed there with these classes.
For setting up a widget CSS class we recommend using Widget CSS Classes<\/strong> plugin<\/a> (the theme integrates the classes to the plugin’s interface automatically for your convenience and ease of use). <\/p>\n<\/div>\n<\/div>\n\n\n\n

<\/div>\n\n\n\n

Decorative classes<\/h2>\n\n\n\n
<\/div>\n\n\n\n
\n
\n

has-decoration<\/code><\/h3>\n<\/div>\n\n\n\n
\n

Apply on image block to display a dotted overlay decoration the theme provides. <\/p>\n<\/div>\n<\/div>","protected":false},"excerpt":{"rendered":"

Apply a custom helper CSS class listed below in block editor<\/a>, in page builder, or directly in HTML code.
\n
\nText & typography<\/a> | Layout<\/a> | Widgets<\/a> | Decorations<\/a><\/p>","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"postBodyMargin":[],"postBodyPadding":[],"postBodyBackground":{"backgroundType":"classic","gradient":""},"footnotes":""},"class_list":["post-43","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/www.56kproductions.it\/en\/wp-json\/wp\/v2\/pages\/43","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.56kproductions.it\/en\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/www.56kproductions.it\/en\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/www.56kproductions.it\/en\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/www.56kproductions.it\/en\/wp-json\/wp\/v2\/comments?post=43"}],"version-history":[{"count":0,"href":"https:\/\/www.56kproductions.it\/en\/wp-json\/wp\/v2\/pages\/43\/revisions"}],"wp:attachment":[{"href":"https:\/\/www.56kproductions.it\/en\/wp-json\/wp\/v2\/media?parent=43"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}