62 lines
2.3 KiB
HTML
62 lines
2.3 KiB
HTML
{% extends "base.html" %}
|
|
{% block title %}Podgląd Backupu - /etc/hosts Manager{% endblock %}
|
|
{% block extra_css %}
|
|
{{ super() }}
|
|
<!-- Link do arkusza Highlight.js z identyfikatorem do dynamicznej zmiany -->
|
|
<link id="hljs-style" rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/11.7.0/styles/atom-one-dark.min.css">
|
|
<style>
|
|
/* Dodatkowy styl dla karty podglądu backupu */
|
|
.card-backup {
|
|
margin-top: 20px;
|
|
}
|
|
.card-backup pre {
|
|
max-height: 500px;
|
|
overflow-y: auto;
|
|
}
|
|
</style>
|
|
{% endblock %}
|
|
{% block content %}
|
|
<div class="card card-backup shadow-sm">
|
|
<div class="card-header">
|
|
<h2 class="mb-0">Podgląd Backupu</h2>
|
|
</div>
|
|
<div class="card-body">
|
|
<p><strong>Data:</strong> {{ backup.created_at.strftime("%Y-%m-%d %H:%M:%S") }}</p>
|
|
<p><strong>Opis:</strong> {{ backup.description }}</p>
|
|
<pre><code class="plaintext">{{ backup.content | e }}</code></pre>
|
|
<a href="{{ url_for('backups') }}" class="btn btn-secondary mt-3">Powrót do listy backupów</a>
|
|
</div>
|
|
</div>
|
|
{% endblock %}
|
|
{% block extra_js %}
|
|
{{ super() }}
|
|
<!-- Highlight.js JS -->
|
|
<script src="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/11.7.0/highlight.min.js"></script>
|
|
<script>
|
|
// Inicjalizacja podświetlania
|
|
hljs.highlightAll();
|
|
|
|
// Funkcja aktualizująca motyw podświetlania w zależności od motywu aplikacji
|
|
function updateHighlightTheme() {
|
|
var hljsStyle = document.getElementById('hljs-style');
|
|
if (document.documentElement.getAttribute('data-bs-theme') === 'dark') {
|
|
hljsStyle.href = 'https://cdnjs.cloudflare.com/ajax/libs/highlight.js/11.7.0/styles/atom-one-dark.min.css';
|
|
} else {
|
|
hljsStyle.href = 'https://cdnjs.cloudflare.com/ajax/libs/highlight.js/11.7.0/styles/github.min.css';
|
|
}
|
|
}
|
|
|
|
// Aktualizacja przy starcie
|
|
updateHighlightTheme();
|
|
|
|
// Aktualizacja przy zmianie trybu (zakładamy, że w base.html mamy przełącznik trybu)
|
|
const darkModeToggle = document.getElementById('darkModeToggle');
|
|
if (darkModeToggle) {
|
|
darkModeToggle.addEventListener('change', function() {
|
|
// Mały delay, aby zmiana motywu została zastosowana
|
|
setTimeout(updateHighlightTheme, 100);
|
|
});
|
|
}
|
|
</script>
|
|
{% endblock %}
|