290 lines
13 KiB
HTML
290 lines
13 KiB
HTML
<!-- templates/base.html -->
|
|
<!DOCTYPE html>
|
|
<html lang="es">
|
|
<!-- Leaflet CSS -->
|
|
<link rel="stylesheet" href="https://unpkg.com/leaflet@1.9.4/dist/leaflet.css"/>
|
|
|
|
<!-- Leaflet JS -->
|
|
<script src="https://unpkg.com/leaflet@1.9.4/dist/leaflet.js"></script>
|
|
|
|
<link rel="stylesheet" href="https://cdn.priet.us/tui-image-editor/tui-icons.css">
|
|
|
|
<!-- Awesomplete CSS -->
|
|
<link rel="stylesheet" href="https://cdn.priet.us/cdn/css/awesomplete.min.css" integrity="sha512-RT/9M3vzjYojy97YiNTZbyrQ4nJ+gNoinZKTGSVvLITijfQIAIDNicUe+U2KaeOWo9j7IbRzRisx/7eglOc+wA==". crossorigin="anonymous" referrerpolicy="no-referrer" />
|
|
|
|
<!-- Awesomplete JS -->
|
|
<script src="https://cdn.priet.us/cdn/js/awesomplete.min.js" integrity="sha512-HcBl0GSJvt4Qecm4srHapirUx0HJDi2zYXm6KUKNNUGdTIN9cBwakVZHWmRVj4MKgy1AChqhWGYcMDbRKgO0zg==" crossorigin="anonymous" referrerpolicy="no-referrer"></script>
|
|
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
<link rel="icon" type="image/x-icon" href="{{ url_for('static', filename='favicon.ico') }}">
|
|
<link
|
|
rel="stylesheet"
|
|
id="theme-stylesheet"
|
|
data-light="{{ url_for('static', filename='css/bootstraplight.min.css') }}"
|
|
data-dark="{{ url_for('static', filename='css/bootstrap.min.css') }}"
|
|
href="{% if session.get('theme', 'light') == 'dark' %}
|
|
{{ url_for('static', filename='css/bootstrap.min.css') }}
|
|
{% else %}
|
|
{{ url_for('static', filename='css/bootstraplight.min.css') }}
|
|
{% endif %}"
|
|
>
|
|
|
|
<title>{% block title %}My Pastebin{% endblock %}</title>
|
|
<style>
|
|
/* Oculta el contenido hasta que se ejecute el script */
|
|
.preload {
|
|
opacity: 0;
|
|
transition: opacity 0.3s ease;
|
|
}
|
|
</style>
|
|
|
|
<!-- Font Awesome para Iconos -->
|
|
<link rel="stylesheet" href="https://cdn.priet.us/cdn/css/all.min.css">
|
|
|
|
<!-- Bootstrap CSS (Bootstraplight.min.css para tema claro por defecto) -->
|
|
<!-- Incluye PDF.js desde CDN -->
|
|
<script src="https://cdn.priet.us/cdn/js/pdf.min.js"></script>
|
|
|
|
<!-- Pygments Styles -->
|
|
{% for style in pygments_styles %}
|
|
<link rel="stylesheet"
|
|
href="{{ url_for('static', filename='css/' + style + '.css') }}"
|
|
title="{{ style }}"
|
|
id="pygments-{{ style }}"
|
|
{% if style != default_pygments_style %}disabled{% endif %}
|
|
>
|
|
{% endfor %}
|
|
|
|
<!-- Estilos Personalizados -->
|
|
{% block head %}
|
|
<!-- Contenido adicional en el head -->
|
|
{% endblock %}
|
|
<style>
|
|
/* Estilos para resaltar código */
|
|
.highlight {
|
|
border-radius: 5px;
|
|
padding: 10px;
|
|
overflow-x: auto;
|
|
white-space: pre-wrap;
|
|
}
|
|
|
|
/* Estilos adicionales según el tema */
|
|
body[data-theme="light"] .highlight {
|
|
background: #f8f8f2;
|
|
color: #2d2d2d;
|
|
}
|
|
|
|
body[data-theme="dark"] .highlight {
|
|
background: #2d2d2d;
|
|
color: #f8f8f2;
|
|
}
|
|
|
|
/* Estilos para el Tooltip Personalizado */
|
|
.tooltip-preview {
|
|
position: absolute;
|
|
background-color: #fff; /* Fondo por defecto para modo claro */
|
|
border: 1px solid #ddd;
|
|
box-shadow: 0px 4px 6px rgba(0, 0, 0, 0.1);
|
|
padding: 10px;
|
|
max-width: 300px;
|
|
display: none;
|
|
z-index: 1000;
|
|
min-height: 50px;
|
|
color: #2d2d2d; /* Texto por defecto para modo claro */
|
|
border-radius: 5px;
|
|
}
|
|
|
|
/* Estilos para modo oscuro */
|
|
body[data-theme="dark"] .tooltip-preview {
|
|
background-color: #333; /* Fondo oscuro */
|
|
border-color: #555;
|
|
color: #f8f8f2; /* Texto claro */
|
|
}
|
|
|
|
/* Estilos para imágenes dentro del tooltip */
|
|
.tooltip-preview img {
|
|
max-width: 100%;
|
|
height: auto;
|
|
border-radius: 3px;
|
|
}
|
|
</style>
|
|
</head>
|
|
<script>
|
|
// Conviertes la lista (o diccionario) Python en JSON
|
|
var PYGMENTS_STYLES = {{ pygments_styles|tojson }};
|
|
</script>
|
|
|
|
<body data-theme="{{ session.get('theme', 'light') }}" class="preload">
|
|
|
|
<!-- Navbar Mejorada -->
|
|
<nav class="navbar navbar-expand-lg navbar-dark bg-primary">
|
|
<div class="container-fluid">
|
|
<a class="navbar-brand" href="/">My Pastebin</a>
|
|
<button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarNav"
|
|
aria-controls="navbarNav" aria-expanded="false" aria-label="Toggle navigation">
|
|
<span class="navbar-toggler-icon"></span>
|
|
</button>
|
|
<div class="collapse navbar-collapse" id="navbarNav">
|
|
<ul class="navbar-nav ms-auto">
|
|
<!-- Enlace a Estadísticas -->
|
|
<li class="nav-item">
|
|
<a class="nav-link" href="/stats"><i class="fas fa-chart-bar me-1"></i> Statistics</a>
|
|
</li>
|
|
<!-- Enlace para Solicitar Cuenta -->
|
|
<li class="nav-item">
|
|
<a class="nav-link" href="/request-account"><i class="fas fa-user-plus me-1"></i> Request an account</a>
|
|
</li>
|
|
<li class="nav-item">
|
|
<a class="nav-link" href="/api/docs"><i class="fas fa-code me-1"></i> Public API</a>
|
|
</li>
|
|
<li class="nav-item">
|
|
<a class="nav-link" href="/contact">
|
|
<i class="fas fa-envelope me-1"></i> Contact
|
|
</a>
|
|
</li>
|
|
<!-- Enlace al Dashboard (solo para usuarios logueados) -->
|
|
{% if current_user.is_authenticated %}
|
|
<li class="nav-item">
|
|
<a class="nav-link" href="{{ url_for('user_dashboard') }}"><i class="fas fa-tachometer-alt me-1"></i> Dashboard</a>
|
|
</li>
|
|
{% endif %}
|
|
<!-- Mostrar Nombre de Usuario y Dropdown si está logueado -->
|
|
{% if current_user.is_authenticated %}
|
|
<li class="nav-item dropdown">
|
|
<a class="nav-link dropdown-toggle" href="#" id="userDropdown" role="button"
|
|
data-bs-toggle="dropdown" aria-expanded="false">
|
|
<i class="fas fa-user me-1"></i> {{ current_user.username }}
|
|
</a>
|
|
<ul class="dropdown-menu dropdown-menu-end" aria-labelledby="userDropdown">
|
|
<li><a class="dropdown-item" href="{{ url_for('change_password_form') }}"><i class="fas fa-key me-2"></i> Change password</a></li>
|
|
<li><hr class="dropdown-divider"></li>
|
|
<li><a class="dropdown-item" href="{{ url_for('logout') }}"><i class="fas fa-sign-out-alt me-2"></i> Logout</a></li>
|
|
</ul>
|
|
</li>
|
|
<li class="nav-item">
|
|
<a class="nav-link" href="{{ url_for('create_paste_web') }}">
|
|
<i class="fas fa-plus-circle me-1"></i> Create Paste
|
|
</a>
|
|
</li>
|
|
{% else %}
|
|
<!-- Enlace a Login si no está logueado -->
|
|
<li class="nav-item">
|
|
<a class="nav-link" href="{{ url_for('login') }}"><i class="fas fa-sign-in-alt me-1"></i> Login</a>
|
|
</li>
|
|
{% endif %}
|
|
<!-- Botón para Alternar Temas -->
|
|
<li class="nav-item">
|
|
<a href="#" id="theme-toggle" class="nav-link"><i class="fas fa-adjust me-1"></i> Change theme</a>
|
|
</li>
|
|
<!-- Enlace al Panel de Administración -->
|
|
<li class="nav-item">
|
|
<a class="nav-link" href="/admin/login"><i class="fas fa-tools me-1"></i> Admin Panel</a>
|
|
</li>
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
</nav>
|
|
|
|
<script>
|
|
// En cuanto se decida el tema, remover la clase "preload"
|
|
document.body.classList.remove('preload');
|
|
</script>
|
|
|
|
<!-- Contenedor Principal Mejorado -->
|
|
<div class="container my-4">
|
|
{% block content %}{% endblock %}
|
|
</div>
|
|
|
|
<!-- Contenedor para Toasts -->
|
|
<div class="position-fixed bottom-0 end-0 p-3" style="z-index: 1100">
|
|
<div id="liveToast" class="toast align-items-center text-white bg-primary border-0" role="alert" aria-live="assertive" aria-atomic="true">
|
|
<div class="d-flex">
|
|
<div class="toast-body">
|
|
<!-- Mensaje del toast -->
|
|
</div>
|
|
<button type="button" class="btn-close btn-close-white me-2 m-auto" data-bs-dismiss="toast" aria-label="Close"></button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Tooltip Preview -->
|
|
<div id="tooltip" class="tooltip-preview"></div>
|
|
|
|
<!-- QRCode.js para Generar Códigos QR -->
|
|
|
|
<!-- Bloque para scripts específicos de cada plantilla -->
|
|
{% block scripts %}{% endblock %}
|
|
</body>
|
|
|
|
<!-- Scripts globales -->
|
|
<script src="https://cdn.priet.us/cdn/js/qrcode.min.js"></script>
|
|
<script src="https://cdn.priet.us/cdn/js/bootstrap.bundle.min.js"></script>
|
|
<script src="{{ url_for('static', filename='js/base/theme.js') }}" defer></script>
|
|
<script src="{{ url_for('static', filename='js/toast-handler.js') }}" defer></script>
|
|
<script src="{{ url_for('static', filename='js/copy-url.js') }}" defer></script>
|
|
<script src="{{ url_for('static', filename='js/favorites.js') }}" defer></script>
|
|
<script src="{{ url_for('static', filename='js/qrcode-handler.js') }}" defer></script>
|
|
<script src="{{ url_for('static', filename='js/metadata-toggle.js') }}" defer></script>
|
|
<script src="{{ url_for('static', filename='js/remove-gps.js') }}" defer></script>
|
|
<script src="{{ url_for('static', filename='js/image-editor.js') }}" defer></script>
|
|
|
|
<!-- TUI Image Editor -->
|
|
{% if load_tui_editor %}
|
|
<script src="https://cdn.priet.us/tui-color-picker/tui-color-picker.min.js"></script>
|
|
<script src="https://cdn.priet.us/tui-image-editor/tui-image-editor.min.js"></script>
|
|
|
|
<link rel="stylesheet" href="https://cdn.priet.us/tui-image-editor/tui-image-editor.css">
|
|
<script src="https://cdn.priet.us/tui-image-editor/tui-image-editor.js"></script>
|
|
<link rel="stylesheet" href="https://cdn.priet.us/tui-image-editor/tui-image-editor.min.css">
|
|
{% endif %}
|
|
<script>
|
|
document.addEventListener('DOMContentLoaded', () => {
|
|
const toastElement = document.getElementById('liveToast');
|
|
const toastBody = toastElement.querySelector('.toast-body');
|
|
|
|
// Definir showToast como una función global
|
|
window.showToast = (message, bgColor = 'bg-primary') => {
|
|
toastBody.textContent = message;
|
|
toastElement.className = `toast align-items-center text-white ${bgColor} border-0`;
|
|
toastElement.style.display = 'block'; // Asegurarse de que sea visible
|
|
const toast = new bootstrap.Toast(toastElement);
|
|
toast.show();
|
|
};
|
|
|
|
// Mostrar mensajes flash de Flask como toasts
|
|
{% with messages = get_flashed_messages(with_categories=true) %}
|
|
{% if messages %}
|
|
{% for category, message in messages %}
|
|
let categoryClass = 'bg-primary';
|
|
if ("{{ category }}" === 'success') categoryClass = 'bg-success';
|
|
else if ("{{ category }}" === 'danger') categoryClass = 'bg-danger';
|
|
else if ("{{ category }}" === 'warning') categoryClass = 'bg-warning text-dark';
|
|
else if ("{{ category }}" === 'info') categoryClass = 'bg-info';
|
|
showToast("{{ message }}", categoryClass);
|
|
{% endfor %}
|
|
{% endif %}
|
|
{% endwith %}
|
|
});
|
|
</script>
|
|
|
|
<body {% if paste %}data-paste-id="{{ paste.id }}"
|
|
data-download-url="{{ url_for('download_paste', id=paste.id, _external=True) }}"{% endif %}>
|
|
</body>
|
|
|
|
<footer style="text-align: center; padding: 1em 0;">
|
|
<p>
|
|
This project is licensed under the
|
|
<a href="https://opensource.org/licenses/BSD-2-Clause" target="_blank">
|
|
BSD 2-Clause License
|
|
</a>.
|
|
</p>
|
|
<p style="font-size: small; margin-top: 0.5em;">
|
|
This website does not claim ownership of, copyright on,
|
|
and assumes no liability for provided content.
|
|
</p>
|
|
</footer>
|
|
</html>
|
|
|