{% extends "adminlte_full/base.html" %} {% import "adminlte_full/macros/widgets.html" as widgets %} {% macro palette_set(title, color, hex, light=false) %}

{{ title }}

{{ hex }}
Disabled
{% endmacro %} {% block page_title %}General UI{% endblock %} {% block breadcrumb %} {{ super() }} {{ bootstrap.breadcrumb(title='Twitter', icon='fab fa-twitter', url='https://twitter.com') }} {{ bootstrap.breadcrumb(title='Log in', url=adminlte.create_url(config.ADMINLTE_LOGIN_ENDPOINT)) }} {{ bootstrap.breadcrumb(title='🎼', url=adminlte.create_url(config.ADMINLTE_LOGIN_ENDPOINT)) }} {% call bootstrap.breadcrumb() %} {% endcall %} {% endblock breadcrumb %} {% block page_content %} {% call widgets.render_card('Color Palette', card_class='color-palette-box') %}
THEME_COLOR (Theme Colors)
{{ palette_set('PRIMARY', ThemeColor.PRIMARY, '#007bff') }}
{{ palette_set('SECONDARY', ThemeColor.SECONDARY, '#6c757d') }}
{{ palette_set('INFO', ThemeColor.INFO, '#17a2b8') }}
{{ palette_set('SUCCESS', ThemeColor.SUCCESS, '#28a745') }}
{{ palette_set('WARNING', ThemeColor.WARNING, '#ffc107') }}
{{ palette_set('DANGER', ThemeColor.DANGER, '#dc3545') }}
Black/White Nuances
{{ palette_set('BLACK', ThemeColor.BLACK, '#000000') }}
{{ palette_set('GRAY_DARK', ThemeColor.GRAY_DARK, '#343a40') }}
{{ palette_set('GRAY', ThemeColor.GRAY, '#adb5bd') }}
{{ palette_set('LIGHT', ThemeColor.LIGHT, '#1f2d3d', light=true) }}
Colors
{{ palette_set('INDIGO', ThemeColor.INDIGO, '#6610f2') }}
{{ palette_set('LIGHTBLUE', ThemeColor.LIGHTBLUE, '#3c8dbc') }}
{{ palette_set('NAVY', ThemeColor.NAVY, '#001f3f') }}
{{ palette_set('PURPLE', ThemeColor.PURPLE, '#605ca8') }}
{{ palette_set('FUCHSIA', ThemeColor.FUCHSIA, '#f012be') }}
{{ palette_set('PINK', ThemeColor.PINK, '#e83e8c') }}
{{ palette_set('MAROON', ThemeColor.MAROON, '#d81b60') }}
{{ palette_set('ORANGE', ThemeColor.ORANGE, '#ff851b') }}
{{ palette_set('LIME', ThemeColor.LIME, '#01ff70') }}
{{ palette_set('TEAL', ThemeColor.TEAL, '#39cccc') }}
{{ palette_set('OLIVE', ThemeColor.OLIVE, '#3d9970') }}
{% endcall %} {% endblock %} {% block styles_inline %} .color-palette { height: 35px; line-height: 35px; text-align: right; padding-right: .75rem; } .color-palette.disabled { text-align: center; padding-right: 0; display: block; } .color-palette-set { margin-bottom: 15px; } .color-palette span { display: none; font-size: 12px; } .color-palette:hover span { display: block; } .color-palette.disabled span { display: block; text-align: left; padding-left: .75rem; } .color-palette-box h4 { position: absolute; left: 1.25rem; margin-top: .75rem; color: rgba(255, 255, 255, 0.8); font-size: 12px; display: block; z-index: 7; } {% endblock styles_inline %}