enhance some responsive + change api
This commit is contained in:
BlasenhauerJ
parent
318228e592
commit
6c6845a794
|
|
@ -992,16 +992,6 @@ h6 {
|
|||
margin-right: 0.75rem;
|
||||
}
|
||||
|
||||
.mx-4 {
|
||||
margin-left: 1rem;
|
||||
margin-right: 1rem;
|
||||
}
|
||||
|
||||
.my-1\.5 {
|
||||
margin-top: 0.375rem;
|
||||
margin-bottom: 0.375rem;
|
||||
}
|
||||
|
||||
.mb-2 {
|
||||
margin-bottom: 0.5rem;
|
||||
}
|
||||
|
|
@ -1130,10 +1120,6 @@ h6 {
|
|||
margin-right: 1rem;
|
||||
}
|
||||
|
||||
.mb-1\.5 {
|
||||
margin-bottom: 0.375rem;
|
||||
}
|
||||
|
||||
.block {
|
||||
display: block;
|
||||
}
|
||||
|
|
@ -1473,6 +1459,16 @@ h6 {
|
|||
transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
|
||||
}
|
||||
|
||||
.translate-y-0\.5 {
|
||||
--tw-translate-y: 0.125rem;
|
||||
transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
|
||||
}
|
||||
|
||||
.translate-y-0 {
|
||||
--tw-translate-y: 0px;
|
||||
transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
|
||||
}
|
||||
|
||||
.translate-x-1 {
|
||||
--tw-translate-x: 0.25rem;
|
||||
transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
|
||||
|
|
@ -1498,16 +1494,6 @@ h6 {
|
|||
transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
|
||||
}
|
||||
|
||||
.translate-y-0\.5 {
|
||||
--tw-translate-y: 0.125rem;
|
||||
transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
|
||||
}
|
||||
|
||||
.translate-y-0 {
|
||||
--tw-translate-y: 0px;
|
||||
transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
|
||||
}
|
||||
|
||||
.rotate-12 {
|
||||
--tw-rotate: 12deg;
|
||||
transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
|
||||
|
|
@ -1547,16 +1533,6 @@ h6 {
|
|||
transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
|
||||
}
|
||||
|
||||
.scale-y-110 {
|
||||
--tw-scale-y: 1.1;
|
||||
transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
|
||||
}
|
||||
|
||||
.scale-y-125 {
|
||||
--tw-scale-y: 1.25;
|
||||
transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
|
||||
}
|
||||
|
||||
.transform {
|
||||
transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
|
||||
}
|
||||
|
|
@ -1796,10 +1772,6 @@ h6 {
|
|||
border-style: solid;
|
||||
}
|
||||
|
||||
.\!border-solid {
|
||||
border-style: solid !important;
|
||||
}
|
||||
|
||||
.border-dashed {
|
||||
border-style: dashed;
|
||||
}
|
||||
|
|
@ -1895,10 +1867,6 @@ h6 {
|
|||
background-color: rgb(58 65 111 / 0.1);
|
||||
}
|
||||
|
||||
.bg-slate-700\/50 {
|
||||
background-color: rgb(52 71 103 / 0.5);
|
||||
}
|
||||
|
||||
.bg-none {
|
||||
background-image: none;
|
||||
}
|
||||
|
|
@ -2308,6 +2276,11 @@ h6 {
|
|||
font-style: italic;
|
||||
}
|
||||
|
||||
.ordinal {
|
||||
--tw-ordinal: ordinal;
|
||||
font-variant-numeric: var(--tw-ordinal) var(--tw-slashed-zero) var(--tw-numeric-figure) var(--tw-numeric-spacing) var(--tw-numeric-fraction);
|
||||
}
|
||||
|
||||
.leading-default {
|
||||
line-height: 1.6;
|
||||
}
|
||||
|
|
@ -2751,11 +2724,6 @@ h6 {
|
|||
background-color: rgb(8 85 119 / 0.05);
|
||||
}
|
||||
|
||||
.hover\:bg-gray-200:hover {
|
||||
--tw-bg-opacity: 1;
|
||||
background-color: rgb(233 236 239 / var(--tw-bg-opacity));
|
||||
}
|
||||
|
||||
.hover\:bg-blue-500\/80:hover {
|
||||
background-color: rgb(94 114 228 / 0.8);
|
||||
}
|
||||
|
|
@ -2947,15 +2915,15 @@ h6 {
|
|||
background-color: rgb(5 17 57 / 0.3);
|
||||
}
|
||||
|
||||
.dark .dark\:bg-slate-700\/50 {
|
||||
background-color: rgb(52 71 103 / 0.5);
|
||||
}
|
||||
|
||||
.dark .dark\:bg-gray-800 {
|
||||
--tw-bg-opacity: 1;
|
||||
background-color: rgb(37 47 64 / var(--tw-bg-opacity));
|
||||
}
|
||||
|
||||
.dark .dark\:bg-slate-700\/50 {
|
||||
background-color: rgb(52 71 103 / 0.5);
|
||||
}
|
||||
|
||||
.dark .dark\:bg-gradient-to-r {
|
||||
background-image: linear-gradient(to right, var(--tw-gradient-stops));
|
||||
}
|
||||
|
|
@ -2987,22 +2955,6 @@ h6 {
|
|||
fill: #495057;
|
||||
}
|
||||
|
||||
.dark .dark\:stroke-slate-700 {
|
||||
stroke: #344767;
|
||||
}
|
||||
|
||||
.dark .dark\:stroke-gray-400 {
|
||||
stroke: #ced4da;
|
||||
}
|
||||
|
||||
.dark .dark\:stroke-gray-700 {
|
||||
stroke: #495057;
|
||||
}
|
||||
|
||||
.dark .dark\:stroke-gray-500 {
|
||||
stroke: #adb5bd;
|
||||
}
|
||||
|
||||
.dark .dark\:stroke-gray-600 {
|
||||
stroke: #6c757d;
|
||||
}
|
||||
|
|
@ -3117,11 +3069,6 @@ h6 {
|
|||
background-color: rgb(8 85 119 / 0.2);
|
||||
}
|
||||
|
||||
.dark .dark\:hover\:bg-slate-700:hover {
|
||||
--tw-bg-opacity: 1;
|
||||
background-color: rgb(52 71 103 / var(--tw-bg-opacity));
|
||||
}
|
||||
|
||||
.dark .dark\:hover\:bg-slate-700\/50:hover {
|
||||
background-color: rgb(52 71 103 / 0.5);
|
||||
}
|
||||
|
|
@ -3512,6 +3459,10 @@ h6 {
|
|||
right: 1.5rem;
|
||||
}
|
||||
|
||||
.xl\:col-span-4 {
|
||||
grid-column: span 4 / span 4;
|
||||
}
|
||||
|
||||
.xl\:ml-68 {
|
||||
margin-left: 17rem;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -21,27 +21,30 @@ class Menu {
|
|||
|
||||
class News {
|
||||
constructor() {
|
||||
this.BASE_URL = "https://www.staging.bunkerweb.io/";
|
||||
this.BASE_URL = "https://www.bunkerweb.io/";
|
||||
this.init();
|
||||
}
|
||||
|
||||
init() {
|
||||
window.addEventListener("load", async () => {
|
||||
try {
|
||||
const res = await fetch(
|
||||
"https://www.staging.bunkerweb.io/api/posts/0/2",
|
||||
{
|
||||
headers: {
|
||||
method: "GET",
|
||||
},
|
||||
}
|
||||
);
|
||||
return await this.render(res);
|
||||
} catch (err) {}
|
||||
window.addEventListener("load", () => {
|
||||
const res = fetch("https://www.bunkerweb.io/api/posts/0/1", {
|
||||
headers: {
|
||||
method: "GET",
|
||||
Accept: "application/json",
|
||||
"Content-Type": "application/json",
|
||||
},
|
||||
})
|
||||
.then((res) => {
|
||||
console.log("data");
|
||||
const data = res.data;
|
||||
console.log(data);
|
||||
this.render(res);
|
||||
})
|
||||
.catch((err) => console.log(err));
|
||||
});
|
||||
}
|
||||
|
||||
async render(lastNews) {
|
||||
render(lastNews) {
|
||||
const newsContainer = document.querySelector("[news-container]");
|
||||
//remove default message
|
||||
newsContainer.textContent = "";
|
||||
|
|
|
|||
|
|
@ -3,8 +3,8 @@ const plugin = require("tailwindcss/plugin");
|
|||
module.exports = {
|
||||
content: [
|
||||
"./templates/*.{html,js}",
|
||||
"./templates/components/*.{html,js}",
|
||||
"./static/js/*.js",
|
||||
"./static/js/utils/*.js",
|
||||
],
|
||||
|
||||
presets: [],
|
||||
|
|
|
|||
|
|
@ -2,7 +2,7 @@
|
|||
<!-- stats card -->
|
||||
<a
|
||||
href="https://github.com/bunkerity/bunkerweb"
|
||||
class="dark:brightness-110 max-h-none sm:max-h-28 hover:scale-102 transition col-span-12 sm:col-span-6 lg:col-span-4 flex p-4 justify-between w-full shadow-md break-words bg-white dark:bg-slate-850 dark:shadow-dark-xl rounded-2xl bg-clip-border"
|
||||
class="dark:brightness-110 max-h-none sm:max-h-28 hover:scale-102 transition col-span-12 md:col-span-6 2xl:col-span-4 flex p-4 justify-between w-full shadow-md break-words bg-white dark:bg-slate-850 dark:shadow-dark-xl rounded-2xl bg-clip-border"
|
||||
>
|
||||
<!-- text -->
|
||||
<div>
|
||||
|
|
@ -54,7 +54,7 @@
|
|||
<!-- stats card -->
|
||||
<a
|
||||
href="{% if current_endpoint == 'instances' %}javascript:void(0){% else %}loading?next={{ url_for('instances') }}{% endif %}"
|
||||
class="dark:brightness-110 max-h-none sm:max-h-28 hover:scale-102 transition col-span-12 sm:col-span-6 lg:col-span-4 flex p-4 justify-between w-full shadow-md break-words bg-white dark:bg-slate-850 dark:shadow-dark-xl rounded-2xl bg-clip-border"
|
||||
class="dark:brightness-110 max-h-none sm:max-h-28 hover:scale-102 transition col-span-12 md:col-span-6 2xl:col-span-4 flex p-4 justify-between w-full shadow-md break-words bg-white dark:bg-slate-850 dark:shadow-dark-xl rounded-2xl bg-clip-border"
|
||||
>
|
||||
<!-- text -->
|
||||
<div>
|
||||
|
|
@ -93,7 +93,7 @@
|
|||
<!-- stats card -->
|
||||
<a
|
||||
href="{% if current_endpoint == 'services' %}javascript:void(0){% else %}loading?next={{ url_for('services') }}{% endif %}"
|
||||
class="dark:brightness-110 max-h-none sm:max-h-28 hover:scale-102 transition col-span-12 sm:col-span-6 lg:col-span-4 flex p-4 justify-between w-full shadow-md break-words bg-white dark:bg-slate-850 dark:shadow-dark-xl rounded-2xl bg-clip-border"
|
||||
class="dark:brightness-110 max-h-none sm:max-h-28 hover:scale-102 transition col-span-12 md:col-span-6 2xl:col-span-4 flex p-4 justify-between w-full shadow-md break-words bg-white dark:bg-slate-850 dark:shadow-dark-xl rounded-2xl bg-clip-border"
|
||||
>
|
||||
<!-- text -->
|
||||
<div>
|
||||
|
|
@ -140,7 +140,7 @@
|
|||
<!-- stats card-->
|
||||
<a
|
||||
href="{% if current_endpoint == 'services' %}javascript:void(0){% else %}loading?next={{ url_for('services') }}{% endif %}"
|
||||
class="dark:brightness-110 max-h-none sm:max-h-28 h-full hover:scale-102 transition col-span-12 sm:col-span-6 lg:col-span-4 flex p-4 justify-between w-full shadow-md break-words bg-white dark:bg-slate-850 dark:shadow-dark-xl rounded-2xl bg-clip-border"
|
||||
class="dark:brightness-110 max-h-none sm:max-h-28 h-full hover:scale-102 transition col-span-12 md:col-span-6 2xl:col-span-4 flex p-4 justify-between w-full shadow-md break-words bg-white dark:bg-slate-850 dark:shadow-dark-xl rounded-2xl bg-clip-border"
|
||||
>
|
||||
<!-- text -->
|
||||
<div>
|
||||
|
|
|
|||
|
|
@ -118,7 +118,7 @@ include "plugins-modal.html" %}
|
|||
<!-- filter -->
|
||||
<div
|
||||
{{current_endpoint}}-filter
|
||||
class="p-4 col-span-12 md:col-span-6 2xl:col-span-4 relative min-w-0 break-words bg-white shadow-xl dark:bg-slate-850 dark:shadow-dark-xl rounded-2xl bg-clip-border"
|
||||
class="p-4 col-span-12 2xl:col-span-4 relative min-w-0 break-words bg-white shadow-xl dark:bg-slate-850 dark:shadow-dark-xl rounded-2xl bg-clip-border"
|
||||
>
|
||||
<h5 class="mb-2 font-bold dark:text-white">FILTER</h5>
|
||||
<div class="grid grid-cols-12 gap-x-4 gap-y-2">
|
||||
|
|
|
|||
Loading…
Reference in New Issue