Update error page again

This commit is contained in:
Andrew Kingston 2023-10-31 09:48:19 +00:00
parent e103e6b85b
commit 3162d45c5e
1 changed files with 18 additions and 17 deletions

View File

@ -57,8 +57,8 @@
--spectrum-global-color-gray-600: rgb(144,144,144); --spectrum-global-color-gray-600: rgb(144,144,144);
--spectrum-global-color-gray-900: rgb(255,255,255); --spectrum-global-color-gray-900: rgb(255,255,255);
--spectrum-global-color-gray-800: rgb(227,227,227); --spectrum-global-color-gray-800: rgb(227,227,227);
--spectrum-global-color-static-blue-600: rgb(20,115,230); --bb-indigo: #6E56FF;
--spectrum-global-color-static-blue-hover: rgb( 18, 103, 207); --bb-indigo-light: #9F8FFF;
} }
html, body { html, body {
@ -90,15 +90,8 @@
.info { .info {
display: flex; display: flex;
flex-direction: column; flex-direction: column;
align-items: left; align-items: flex-start;
} }
@media only screen and (max-width: 600px) {
.info {
align-items: center;
}
}
.status { .status {
color: var(--spectrum-global-color-gray-600) color: var(--spectrum-global-color-gray-600)
} }
@ -113,13 +106,14 @@
.buttons { .buttons {
display: flex; display: flex;
flex-direction: row; flex-direction: row;
justify-content: flex-start;
margin-top: 15px; margin-top: 15px;
} }
.homeButton { .homeButton {
background-color: var(--spectrum-global-color-static-blue-600); background-color: var(--bb-indigo);
} }
.homeButton:hover { .homeButton:hover {
background-color: var(--spectrum-global-color-static-blue-hover); background-color: var(--bb-indigo-light);
} }
.statusButton { .statusButton {
background-color: transparent; background-color: transparent;
@ -127,8 +121,8 @@
border: none; border: none;
} }
.hero { .hero {
height: 72px; height: 60px;
margin-right: 40px; margin: 10px 40px 10px 0;
} }
.hero img { .hero img {
height: 100%; height: 100%;
@ -138,11 +132,19 @@
flex-direction: row; flex-direction: row;
align-items: center; align-items: center;
justify-content: center; justify-content: center;
padding: 0 40px;
}
h1 {
margin-bottom: 10px;
}
h3 {
margin-top: 0;
} }
@media only screen and (max-width: 600px) { @media only screen and (max-width: 600px) {
.content { .content {
flex-direction: column; flex-direction: column;
align-items: flex-start;
} }
} }
</style> </style>
@ -158,12 +160,11 @@
</div> </div>
<div class="info"> <div class="info">
<div> <div>
<h4 id="status" class="status"></h4> <h4 id="status" class="status">&nbsp;</h4>
<h1 class="title"> <h1 class="title">
Houston we have a problem! Houston we have a problem!
</h1> </h1>
<h3 id="message" class="message"> <h3 id="message" class="message">&nbsp;</h3>
</h3>
</div> </div>
<div class="buttons"> <div class="buttons">
<button class="homeButton" onclick=goHome()>Return home</button> <button class="homeButton" onclick=goHome()>Return home</button>