mirror of
https://github.com/wahyd4/links.git
synced 2026-08-08 21:04:53 +10:00
Update style for newsletter
This commit is contained in:
Binary file not shown.
@@ -26,7 +26,7 @@ case "$1" in
|
||||
docker-compose build
|
||||
;;
|
||||
"shell")
|
||||
docker-compose exec web uv run manage.py shell
|
||||
docker-compose exec web bash
|
||||
;;
|
||||
"migrate")
|
||||
docker-compose exec web uv run manage.py makemigrations
|
||||
|
||||
@@ -1,3 +1,4 @@
|
||||
{% load static %}
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
@@ -6,79 +7,11 @@
|
||||
<title>{{ link.alias }}</title>
|
||||
<link href="https://cdnjs.cloudflare.com/ajax/libs/tailwindcss/2.2.19/tailwind.min.css" rel="stylesheet">
|
||||
<link href="https://cdnjs.cloudflare.com/ajax/libs/tailwindcss-typography/0.4.0/typography.min.css" rel="stylesheet">
|
||||
<style>
|
||||
.prose {
|
||||
color: #374151;
|
||||
max-width: 65ch;
|
||||
}
|
||||
.prose p {
|
||||
margin-top: 1.25em;
|
||||
margin-bottom: 1.25em;
|
||||
}
|
||||
.prose a {
|
||||
color: #2563eb;
|
||||
text-decoration: underline;
|
||||
}
|
||||
.prose strong {
|
||||
font-weight: 600;
|
||||
}
|
||||
.prose ul {
|
||||
margin-top: 1.25em;
|
||||
margin-bottom: 1.25em;
|
||||
list-style-type: disc;
|
||||
padding-left: 1.625em;
|
||||
}
|
||||
.prose ol {
|
||||
margin-top: 1.25em;
|
||||
margin-bottom: 1.25em;
|
||||
list-style-type: decimal;
|
||||
padding-left: 1.625em;
|
||||
}
|
||||
.prose h1 {
|
||||
font-size: 2.25em;
|
||||
margin-top: 0;
|
||||
margin-bottom: 0.8888889em;
|
||||
line-height: 1.1111111;
|
||||
}
|
||||
.prose h2 {
|
||||
font-size: 1.5em;
|
||||
margin-top: 2em;
|
||||
margin-bottom: 1em;
|
||||
line-height: 1.3333333;
|
||||
}
|
||||
.prose h3 {
|
||||
font-size: 1.25em;
|
||||
margin-top: 1.6em;
|
||||
margin-bottom: 0.6em;
|
||||
line-height: 1.6;
|
||||
}
|
||||
.prose img {
|
||||
margin-top: 2em;
|
||||
margin-bottom: 2em;
|
||||
}
|
||||
.prose code {
|
||||
color: #111827;
|
||||
font-weight: 600;
|
||||
}
|
||||
.prose pre {
|
||||
color: #e5e7eb;
|
||||
background-color: #1f2937;
|
||||
overflow-x: auto;
|
||||
font-size: 0.875em;
|
||||
line-height: 1.7142857;
|
||||
margin-top: 1.7142857em;
|
||||
margin-bottom: 1.7142857em;
|
||||
border-radius: 0.375rem;
|
||||
padding-top: 0.8571429em;
|
||||
padding-right: 1.1428571em;
|
||||
padding-bottom: 0.8571429em;
|
||||
padding-left: 1.1428571em;
|
||||
}
|
||||
</style>
|
||||
<link rel="stylesheet" href="{% static 'css/markdown.css' %}">
|
||||
</head>
|
||||
<body class="bg-gray-100">
|
||||
<div class="max-w-6xl mx-auto mt-10 p-4 sm:px-6 bg-white shadow-md rounded-lg">
|
||||
<div class="prose prose-sm sm:prose lg:prose-lg xl:prose-xl max-w-none">
|
||||
<div class="prose">
|
||||
{{ rendered_text|safe }}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -1,22 +1,10 @@
|
||||
{% extends 'base.html' %}
|
||||
{% load i18n %}
|
||||
{% load markdown_extras %}
|
||||
{% load static %}
|
||||
|
||||
{% block extra_css %}
|
||||
<style>
|
||||
/* Additional custom styles if needed */
|
||||
.prose pre {
|
||||
background-color: #1a202c;
|
||||
color: #e5e7eb;
|
||||
}
|
||||
|
||||
.prose :not(pre) > code {
|
||||
background-color: #f3f4f6;
|
||||
padding: 0.2em 0.4em;
|
||||
border-radius: 0.375rem;
|
||||
font-size: 0.875em;
|
||||
}
|
||||
</style>
|
||||
<link rel="stylesheet" href="{% static 'css/markdown.css' %}">
|
||||
{% endblock %}
|
||||
|
||||
{% block content %}
|
||||
@@ -61,7 +49,7 @@
|
||||
</div>
|
||||
|
||||
<!-- Content with improved markdown styling -->
|
||||
<article class="prose prose-slate lg:prose-lg xl:prose-xl max-w-none">
|
||||
<article class="prose">
|
||||
{{ newsletter.content|markdown|safe }}
|
||||
</article>
|
||||
</div>
|
||||
|
||||
@@ -0,0 +1,98 @@
|
||||
.prose {
|
||||
color: #374151;
|
||||
max-width: none;
|
||||
}
|
||||
.prose p {
|
||||
margin-top: 1.25em;
|
||||
margin-bottom: 1.25em;
|
||||
}
|
||||
.prose a {
|
||||
color: #2563eb;
|
||||
text-decoration: underline;
|
||||
}
|
||||
.prose strong {
|
||||
font-weight: 600;
|
||||
}
|
||||
.prose ul {
|
||||
margin-top: 1.25em;
|
||||
margin-bottom: 1.25em;
|
||||
list-style-type: disc;
|
||||
padding-left: 1.625em;
|
||||
}
|
||||
.prose ol {
|
||||
margin-top: 1.25em;
|
||||
margin-bottom: 1.25em;
|
||||
list-style-type: decimal;
|
||||
padding-left: 1.625em;
|
||||
}
|
||||
.prose h1 {
|
||||
font-size: 2.25em;
|
||||
margin-top: 0;
|
||||
margin-bottom: 0.8888889em;
|
||||
line-height: 1.1111111;
|
||||
font-weight: 600;
|
||||
}
|
||||
.prose h2 {
|
||||
font-size: 1.5em;
|
||||
margin-top: 2em;
|
||||
margin-bottom: 1em;
|
||||
line-height: 1.3333333;
|
||||
font-weight: 600;
|
||||
}
|
||||
.prose h3 {
|
||||
font-size: 1.25em;
|
||||
margin-top: 1.6em;
|
||||
margin-bottom: 0.6em;
|
||||
line-height: 1.6;
|
||||
font-weight: 600;
|
||||
}
|
||||
.prose img {
|
||||
margin-top: 2em;
|
||||
margin-bottom: 2em;
|
||||
}
|
||||
.prose code {
|
||||
color: #111827;
|
||||
font-weight: 600;
|
||||
background-color: #f3f4f6;
|
||||
padding: 0.2em 0.4em;
|
||||
border-radius: 0.375rem;
|
||||
font-size: 0.875em;
|
||||
}
|
||||
.prose pre {
|
||||
color: #e5e7eb;
|
||||
background-color: #1f2937;
|
||||
overflow-x: auto;
|
||||
font-size: 0.875em;
|
||||
line-height: 1.7142857;
|
||||
margin-top: 1.7142857em;
|
||||
margin-bottom: 1.7142857em;
|
||||
border-radius: 0.375rem;
|
||||
padding: 1em;
|
||||
}
|
||||
.prose pre code {
|
||||
background-color: transparent;
|
||||
color: inherit;
|
||||
padding: 0;
|
||||
}
|
||||
.prose blockquote {
|
||||
font-style: italic;
|
||||
border-left: 4px solid #e5e7eb;
|
||||
padding-left: 1em;
|
||||
margin: 1.25em 0;
|
||||
}
|
||||
.prose table {
|
||||
width: 100%;
|
||||
border-collapse: collapse;
|
||||
margin: 2em 0;
|
||||
}
|
||||
.prose table th {
|
||||
background-color: #f3f4f6;
|
||||
font-weight: 600;
|
||||
text-align: left;
|
||||
padding: 0.5em;
|
||||
border: 1px solid #e5e7eb;
|
||||
}
|
||||
.prose table td {
|
||||
padding: 0.5em;
|
||||
border: 1px solid #e5e7eb;
|
||||
}
|
||||
Reference in New Issue
Block a user