Module Class Suffix is a parameter in Joomla! modules. Setting this parameter causes Joomla! to either add a new CSS class or modify the existing CSS class for the div element for this specific module.
To use a module variation, just enter one of the following suffixes in the Module Class Suffix field of the module parameters:
mod_dark
mod_green
mod_yellow
mod_red
mod_purple
mod_grey
Heads up! Make sure that you enter the suffix with a leading space otherwise the module styling will not be applied correctly.
Extra suffixes
no-padding
Use this suffix in a module to apply a padding of 0 pixels.
no-margin
Use this suffix in a module to apply a margin of 0 pixels.
formatModule
Use this suffix to apply the default module style to a module in a spotlight position.
padding15
Use this suffix to apply a padding of 15 pixels to a module in a sidebar position.
grey-bg
Use this suffix in a menu item or module to apply a grey color as background color.
ALERTS
Success! You successfully read this important alert message.
Info! This alert needs your attention, but it's not super important.
Warning! Best check yo self, you're not looking too good.
Nullam quis risus eget urna mollis ornare vel eu leo. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Nullam id dolor id nibh ultricies vehicula.
<p>...</p>
Lead Body Text
Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor. Duis mollis, est non commodo luctus.
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer posuere erat a ante.
<blockquote><p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer posuere erat a ante.</p></blockquote>
Blockquote options
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer posuere erat a ante.
Someone famous in Source Title
<blockquote><p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer posuere erat a ante.</p><small>Someone famous in <citetitle="Source Title">Source Title</cite></small></blockquote>
Alternate blockquote display
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer posuere erat a ante.
Someone famous in Source Title
<blockquoteclass="pull-right">
...
</blockquote>
LISTS
Unordered
Lorem ipsum dolor sit amet
Consectetur adipiscing elit
Nulla volutpat aliquam velit
Phasellus iaculis neque
Purus sodales ultricies
Vestibulum laoreet porttitor sem
Ac tristique libero volutpat at
Faucibus porta lacus fringilla vel
<ul><li>...</li></ul>
Ordered
Lorem ipsum dolor sit amet
Consectetur adipiscing elit
Integer molestie lorem at massa
Facilisis in pretium nisl aliquet
Nulla volutpat aliquam velit
Faucibus porta lacus fringilla vel
Aenean sit amet erat nunc
Eget porttitor lorem
<ol><li>...</li></ol>
Unstyled
Lorem ipsum dolor sit amet
Nulla volutpat aliquam velit
Phasellus iaculis neque
Purus sodales ultricies
Vestibulum laoreet porttitor sem
Ac tristique libero volutpat at
Faucibus porta lacus fringilla vel
<ulclass="list-unstyled"><li>...</li></ul>
Inline
Lorem ipsum
Phasellus iaculis
Nulla volutpat
<ulclass="list-inline"><li>...</li></ul>
Description
Description lists
A description list is perfect for defining terms.
Euismod
Vestibulum id ligula porta felis euismod semper eget lacinia odio sem nec elit.
Donec id elit non mi porta gravida at eget metus.
Malesuada porta
Etiam porta sem malesuada magna mollis euismod.
<dl><dt>...</dt><dd>...</dd></dl>
Horizontal description
Description lists
A description list is perfect for defining terms.
Euismod
Vestibulum id ligula porta felis euismod semper eget lacinia odio sem nec elit.
Malesuada porta
Etiam porta sem malesuada magna mollis euismod.
Felis euismod semper eget lacinia
Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus.
<!-- Standard button --><buttontype="button"class="btn btn-default">Default</button><!-- Provides extra visual weight and identifies the primary action in a set of buttons --><buttontype="button"class="btn btn-primary">Primary</button><!-- Indicates a successful or positive action --><buttontype="button"class="btn btn-success">Success</button><!-- Contextual button for informational alert messages --><buttontype="button"class="btn btn-info">Info</button><!-- Indicates caution should be taken with this action --><buttontype="button"class="btn btn-warning">Warning</button><!-- Indicates a dangerous or potentially negative action --><buttontype="button"class="btn btn-danger">Danger</button><!-- Deemphasize a button by making it look like a link while maintaining button behavior --><buttontype="button"class="btn btn-link">Link</button>
Signing in with your Single Sign On (SSO) account is a simple way to access most Metropolitan College Services. Your credentials must not be shared with any other party. By logging in, you are agreeing to MC Policies and Regulations.
Το Μητροπολιτικό Κολλέγιο εφαρμόζει το σύστημα καθολικής σύνδεσης (SSO) για εύκολη πρόσβαση σε όλες τις Ηλεκτρονικές Υπηρεσίες του. Τα στοιχεία του λογαριασμού σας είναι αυστηρά προσωπικά και πρέπει να φυλάσσονται με δική σας ευθύνη χωρίς να τα μοιράζεστε με τρίτους. Όταν εισέλθετε στον λογαριασμό σας για πρώτη φορά, δίνετε την συναίνεση σας και αποδέχεστε τις Πολιτικές και τους Κανονισμούς του Μητροπολιτικού Κολλεγίου.
Εάν δεν έχετε ακόμα ολοκληρώσει τη σύνδεση με το portal του Μητροπολιτικού Κολλεγίου, δείτε τις οδηγίες εδώ!