CSS Styling - gtbu/Typesetter5.2 GitHub Wiki

The Typesetter CMS includes CSS3 themes and various Bootstrap themes. Of course, other CSS frameworks also work. A Bootstrap-offline-documentation is Github.

Css styling happens within the styles.css (.scss, .less) in the template folder (/themes/template-name or /data/_themes/template-name) or in the layout - editor in the right top corner of the single site(custom.css, which is added automatic).

You can follow the loading of the CSS-files and the generated code in the debugger of the browser (right mousekey : klick at element on the page -> inspect) . If You want to see the areas, you can temporarly add

 
 * {
    outline: 1px solid red;
} 

to the top of the stylesheet

• As Typesetter has inbuilt compilers for LESS and SCSS, the stylesheet-format can be css ,less or scss, which are automatic chosen.

• If You want to style a leave (' li ') in the pagemanger, You have the possibility to add classes to each individual ' li - Element ' : The menu - point : Menu Output - classes allows to add custom - classes to each li. You can so for example add icons like li.custom1::before {...}.

• More mixins (untested with Typesetter)

• Responsive standard Css-grid

• a flexbox - solution and a small css- library with a grid inside