Commit ed95c744 authored by Eduardo Silva's avatar Eduardo Silva
Browse files

implementacao dos principais componentes do dsgov em django

parent c5a6b8c0
......@@ -55,7 +55,7 @@ ROOT_URLCONF = 'django_dsgov_test1.urls'
TEMPLATES = [
{
'BACKEND': 'django.template.backends.django.DjangoTemplates',
'DIRS': [],
'DIRS': ['templates/'],
'APP_DIRS': True,
'OPTIONS': {
'context_processors': [
......@@ -104,9 +104,9 @@ AUTH_PASSWORD_VALIDATORS = [
# Internationalization
# https://docs.djangoproject.com/en/5.1/topics/i18n/
LANGUAGE_CODE = 'en-us'
LANGUAGE_CODE = 'pt-br'
TIME_ZONE = 'UTC'
TIME_ZONE = 'America/Recife'
USE_I18N = True
......@@ -118,6 +118,12 @@ USE_TZ = True
STATIC_URL = 'static/'
STATICFILES_DIRS = [
BASE_DIR / '',
]
STATIC_ROOT = BASE_DIR / 'staticfiles'
# Default primary key field type
# https://docs.djangoproject.com/en/5.1/ref/settings/#default-auto-field
......
......@@ -16,7 +16,65 @@ Including another URLconf
"""
from django.contrib import admin
from django.urls import path
from django.views.generic import TemplateView
urlpatterns = [
path('admin/', admin.site.urls),
path("", TemplateView.as_view(template_name = 'index.html')),
path("buttons/", TemplateView.as_view(template_name = 'examples_buttons.html'), name="buttons"),
path("inputs/", TemplateView.as_view(template_name = 'examples_inputs.html'), name="inputs"),
path("headers/", TemplateView.as_view(template_name = 'examples_headers.html', extra_context = {"lista":[
{'label': 'Link de acesso 1'},
{'label': 'Link de acesso 2'},
{'label': 'Link de acesso 3'},
{'label': 'Link de acesso 4'}
]}), name="headers"),
path("footer/", TemplateView.as_view(template_name = 'examples_footer.html', extra_context={"list": [
{'title': 'Categoria 1', 'items': [
{'content': 'Est ex deserunt'},
{'content': 'Qui esse'},
{'content': 'Nulla occaecat eiusmod'}
]},
{'title': 'Categoria 2', 'items': [
{'content': 'Deserunt'},
{'content': 'Ad deserunt nostrud'},
{'content': 'Ex qui laborum consectetur aute commodo'},
{'content': 'Ad deserunt nostrud'}
]},
{'title': 'Categoria 3', 'items': [
{'content': 'Duis incididunt consectetur'},
{'content': 'Qui esse'},
{'content': 'Ex qui laborum consectetur aute commodo'},
{'content': 'Duis incididunt consectetur'}
]},
{'title': 'Categoria 4', 'items': [
{'content': 'Est ex deserunt'},
{'content': 'Qui esse'},
{'content': 'Nulla occaecat eiusmod'}
]},
{'title': 'Categoria 5', 'items': [
{'content': 'Deserunt'},
{'content': 'Nulla occaecat eiusmod'},
{'content': 'Ad deserunt nostrud'},
{'content': 'Qui esse'},
]},
{'title': 'Categoria 6', 'items': [
{'content': 'Ad deserunt nostrud'},
{'content': 'Ex qui laborum consectetur aute commodo'},
]},
]}), name="footer"),
path("carousel/", TemplateView.as_view(template_name = 'examples_carousel.html', extra_context = {"imagens":[
{'legenda': 'Bem vindo a UFRPE', 'image': 'https://s2.glbimg.com/KU72T67vVh5Pdgv5Ls2TT4dv09k=/0x0:1920x1080/984x0/smart/filters:strip_icc()/i.s3.glbimg.com/v1/AUTH_59edd422c0c84a879bd37670ae4f538a/internal_photos/bs/2019/S/d/t7a9OdQ1AUyswqkYCJSg/urfpe-recife.jpg'},
{'legenda': 'Testando Imagem', 'image': 'https://s2-g1.glbimg.com/8AWiNTCt0_3fRLaCj7nFeisLb2U=/0x0:1280x960/984x0/smart/filters:strip_icc()/i.s3.glbimg.com/v1/AUTH_59edd422c0c84a879bd37670ae4f538a/internal_photos/bs/2022/D/6/cBnRd8QmuP1kXgcpdu9A/codai-sao-lourenco.jpeg'},
{'legenda': 'Imagem terceira', 'image': 'https://tallos-chat.s3.tallos.com.br/medias/faq/61367692a91f24b1f9c3c5bc-image-22-09-2021-15-50-35-como-acessar-o-ava-ufrpe-613fb3b83d09ec001c55b3fc-71.webp'},
{'legenda': 'Imagem quarta', 'image': 'https://tallos-chat.s3.tallos.com.br/medias/faq/61367692a91f24b1f9c3c5bc-image-13-06-2022-10-53-16-como-realizar-primeiro-acesso-auto-cadastro-no-sigaa-aluno-613fb3b83d09ec001c55b3fc-35-7c4.webp'},
{'legenda': 'Imagem quinta', 'image': 'https://www.pebsp.com/wp-content/uploads/2024/07/Graduacao-EAD-UFRPE-Universidade-Federal.jpg'},
]}), name="carousel"),
path("menu/", TemplateView.as_view(template_name = 'examples_menu.html'), name="menu"),
path("list/", TemplateView.as_view(template_name = 'examples_list.html', extra_context = {"lista":[
{'icon': 'fas fa-heartbeat', 'content': 'Texto principal 1', 'meta': 'Meta 1'},
{'icon': 'fas fa-star', 'content': 'Texto principal 2', 'meta': 'Meta 2'}
]}), name="list"),
path("breadcrumb/", TemplateView.as_view(template_name = 'examples_breadcrumb.html'), name="breadcrumb"),
path("tag/", TemplateView.as_view(template_name = 'examples_tag.html'), name="tag"),
]
{% extends "dsgov/base.html" %}
{% load br_components %}
{% load static %}
{% block content %}
<nav class="br-breadcrumb" aria-label="Breadcrumbs">
<ol class="crumb-list" role="list">
<li class="crumb home">
<a class="br-button circle" href="javascript:void(0)">
<span class="sr-only">Página inicial</span>
<i class="fas fa-home"></i>
</a>
</li>
<li class="crumb"><i class="icon fas fa-chevron-right"></i>
<a href="javascript:void(0)">Página Ancestral 01</a>
</li>
<li class="crumb"><i class="icon fas fa-chevron-right"></i>
<a href="javascript:void(0)">Página Ancestral 02</a>
</li>
<li class="crumb"><i class="icon fas fa-chevron-right"></i>
<a href="javascript:void(0)">Página Ancestral 03</a>
</li>
<li class="crumb" data-active="active"><i class="icon fas fa-chevron-right"></i>
<span tabindex="0" aria-current="page">Página atual</span>
</li>
</ol>
</nav>
{% endblock %}
\ No newline at end of file
{% extends "dsgov/base.html" %}
{% load br_components %}
{% load static %}
{% block content %}
<div class="row">
<div class="col-sm-12 col-md-8">
<div class="br-carousel" data-circular="true" aria-label="Carrossel de Exemplo" aria-roledescription="carousel">
<div class="carousel-button">
<button class="br-button carousel-btn-prev terciary circle" type="button" aria-label="Anterior"><i class="fas fa-chevron-left" aria-hidden="true"></i>
</button>
</div>
<div class="carousel-stage">
{% for imagem in imagens %}
<div class="carousel-page" active="active" role="group" aria-roledescription="slide" aria-live="polite">
<div class="carousel-content">
<img class="ml-4" src="{{ imagem.image }}" alt="Imagem"/>
<div class="h3 carousel-title">{{ imagem.legenda }}</div>
</div>
</div>
{% endfor %}
</div>
<div class="carousel-button">
<button class="br-button carousel-btn-next terciary circle" type="button" aria-label="Próximo"><i class="fas fa-chevron-right" aria-hidden="true"></i>
</button>
</div>
<div class="carousel-step">
<nav class="br-step" data-initial="1" data-type="simple" role="none">
<div class="step-progress" role="listbox" aria-orientation="horizontal" aria-label="Lista de Opções">
<button class="step-progress-btn" role="option" aria-posinset="1" aria-setsize="5" type="button"><span class="step-info">Exemplo de Rótulo 1</span></button>
<button class="step-progress-btn" role="option" aria-posinset="2" aria-setsize="5" type="button"><span class="step-info">Exemplo de Rótulo 2</span></button>
<button class="step-progress-btn" role="option" aria-posinset="3" aria-setsize="5" type="button"><span class="step-info">Exemplo de Rótulo 3</span></button>
<button class="step-progress-btn" role="option" aria-posinset="4" aria-setsize="5" type="button"><span class="step-info">Exemplo de Rótulo 4</span></button>
<button class="step-progress-btn" role="option" aria-posinset="5" aria-setsize="5" type="button"><span class="step-info">Exemplo de Rótulo 5</span></button>
</div>
</nav>
</div>
</div>
</div>
</div>
{% endblock %}
{% extends "dsgov/base.html" %}
{% load br_components %}
{% load static %}
{% block content %}
<footer class="br-footer">
<div class="container-lg">
<div class="logo">
<img src="{{ logo_url }}" alt="Imagem"/>
</div>
<div class="br-list horizontal" data-toggle="data-toggle" data-sub="data-sub">
{% for list_html in rendered_lists %}
{{ list_html|safe }}
{% endfor %}
</div>
<div class="d-none d-sm-block">
<div class="row align-items-end justify-content-between py-5">
<div class="col">
<div class="social-network">
<div class="social-network-title">Redes Sociais</div>
<div class="d-flex">
<a class="br-button circle" href="javascript:void(0)" aria-label="Compartilhar por Facebook">
<i class="fab fa-facebook-f" aria-hidden="true"></i>
</a>
<a class="br-button circle" href="javascript:void(0)" aria-label="Compartilhar por Twitter">
<i class="fab fa-twitter" aria-hidden="true"></i>
</a>
<a class="br-button circle" href="javascript:void(0)" aria-label="Compartilhar por Linkedin">
<i class="fab fa-linkedin-in" aria-hidden="true"></i>
</a>
<a class="br-button circle" href="javascript:void(0)" aria-label="Compartilhar por Whatsapp">
<i class="fab fa-whatsapp" aria-hidden="true"></i>
</a>
</div>
</div>
</div>
<div class="col assigns text-right">
<img class="ml-4" src="{{ acesso_a_info_image }}" alt="Imagem"/>
<img class="ml-4" src="{{ emec_image }}" alt="Imagem"/>
</div>
</div>
</div>
</div>
<span class="br-divider my-3"></span>
<div class="container-lg">
<div class="info">
<div class="text-down-01 text-medium pb-3"><strong>{{ copyright }}</strong></div>
</div>
</div>
</footer>
{% endblock %}
{% extends "dsgov/base.html" %}
{% load br_components %}
{% load static %}
{% block content %}
<header class="br-header {{ extra_classes }}">
<div class="container-lg">
<div class="header-top">
<div class="header-logo">
<img src="{{ logo_url }}" alt="logo"/>
<span class="br-divider vertical"></span>
<div class="header-sign" style="{{ header_sign_style }}">{{ title_extra }}</div>
</div>
<div class="header-actions">
<div class="header-links dropdown">
<button class="br-button circle small" type="button" data-toggle="dropdown" aria-label="Abrir Acesso Rápido"><i class="fas fa-ellipsis-v" aria-hidden="true"></i>
</button>
<div class="br-list">
<div class="header">
<div class="title">Acesso Rápido</div>
</div>
{% for link in links %}
<a class="br-item {{ extra_classes }}" href="javascript:void(0)" style="{{ links_style }}">{{ link.label }}</a>
{% endfor %}
</div>
</div>
<span class="br-divider vertical mx-half mx-sm-1"></span>
<div class="header-functions dropdown">
<button class="br-button circle small" type="button" data-toggle="dropdown" aria-label="Abrir Funcionalidades do Sistema"><i class="fas fa-th" aria-hidden="true"></i>
</button>
<div class="br-list">
<div class="header">
<div class="title">Funcionalidades do Sistema</div>
</div>
<div class="br-item {{ extra_classes }}">
<button class="br-button circle small" type="button" aria-label="Funcionalidade 1"><i class="fas fa-chart-bar" aria-hidden="true" style="{{ items_style }}"></i><span class="text">Funcionalidade 1</span>
</button>
</div>
<div class="br-item {{ extra_classes }}">
<button class="br-button circle small" type="button" aria-label="Funcionalidade 2"><i class="fas fa-headset" aria-hidden="true" style="{{ items_style }}"></i><span class="text">Funcionalidade 2</span>
</button>
</div>
<div class="br-item {{ extra_classes }}">
<button class="br-button circle small" type="button" aria-label="Funcionalidade 3"><i class="fas fa-comment" aria-hidden="true" style="{{ items_style }}"></i><span class="text">Funcionalidade 3</span>
</button>
</div>
<div class="br-item {{ extra_classes }}">
<button class="br-button circle small" type="button" aria-label="Funcionalidade 4"><i class="fas fa-adjust" aria-hidden="true" style="{{ items_style }}"></i><span class="text">Funcionalidade 4</span>
</button>
</div>
</div>
</div>
<div class="header-search-trigger">
<button class="br-button circle" type="button" aria-label="Abrir Busca" data-toggle="search" data-target=".header-search"><i class="fas fa-search" aria-hidden="true"></i>
</button>
</div>
{% if show_login %}
<div class="header-login">
<div class="header-sign-in">
<button class="br-sign-in small" type="button" data-trigger="login">
<i class="fas fa-user" aria-hidden="true"></i>
<span class="d-sm-inline">{{ label_button_login }}</span>
</button>
</div>
<div class="header-avatar"></div>
</div>
{% endif %}
</div>
</div>
<div class="header-bottom">
<div class="header-menu">
<div class="header-menu-trigger">
<button class="br-button small circle" type="button" aria-label="Menu" data-toggle="menu" data-target="#main-navigation" id="navigation"><i class="fas fa-bars" aria-hidden="true" style="color: #FFFFFF;"></i>
</button>
</div>
<div class="header-info">
<div class="header-title" style="{{ title_style }}">{{ title }}</div>
<div class="header-subtitle" style="{{ title_style }}">{{ subtitle }}</div>
</div>
</div>
<div class="header-search">
<div class="br-input has-icon">
<label for="searchbox-7548">Texto da pesquisa</label>
<input id="searchbox-7548" type="text" placeholder="{{ search_placeholder }}"/>
<button class="br-button circle small" type="button" aria-label="Pesquisar">
<i class="fas fa-search" aria-hidden="true"></i>
</button>
</div>
<button class="br-button circle search-close ml-1" type="button" aria-label="Fechar Busca" data-dismiss="search"><i class="fas fa-times" aria-hidden="true"></i>
</button>
</div>
</div>
</div>
</header>
{% endblock %}
{% extends "dsgov/base.html" %}
{% load br_components %}
{% load static %}
{% block content %}
<div class="br-list" role="list">
<div class="header">
<div class="title">{{ title }}</div>
</div>
<span class="br-divider"></span>
{% for item in items %}
<div class="br-item" role="listitem">
<div class="row align-items-center">
<div class="col-auto">
<i class="{{ item.icon }}" aria-hidden="true"></i>
</div>
<div class="col">{{ item.content }}</div>
<div class="col-auto">{{ item.meta }}</div>
</div>
</div>
{% endfor %}
</div>
{% endblock %}
{% extends "dsgov/base.html" %}
{% load br_components %}
{% load static %}
{% block content %}
<div class="col-2"><a class="br-item header" href="javascript:void(0)">
<div class="content text-down-01 text-bold text-uppercase">{{ title }}</div>
<div class="support"><i class="fas fa-angle-down" aria-hidden="true"></i>
</div></a>
<div class="br-list"><span class="br-divider d-md-none"></span><a class="br-item" href="javascript:void(0)">
{% for item in items %}
{% if not forloop.last %}
<div class="content">{{ item.content }}</div></a><a class="br-item" href="javascript:void(0)">
{% else %}
<div class="content">Nulla occaecat eiusmod</div></a><span class="br-divider d-md-none"></span>
{% endif %}
{% endfor %}
</div>
</div>
{% endblock %}
This diff is collapsed.
{% extends "dsgov/base.html" %}
{% load br_components %}
{% load static %}
{% block content %}
<div class="d-flex align-items-center">
<span class="br-tag {{ extra_classes }} {{ density }}" aria-describedby="{{ aria_describedby }}">
<span id="{{ aria_describedby }}">{{ label }}</span>
</span>
</div>
{% endblock %}
\ No newline at end of file
{% extends "dsgov/base.html" %}
{% load br_components %}
{% load static %}
{% block title %}
Exemplo de Breadcrumb
{% endblock %}
{% block content %}
<div class="container">
{% br_breadcrumb %}
</div>
{% endblock %}
\ No newline at end of file
{% extends "dsgov/base.html" %}
{% load br_components %}
{% load static %}
{% block title %}
Exemplo de Botões
{% endblock %}
{% block content %}
<div class="container">
<div class="p-3 bg-blue-warm-vivid-90 mb-5">
{% br_button text="Primário" button_type="button" style="primary" extra_classes="block dark-mode mb-3" %}
{% br_button text="Secundário" button_type="button" style="secondary" extra_classes="block dark-mode mb-3" %}
{% br_button text="Terciário" button_type="button" extra_classes="block dark-mode" %}
</div>
<div class="Buttons">
{% br_button text="Primário" button_type="button" style="primary" extra_classes="mr-3" %}
{% br_button text="Secundário" button_type="button" style="secondary" extra_classes="mr-3" %}
{% br_button text="Terciário" button_type="button" extra_classes="mr-3" %}
</div>
<div class="p-3">
{% br_button text="Baixa densidade" button_type="button" style="secondary" extra_classes="large mr-3" %}
{% br_button text="Padrão" button_type="button" style="secondary" extra_classes="mr-3" %}
{% br_button text="Alta densidade" button_type="button" style="secondary" extra_classes="small" %}
</div>
<div class="p-3">
{% br_button button_type="button" style="secondary" extra_classes="circle large mr-3" icon_class="fas fa-city" %}
{% br_button button_type="button" style="secondary" extra_classes="circle mr-3" icon_class="fas fa-city" %}
{% br_button button_type="button" style="secondary" extra_classes="circle small" icon_class="fas fa-city" %}
</div>
<div class="p-3">
{% br_button button_type="button" style="primary" extra_classes="circle mr-3" icon_class="fas fa-city" %}
{% br_button button_type="button" style="secondary" extra_classes="circle mr-3" icon_class="fas fa-city" %}
{% br_button button_type="button" style="" extra_classes="circle" icon_class="fas fa-city" %}
</div>
<div class="p-3 bg-blue-warm-vivid-90">
{% br_button button_type="button" style="primary" extra_classes="dark-mode circle mr-3" icon_class="fas fa-city" %}
{% br_button button_type="button" style="secondary" extra_classes="dark-mode circle mr-3" icon_class="fas fa-city" %}
{% br_button button_type="button" style="" extra_classes="dark-mode circle" icon_class="fas fa-city" %}
</div>
<div class="p-3">
{% br_button text="Primário" button_type="button" style="primary" extra_classes="block mb-3" %}
{% br_button text="Secundário" button_type="button" style="secondary" extra_classes="block mb-3" %}
{% br_button text="Terciário" button_type="button" extra_classes="block mb-3" %}
</div>
<div class="p-3">
{% br_button text="Desativado" button_type="button" style="primary" extra_classes="disabled mr-3"%}
{% br_button text="Ativado" button_type="button" style="primary" extra_classes="active mr-3" %}
{% br_button text="Carregando" button_type="button" style="primary" extra_classes="loading" %}
</div>
</div>
{% endblock %}
{% extends "dsgov/base.html" %}
{% load br_components %}
{% load static %}
{% block title %}
Exemplo de Carousel
{% endblock %}
{% block content %}
<div class="container">
{% br_carousel imagens=imagens %}
</div>
{% endblock %}
{% extends "dsgov/base.html" %}
{% load br_components %}
{% load static %}
{% block title %}
Exemplo de Footer
{% endblock %}
{% block content %}
<div class="container">
{% br_footer lists=list copyright="© 2024 UFRPE | Todos os direitos reservados" logo_url="https://cdngovbr-ds.estaleiro.serpro.gov.br/design-system/images/logo-assign-negative.png" emec_image="https://cdngovbr-ds.estaleiro.serpro.gov.br/design-system/images/logo-assign-negative.png" acesso_a_info_image="https://cdngovbr-ds.estaleiro.serpro.gov.br/design-system/images/logo-assign-negative.png" %}
</div>
{% endblock %}
{% extends "dsgov/base.html" %}
{% load br_components %}
{% load static %}
{% block title %}
Exemplo de Headers
{% endblock %}
{% block content %}
<div class="container">
{% static '/dsgov/images/logo.png' as logo_path %}
{% br_header title="Universidade Federal Rural de Pernambuco" logo_url=logo_path links=lista extra_classes="bg-blue-warm-vivid-90" links_style="color: #FFFFFF;" title_extra="UFRPE" title_style="color: #FFFFFF;" items_style="color: #FFFFFF;" search_placeholder="O que você procura?" label_button_login="Entrar" header_sign_style="color: #FFFFFF; font-weight: bold;" %}
</div>
{% endblock %}
{% extends "dsgov/base.html" %}
{% load br_components %}
{% load static %}
{% block title %}
Exemplo de Inputs
{% endblock %}
{% block content %}
<div class="container">
<!-- Input padrão -->
<div class="col-sm-8 col-lg-5">
<div class="input-default">
{% br_input input_type="text" placeholder="Placeholder" label="Label/Rótulo" input_id="input-default" extra_classes="" help_text="Texto auxiliar. Função de previnir erros." %}
</div>
</div>
<!-- Input com densidades -->
<div class="col-sm-4 col-lg-3 mb-3">
{% br_input input_type="text" placeholder="Placeholder" label="Densidade padrão" input_id="input-medium" extra_classes="" %}
</div>
<div class="col-sm-4 col-lg-3 mb-3">
{% br_input input_type="text" placeholder="Placeholder" label="Alta densidade" input_id="input-small" density="small" extra_classes="" %}
</div>
<div class="col-sm-4 col-lg-3 mb-3">
{% br_input input_type="text" placeholder="Placeholder" label="Baixa densidade" input_id="input-large" density="large" extra_classes="" %}
</div>
<!-- Input com ícones -->
<div class="col-sm-6 col-lg-4 mb-3">
{% br_input input_type="text" placeholder="Placeholder" label="Login" input_id="input-medium" extra_classes="" icon_class="fas fa-user-tie" %}
</div>
<div class="col-sm-6 col-lg-4 mb-3">
{% br_input input_type="text" placeholder="Placeholder" label="Alta densidade" input_id="input-small" density="small" extra_classes="" icon_class="fas fa-user" %}
</div>
<div class="col-sm-6 col-lg-4 mb-3">
{% br_input input_type="text" placeholder="Placeholder" label="Baixa densidade" input_id="input-large" density="large" extra_classes="" icon_class="fas fa-users" %}
</div>
</div>
{% endblock %}
{% extends "dsgov/base.html" %}
{% load br_components %}
{% load static %}
{% block title %}
Exemplo de Lista
{% endblock %}
{% block content %}
<div class="container">
{% br_list title="Minha Lista" items=lista %}
</div>
{% endblock %}
{% extends "dsgov/base.html" %}
{% load br_components %}
{% load static %}
{% block title %}
Exemplo de Menu
{% endblock %}
{% block content %}
<div class="container">
{% br_menu %}
</div>
{% endblock %}
{% extends "dsgov/base.html" %}
{% load br_components %}
{% load static %}
{% block title %}
Exemplo de Tag
{% endblock %}
{% block content %}
<div class="container mt-5">
<div class="d-flex align-items-center">
{% br_tag extra_classes="mr-3" close_button=True close_icon_class="fas fa-times" icon_class="fas fa-car" tag_text="Carro 1" tag_id="interaction01" %}
{% br_tag extra_classes="mr-3" close_button=True close_icon_class="fas fa-times" icon_class="fas fa-bicycle" tag_text="Bicicleta 1" tag_id="interaction02" %}
{% br_tag extra_classes="mr-3" close_button=True close_icon_class="fas fa-times" icon_class="fas fa-motorcycle" tag_text="Moto 1" tag_id="interaction03" %}
</div>
<div class="d-flex align-items-center mt-3">
{% br_tag icon_class="fas fa-car" tag_text="Texto e ícone" tag_id="tag02" extra_classes="bg-mint-cool-vivid-70 mr-3" %}
{% br_tag tag_text="Texto" tag_id="tag02" extra_classes="bg-violet-warm-vivid-70 mr-3" %}
</div>
<div class="d-flex align-items-center mt-3">
{% br_tag tag_text="Alta" tag_id="densidade01" extra_classes="bg-orange-vivid-50 mr-3" density="small" %}
{% br_tag tag_text="Padrão" tag_id="densidade02" extra_classes="bg-green-warm-vivid-50 mr-3" density="medium" %}
{% br_tag tag_text="Baixa" tag_id="densidade03" extra_classes="bg-indigo-warm-vivid-50 mr-3" density="large" %}
</div>
</div>
{% endblock %}
\ No newline at end of file
Markdown is supported
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment