Changelog

What each version of the design system and of the Didactika theme contains.

The design system and the theme have their own versions, chosen in the bar at the top. A version of the theme never changes the design system.

Design system v0.1

• Buttons with Moodle’s shape but flatter (8 px radius, 36 px tall), round icon-only buttons, tonal buttons and counters on the corner of an icon.
• Fields, selects with their own list, checks, switches, range, input group, floating labels and validation.
• Alerts, badges, progress with joined segments, toasts, tooltips, popovers and dialogs with their variants.
• Tabs, breadcrumb, pagination, dropdowns, navbar with the design of each Moodle version and the search component.
• Cards, list groups, tables for real work (toolbar, selection, row actions, sortable headers, pager), accordion, carousel, offcanvas.
• Didactika components: empty states, steps, filter chips, page header, avatars, tags, segmented control, description list, timeline and drop zone; a tip of its own for every title.
• The inspector: measures, code, only the edits an element admits (with sliders and undo), custom CSS for the classes, folding groups and keyboard navigation.
• JSON API with the components, tokens, icons and brand.

Didactika theme v0.1

• Inter as the typeface, pill buttons, larger radius on surfaces and dialogs.
• A gradient from the primary colour, tinted elevation and a halo on focus.
• Motion: ripple on a click and a small lift on hover.
• The palette on the Bootstrap roles, with slate as the secondary colour.

Site

• Moodle (5.3, 4.5 and 4.1), light and dark, Spanish and English.
• Search with Ctrl K, a side navigation that remembers its state, code cards with a copy button.