deblan/deblan.io-murph
deblan/deblan.io-murph
1
0
Fork 0
Code Issues Pull requests 1 Projects Releases Wiki Activity

update error page

Browse source
This commit is contained in:
Simon Vieille 2021-11-30 21:48:40 +01:00
parent b7faeba55f
commit 7ab5941448
2 changed files with 45 additions and 113 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

1
.env
View file

@ -36,4 +36,3 @@ MAILER_URL=null://localhost
ASSET_BASE_URL=null
UMAMI_URL=null
GIPHY_API_KEY=null

157
templates/bundles/TwigBundle/Exception/error.html.twig
View file

@ -18,125 +18,58 @@ XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX
<head>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta charset="UTF-8" />
<style>
html, body {
margin: 0;
padding: 0;
overflow: hidden;
}
body {
background-size: cover;
background-color: #000;
color: #fff;
font-family: Verdana;
font-weight: bold;
text-shadow: 1px 1px 2px #333;
}
#code {
font-size: 60px;
}
#message {
font-size: 40px;
padding-top: 20px;
}
#background-1 {
position: absolute;
width: 100%;
height: 100vh;
-webkit-filter: blur(10px);
-o-filter: blur(10px);
-ms-filter: blur(10px);
filter: blur(10px);
background-size: cover;
background-position: center center;
}
#background-2 {
text-align: center;
width: 100%;
position: absolute;
}
#background-2 img {
height: 100vh;
}
#content {
position: absolute;
padding: 30px;
}
a {
margin-top: 40px;
padding: 20px;
font-size: 20px;
border: 1px solid #fff;
color: #fff;
display: inline-block;
text-decoration: none;
}
#giphy-logo {
width: 200px;
height: 42px;
background: url({{ asset('build/images/giphy-logo.png') }});
position: absolute;
bottom: 10px;
right: 10px;
}
</style>
<title>Erreur {% block code %}{% endblock %}</title>
{% block css %}
{{ encore_entry_link_tags('app') }}
<style>
.content {
width: 100%;
}
.header {
min-height: 100vh;
background: linear-gradient(180deg, #434343, #353535);
}
.header-wrapper {
position: relative;
z-index: 100;
}
</style>
{% endblock %}
<link rel="alternate" type="application/rss+xml" title="Flux RSS" href="{{ safe_url('blog_network_rss') }}">
</head>
<body>
<div class="page" data-grid="va-stretch">
<div class="content">
<div class="grid">
<div class="col-12 header">
<div id="particles"></div>
<div id="background-1"></div>
<!-- <div id="background-2"><img src="{{ asset('build/images/blank.png') }}"></div> -->
<div id="content">
<div id="code">
Erreur {{ block('code') }}
<div class="header-wrapper">
<div class="h1">
Erreur {{ block('code') }}
</div>
<div class="h3">
{% block error %}{% endblock %}
</div>
<hr>
<div style="margin-top: 40px">
<a class="button" href="/">Retour sur le blog</a>
</div>
</div>
</div>
</div>
</div>
</div>
<div id="message">
{% block error %}{% endblock %}
<br><a href="/">Aller sur le blog</a>
</div>
</div>
<div id="giphy-logo"></div>
<script>
const giphy = {
baseURL: 'https://api.giphy.com/v1/gifs/',
apiKey: '{{ setting('giphy_api_key') }}',
tag: '{% block tag %}error{% endblock %}',
type: 'random',
rating: 'pg-13'
};
const background1 = document.querySelector('#background-1');
// const background2 = document.querySelector('#background-2 img');
const giphyURL = encodeURI(giphy.baseURL + giphy.type + '?api_key=' + giphy.apiKey + '&tag=' + giphy.tag + '&rating=' + giphy.rating);
const httpRequest = new XMLHttpRequest();
httpRequest.onreadystatechange = function(data) {
if (httpRequest.readyState === 4 && httpRequest.status === 200) {
const json = JSON.parse(httpRequest.response);
const url = json.data.image_original_url;
background1.style.backgroundImage = 'url(' + url + ')';
// background2.src = url;
}
};
httpRequest.open('GET', giphyURL);
httpRequest.send();
</script>
{% block js %}
{{ encore_entry_script_tags('app') }}
{% endblock %}
</body>
</html>
{% endapply %}