update error page
This commit is contained in:
parent
b7faeba55f
commit
7ab5941448
1
.env
1
.env
|
@ -36,4 +36,3 @@ MAILER_URL=null://localhost
|
||||||
|
|
||||||
ASSET_BASE_URL=null
|
ASSET_BASE_URL=null
|
||||||
UMAMI_URL=null
|
UMAMI_URL=null
|
||||||
GIPHY_API_KEY=null
|
|
||||||
|
|
|
@ -18,125 +18,58 @@ XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX
|
||||||
<head>
|
<head>
|
||||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||||
<meta charset="UTF-8" />
|
<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>
|
<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>
|
</head>
|
||||||
<body>
|
<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 class="header-wrapper">
|
||||||
<!-- <div id="background-2"><img src="{{ asset('build/images/blank.png') }}"></div> -->
|
<div class="h1">
|
||||||
|
Erreur {{ block('code') }}
|
||||||
<div id="content">
|
</div>
|
||||||
<div id="code">
|
<div class="h3">
|
||||||
Erreur {{ block('code') }}
|
{% 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>
|
||||||
|
|
||||||
<div id="message">
|
{% block js %}
|
||||||
{% block error %}{% endblock %}
|
{{ encore_entry_script_tags('app') }}
|
||||||
|
{% 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>
|
|
||||||
</body>
|
</body>
|
||||||
</html>
|
</html>
|
||||||
{% endapply %}
|
{% endapply %}
|
||||||
|
|
Loading…
Reference in a new issue