Skip to content

Instantly share code, notes, and snippets.

@andersonsantech

andersonsantech/tailwindcss_with_fasthtml.py

Last active September 21, 2024 17:21
Show Gist options
  • Save andersonsantech/113158580d5f2d9443249d555642ef7a to your computer and use it in GitHub Desktop.
Save andersonsantech/113158580d5f2d9443249d555642ef7a to your computer and use it in GitHub Desktop.
Download ZIP
Tailwindcss with Fasthtml
Raw
tailwindcss_with_fasthtml.py
from fasthtml.common import *
app, rt = fast_app(
live=True,
pico=False,
hdrs=(
Meta(charset="UTF-8"),
Meta(name="viewport", content="width=device-width, initial-scale=1.0"),
Script(src="https://cdn.tailwindcss.com"),
)
)
def balao(title, subtitle):
return Div(
Div(
Img(src='static/img/logo.svg', cls='size-12', alt='ChitChat Logo')
, cls='shrink-0'
),
Div(
Div(
f'{title}', cls='text-xl font-medium text-black'
),
P(f'{subtitle}',cls='text-slate-500')
),
cls='p-6 max-w-sm mx-auto bg-white rounded-xl shadow-lg flex items-center space-x-4'
)
@rt('/')
def get():
mensagens = [
('SuperChat 1', 'Você tem uma nova mensagem 1'),
('SuperChat 2', 'Você tem uma nova mensagem 2'),
('SuperChat 3', 'Você tem uma nova mensagem 3')
]
return Div(
*[balao(title, subtitle) for title, subtitle in mensagens],
Button('Save Changes', cls='bg-sky-500 hover:bg-sky-700')
)
def numList(i):
return Ul(*[Li(o) for o in range(i)])
serve()
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment