Alpha Moodle Theme
  • Alpha 2.5.x
  • Requirements
  • Changelog
  • Theme Installation and Update
  • Support Page
  • Translations
  • RTL Interface
  • Paid Courses
  • Getting started
    • Demo content
    • Course Layout
  • Theme Settings
    • Global Styles
      • Typography
      • UI Elements
      • Headings/Text Modifications
    • General
      • Dark Mode
        • 🌑Show/hide on the Dark Mode
    • SEO
    • Customization
      • Google Fonts
      • Colors
    • Login page
    • ⭐Front Page Blocks
      • 🕶️Show/hide for non-logged in users
      • Block Order
      • Block #0 - Default Moodle Front Page Blocks
      • Hero
        • Block #1
        • Block #2 (Hero Video)
        • Block #3
      • FAQ
        • Block #4
      • Grid Content
        • Grid Content #1
        • Grid Content #2
        • Grid Content #3
        • Grid Content #4
        • Grid Content #5
        • Grid Content #6
        • Grid Content #7
        • Grid Content #8
        • Grid Content #9
      • Content
        • Content #1
        • Content #2
        • Content #3
        • Block #5 - Logotypes
      • Categories & Icons List
        • Categories List #1
        • Categories List #2
        • Logotypes List #1
        • Icons List
      • Stats
        • Stats #1
        • Stats #2
      • Team
        • Team #1
        • Team #2
        • Team #3
      • Testimonials
        • Testimonials #1
        • Testimonials #2
        • Testimonials #3
      • How to add more item to blocks?
    • Top Bar
    • Course Page/Card
      • Course List
    • Sidebar
    • Sidebar navigation
    • Custom alert
    • Advanced settings
    • Google/Custom Fonts and GDPR
  • More
    • Server recommendations
    • Graphics, Icons etc.
Powered by GitBook
On this page
  • Link underline
  • Lead
  • Display
  • Small
  • Modified

Was this helpful?

  1. Theme Settings
  2. Global Styles

Typography

Last updated 10 months ago

Was this helpful?

Link underline

If somewhere on the page animated underline doesn't work then you can use a dedicated class.

<a href="#" class="underline--anim">Link</a>

Lead

lead-1, lead-2, lead-3, lead-4

<p class="lead-1">Lead #1</p>
<div class="lead-2">Lorem ipsum dolar set</div>

Display

display-1, display-2, display-3, display-4

<p class="display-1">Display #1</p>

Small

small, text-small

<span class="small">Small text</span>
<span class="text-small">Small text</span>

Modified

modified

<span class="modified">August 20, 2020</span>