cl-deck-builder2/templates/workbench/pure.html

45 lines
989 B
HTML
Raw Permalink Normal View History

2024-01-21 02:35:35 -05:00
{% extends "layouts/minimal.html" %}
{% block title %}{_ "Workbench" _}{% endblock %}
{% block content %}
<style>
body, html {
overflow: hidden;
}
body {
background: linear-gradient(-45deg, #ee7752, #e73c7e, #23a6d5, #23d5ab);
background-size: 400% 400%;
animation: gradient 15s ease infinite;
height: 100vh;
}
@keyframes gradient {
0% {
background-position: 0% 50%;
}
50% {
background-position: 100% 50%;
}
100% {
background-position: 0% 50%;
}
}
</style>
<section class="hero">
<div class="hero-body">
<p class="title">
Pure CSS Gradient Background Animation
</p>
<p class="subtitle">
<a href="https://manuel.pinto.dev" class="text-decoration-none">
Pen by Manuel Pinto
</a>
</p>
<p class="subtitle">
<a href="https://codepen.io/P1N2O/full/pyBNzX">
Source Code
</a>
</p>
</div>
</section>
{% endblock %}