Scholastica Moodle Theme
  • Scholastica
  • Requirements
  • Getting started
    • Theme Installation/Update
    • Translations
    • Demo content
    • RTL Interface
    • Global Styles
      • Typography
      • UI Elements
      • Headings/Text
    • Paid Courses
    • Course Page
    • Custom Enrollment Page
    • Course Filter
    • Custom E-Mail Template
  • Theme Settings
    • 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
      • Video Pop-up
      • Hero
        • Block #1
        • Block #2 (Hero Video)
        • Block #3
      • FAQ
        • Block #4
        • Re-usage FAQ Snippet
      • 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
        • Course List
        • 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
    • Footer
    • Custom alert
    • Advanced settings
    • Google/Custom Fonts and GDPR
    • Default Moodle Footer Links
  • More
    • Server recommendations
    • Graphics, Icons etc.
Powered by GitBook
On this page
  • Dedicated custom logo for the dark mode
  • Only dark mode

Was this helpful?

  1. Theme Settings

Dark Mode

PreviousGeneralNextShow/hide on the Dark Mode

Last updated 1 year ago

Was this helpful?

The dark mode is optional. The color pallet is pre-defined so it is impossible to change it using theme settings. The only solution to change colors is to override CSS.

To change the dark mode UI you need to add .theme-dark class.

.theme-dark .sampleClass {}

Dedicated custom logo for the dark mode

There are dedicated fields for your logo in dark mode:

Sidebar -> Sidebar Logo (Dark mode) Login page -> Login Page -> Custom Logo on the Login Page (Dark Mode)

Only dark mode

If you want to use only a dark interface then change settings like the settings below:

Turn on -> General -> Only Dark Mode UI. If on, then the dark mode switcher will be automatically hidden.