fix 404 page, add dashed grid bg
This commit is contained in:
@@ -17,3 +17,53 @@
|
|||||||
#ff637e 120%
|
#ff637e 120%
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.dashed-bottom-fade-grid {
|
||||||
|
position: absolute;
|
||||||
|
inset: 0;
|
||||||
|
z-index: 0;
|
||||||
|
|
||||||
|
background-image:
|
||||||
|
linear-gradient(to right, #e7e5e4 1px, transparent 1px),
|
||||||
|
linear-gradient(to bottom, #e7e5e4 1px, transparent 1px);
|
||||||
|
background-size: 20px 20px;
|
||||||
|
background-position:
|
||||||
|
0 0,
|
||||||
|
0 0;
|
||||||
|
|
||||||
|
mask-image:
|
||||||
|
repeating-linear-gradient(
|
||||||
|
to right,
|
||||||
|
black 0px,
|
||||||
|
black 3px,
|
||||||
|
transparent 3px,
|
||||||
|
transparent 8px
|
||||||
|
),
|
||||||
|
repeating-linear-gradient(
|
||||||
|
to bottom,
|
||||||
|
black 0px,
|
||||||
|
black 3px,
|
||||||
|
transparent 3px,
|
||||||
|
transparent 8px
|
||||||
|
),
|
||||||
|
radial-gradient(ellipse 100% 80% at 50% 100%, #000 50%, transparent 90%);
|
||||||
|
-webkit-mask-image:
|
||||||
|
repeating-linear-gradient(
|
||||||
|
to right,
|
||||||
|
black 0px,
|
||||||
|
black 3px,
|
||||||
|
transparent 3px,
|
||||||
|
transparent 8px
|
||||||
|
),
|
||||||
|
repeating-linear-gradient(
|
||||||
|
to bottom,
|
||||||
|
black 0px,
|
||||||
|
black 3px,
|
||||||
|
transparent 3px,
|
||||||
|
transparent 8px
|
||||||
|
),
|
||||||
|
radial-gradient(ellipse 100% 80% at 50% 100%, #000 50%, transparent 90%);
|
||||||
|
|
||||||
|
mask-composite: intersect;
|
||||||
|
-webkit-mask-composite: source-in;
|
||||||
|
}
|
||||||
|
|||||||
@@ -1,14 +1,21 @@
|
|||||||
{% extends "base.html" %} {# # # # # # # # # # # # # # # # # # # # # # # # # #}
|
{% extends "base.html" %} {# # # # # # # # # # # # # # # # # # # # # # # # # #}
|
||||||
{% block title %}gractwo.pl | Błąd 404{% endblock %} {% block pagecontent %}
|
{% block title %}gractwo.pl | Błąd 404{% endblock %} {% block pagecontent %}
|
||||||
|
|
||||||
<div class="mx-auto my-auto sm:flex gap-2">
|
<div class="w-full h-full flex-1 flex justify-center items-center relative">
|
||||||
<div class="size-16 pl-2 sm:pl-0">{% include "gractwo.svg" %}</div>
|
<div class="dashed-bottom-fade-grid w-full h-full z-10"></div>
|
||||||
<div class="px-2">
|
<div class="sm:flex gap-2 z-20">
|
||||||
<h1 class="font-bold text-2xl">Błąd 404</h1>
|
<div class="[&>svg]:size-16 pl-2 sm:pl-0">
|
||||||
<p>
|
{% include "gractwo.svg" %}
|
||||||
Nie ma strony o podanym adresie.
|
</div>
|
||||||
<a class="text-gractwo-blu-dark hover:underline" href="/">Wróć.</a>
|
<div class="px-2">
|
||||||
</p>
|
<h1 class="font-bold text-2xl">Błąd 404</h1>
|
||||||
|
<p>
|
||||||
|
Nie ma strony o podanym adresie.
|
||||||
|
<a class="text-gractwo-blu-dark hover:underline" href="/"
|
||||||
|
>Wróć.</a
|
||||||
|
>
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
|||||||
Reference in New Issue
Block a user