midefos/basicswap
1
0
Fork 0
mirror of https://github.com/basicswap/basicswap.git synced 2025-11-06 02:38:11 +01:00
Code Issues Packages Projects Releases Wiki Activity

update: GUI version 2.0

Browse Source
This commit is contained in:
gerlofvanek
2023-04-06 16:59:28 +02:00
parent 22576c0316
commit c5ab11d015
43 changed files with 11229 additions and 256841 deletions
Download Patch File Download Diff File Expand all files Collapse all files

88
basicswap/templates/footer.html
View File

@@ -1,32 +1,35 @@
<section class="bg-white overflow-hidden">
<section class="overflow-hidden">
<div class="container px-4 mx-auto">
<div class="flex flex-wrap lg:items-center pt-24 pb-12 -mx-4">
<div class="w-full md:w-3/4 px-4">
<a class="block mb-8 max-w-max" href="#"> <img class="h-8" src="/static/images/logos/basicswap-logo-dark.svg" alt=""> </a>
<a class="block mb-8 max-w-max" href="/">
<img src="/static/images/logos/basicswap-logo.svg" class="h-8 imageshow dark-image">
<img src="/static/images/logos/basicswap-logo-dark.svg" class="h-8 imageshow light-image">
</a>
<div class="mb-12 md:mb-0 flex flex-wrap -mx-3 md:-mx-6">
<div class="w-full md:w-auto p-3 md:py-0 md:px-6"><a class="inline-block text-coolGray-500 hover:text-coolGray-600 font-medium" href="https://academy.particl.io/en/latest/basicswap-dex/basicswap_explained.html" target="_blank">BasicSwap Explained</a></div>
<div class="w-full md:w-auto p-3 md:py-0 md:px-6"><a class="inline-block text-coolGray-500 hover:text-coolGray-600 font-medium" href="https://academy.particl.io/en/latest/basicswap-guides/basicswapguides_installation.html" target="_blank">Tutorials and Guides</a></div>
<div class="w-full md:w-auto p-3 md:py-0 md:px-6"><a class="inline-block text-coolGray-500 hover:text-coolGray-600 font-medium" href="https://academy.particl.io/en/latest/faq/get_support.html" target="_blank">Get Support</a></div>
<div class="w-full md:w-auto p-3 md:py-0 md:px-6"><a class="inline-block text-coolGray-500 dark:text-gray-300 font-medium" href="https://academy.particl.io/en/latest/basicswap-dex/basicswap_explained.html" target="_blank">BasicSwap Explained</a></div>
<div class="w-full md:w-auto p-3 md:py-0 md:px-6"><a class="inline-block text-coolGray-500 dark:text-gray-300 font-medium" href="https://academy.particl.io/en/latest/basicswap-guides/basicswapguides_installation.html" target="_blank">Tutorials and Guides</a></div>
<div class="w-full md:w-auto p-3 md:py-0 md:px-6"><a class="inline-block text-coolGray-500 dark:text-gray-300 font-medium" href="https://academy.particl.io/en/latest/faq/get_support.html" target="_blank">Get Support</a></div>
</div>
</div>
<div class="w-full md:w-1/4 px-4"> </div>
</div>
</div>
<div class="border-b border-coolGray-100"></div>
<div class="border-b border-gray-100 dark:border-gray-500 dark:bg-body dark:border-b-2"></div>
<div class="container px-4 mx-auto">
<div class="flex flex-wrap items-center py-12 md:pb-32">
<div class="w-full md:w-1/2 mb-6 md:mb-0">
<div class="flex items-center">
<div class="flex items-center">
<p class="mr-1 text-sm text-gray-90 font-medium ">© 2022~ </p>
<p class="text-sm text-coolGray-400 font-medium">{{ title }}</p> <span class="w-1 h-1 mx-1.5 bg-gray-500 rounded-full"></span>
<p class="text-sm text-coolGray-400 font-medium">GUI 0.1.2 </p> <span class="w-1 h-1 mx-1.5 bg-gray-500 rounded-full"></span>
<p class="mr-2 text-sm font-bold text-gray-90 ">Made with </p>
<p class="mr-1 text-sm text-gray-90 dark:text-white font-medium ">© 2023~</p>
<p class="text-sm text-coolGray-400 dark:text-white font-medium">{{ title }}</p> <span class="w-1 h-1 mx-1.5 bg-gray-500 rounded-full"></span>
<p class="text-sm text-coolGray-400 dark:text-white font-medium">GUI 2.0 </p> <span class="w-1 h-1 mx-1.5 bg-gray-500 rounded-full"></span>
<p class="mr-2 text-sm font-bold dark:text-white text-gray-90 ">Made with </p>
<svg xmlns="http://www.w3.org/2000/svg" height="20" width="20" viewBox="0 0 24 24">
<g stroke-linecap="round" stroke-width="2" fill="none" stroke="#f80b0b" stroke-linejoin="round">
<path d="M21.243,3.757 c-2.343-2.343-6.142-2.343-8.485,0c-0.289,0.289-0.54,0.6-0.757,0.927c-0.217-0.327-0.469-0.639-0.757-0.927 c-2.343-2.343-6.142-2.343-8.485,0c-2.343,2.343-2.343,6.142,0,8.485L12,21.485l9.243-9.243C23.586,9.899,23.586,6.1,21.243,3.757z"></path>
</g>
</svg> <span class="ml-2 text-sm font-bold text-gray-90 ">by TV and CRZ</span></div>
</svg> <span class="ml-2 text-sm font-bold dark:text-white text-gray-90 ">by TV and CRZ</span></div><!-- fix dots -->
</div>
</div>
<div class="w-full md:w-1/2">
@@ -48,4 +51,65 @@
</div>
</div>
</section>
<script src="/static/js/libs/dd.min.js"></script>
<script>
window.onload = () => {
toggleImages();
};
document.getElementById('theme-toggle').addEventListener('click', () => {
toggleImages();
});
function toggleImages() {
const html = document.querySelector('html');
const darkImages = document.querySelectorAll('.dark-image');
const lightImages = document.querySelectorAll('.light-image');
if (html && html.classList.contains('dark')) {
toggleImageDisplay(darkImages, 'block');
toggleImageDisplay(lightImages, 'none');
} else {
toggleImageDisplay(darkImages, 'none');
toggleImageDisplay(lightImages, 'block');
}
}
function toggleImageDisplay(images, display) {
images.forEach(img => {
img.style.display = display;
});
}
</script>
<script>
var themeToggleDarkIcon = document.getElementById('theme-toggle-dark-icon');
var themeToggleLightIcon = document.getElementById('theme-toggle-light-icon');
if (localStorage.getItem('color-theme') === 'dark' || (!('color-theme' in localStorage) && window.matchMedia('(prefers-color-scheme: dark)').matches)) {
themeToggleLightIcon.classList.remove('hidden');
} else {
themeToggleDarkIcon.classList.remove('hidden');
}
function setTheme(theme) {
if (theme === 'light') {
document.documentElement.classList.remove('dark');
localStorage.setItem('color-theme', 'light');
} else {
document.documentElement.classList.add('dark');
localStorage.setItem('color-theme', 'dark');
}
}
document.getElementById('theme-toggle').addEventListener('click', () => {
if (localStorage.getItem('color-theme') === 'dark') {
setTheme('light');
} else {
setTheme('dark');
}
themeToggleDarkIcon.classList.toggle('hidden');
themeToggleLightIcon.classList.toggle('hidden');
toggleImages();
});
</script>