Move wire background inline css to dedicated css file

This commit is contained in:
Aroy-Art 2024-06-05 22:27:56 +02:00
parent 39d7f64ccf
commit 42cecd1a96
Signed by: Aroy
GPG key ID: DB9689E9391DD156
2 changed files with 43 additions and 37 deletions

View file

@ -32,43 +32,6 @@
<!-- Specific Page CSS goes HERE --> <!-- Specific Page CSS goes HERE -->
{% block stylesheets %}{% endblock stylesheets %} {% block stylesheets %}{% endblock stylesheets %}
<style>
@keyframes gradient {
0% {background-position: 0% 50%;}
50% {background-position: 0% 0%;}
100% {background-position: 0% 50%;}
}
@keyframes wiremove {
0% {background-position: 0px 0px;}
100% {background-position: 0px 1500px;}
}
body{
color:#ffffff;
margin:0px;
background: linear-gradient(0deg, #9e14d0, #e73c7e, #23a6d5, #23d5ab, #23a6d5, #e73c7e, #9e14d0);
background-size: 100% 800%;
background-attachment:fixed;
animation: gradient 25s ease infinite;
}
.everything{
height: 100vh;
display: flex;
flex-flow: column;
}
.wires{
background-image: url( '{% static "/img/bg/wire-bg.png" %}');
background-attachment:fixed;
padding: 7rem 0;
animation: wiremove 44s linear infinite;
text-align:center;
flex: 1 1 auto;
}
</style>
</head> </head>
<body class="{% block body_class %}{% endblock body_class %}" hx-header='{% block hx_header %}{% endblock hx_header %} {"X-CSRFToken": "{{ csrf_token }}"}'> <body class="{% block body_class %}{% endblock body_class %}" hx-header='{% block hx_header %}{% endblock hx_header %} {"X-CSRFToken": "{{ csrf_token }}"}'>
<div class="everything"> <div class="everything">
@ -103,5 +66,9 @@
<script src='{% static "js/main.js" %}'></script> <script src='{% static "js/main.js" %}'></script>
{% include "includes/scripts.html" %} {% include "includes/scripts.html" %}
<!-- Specific Page JS goes HERE -->
{% block scripts %}{% endblock scripts %}
</body> </body>
</html> </html>

View file

@ -130,6 +130,45 @@
--bs-form-invalid-border-color: #dc3545; --bs-form-invalid-border-color: #dc3545;
} */ } */
/*=================================================================
Electric container style
=================================================================*/
@keyframes gradient {
0% {background-position: 0% 50%;}
50% {background-position: 0% 0%;}
100% {background-position: 0% 50%;}
}
@keyframes wiremove {
0% {background-position: 0px 0px;}
100% {background-position: 0px 1500px;}
}
body{
/*! color:#ffffff; */
margin:0px;
background: linear-gradient(0deg, #9e14d0, #e73c7e, #23a6d5, #23d5ab, #23a6d5, #e73c7e, #9e14d0);
background-size: 100% 800%;
background-attachment:fixed;
animation: gradient 25s ease infinite;
}
.everything{
height: 100vh;
display: flex;
flex-flow: column;
}
.wires{
background-image: url( "/static/img/bg/wire-bg.png");
background-attachment:fixed;
padding: 7rem 0;
animation: wiremove 44s linear infinite;
/*! text-align:center; */
flex: 1 1 auto;
}
/*================================================================= /*=================================================================
Electric container style Electric container style
=================================================================*/ =================================================================*/