FunctionalHacker/hugo-toha
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

migrate 404 css to bundle

Browse source
This commit is contained in:
Aaron Qian 2022-11-14 15:19:05 -08:00 • committed by Aaron Qian
parent f425c04ab3
commit bc5baf8277
No known key found for this signature in database
GPG key ID: BF1A987C395B5B0E
4 changed files with 96 additions and 97 deletions
Download patch file Download diff file Expand all files Collapse all files

1
assets/styles/application.template.scss
View file

@ -14,6 +14,7 @@
@import './layouts/list';
@import './layouts/single';
@import './layouts/notes';
@import './layouts/404';
// navigators
@import './navigators/navbar';

95
assets/styles/layouts/404.scss Normal file
View file

@ -0,0 +1,95 @@
body.kind-404 {
.navbar-toggler {
display: none;
}
.notFound {
padding-top: 5rem;
text-align: center;
padding-bottom: 8rem;
}
.notFound img {
height: 500px;
}
.notFound h1 {
font-style: italic;
}
.notFound .message {
position: absolute;
max-width: 20rem;
top: 40%;
left: 30%;
}
/* ============= Device specific fixes ======= */
/* Large screens such as TV */
@media only screen and (min-width: 1824px) {
}
/* Extra large devices (large desktops, 1200px and up) */
@media (max-width: 1400px) {
}
@media (max-width: 1200px) {
.notFound .message {
top: 50%;
left: 25%;
}
}
/* IPad Pro */
@media (max-width: 1024px) {
}
/* Large devices (desktops, 992px and up) */
@media (max-width: 992px) {
.notFound .message {
top: 46%;
left: 25%;
}
}
/* Medium devices (tablets, 768px and up) */
@media only screen and (max-width: 768px) {
.notFound img {
height: 400px;
}
.notFound .message {
top: 20rem;
left: 4rem;
}
}
/* Small devices (landscape phones, 576px and up) */
@media only screen and (max-width: 576px) {
.notFound img {
height: 250px;
}
.notFound .message {
top: 20rem;
left: 2rem;
}
}
/* iPhoneX, iPhone 6,7,8 */
@media only screen and (max-width: 375px) {
}
/* Galaxy S5, Moto G4 */
@media only screen and (max-width: 360px) {
}
/* iPhone 5 or before */
@media only screen and (max-width: 320px) {
}
}

4
layouts/404.html
View file

@ -1,7 +1,3 @@
{{ define "header" }}
<link rel="stylesheet" href="{{ "/css/404.css" | relURL }}">
{{ end }}
{{ define "navbar" }}
{{ partial "navigators/navbar-2.html" (dict "baseURL" site.BaseURL "title" site.Title "hasToggleButton" false) }}
{{ end }}

93
static/css/404.css
View file

@ -1,93 +0,0 @@
.navbar-toggler {
display: none;
}
.notFound {
padding-top: 5rem;
text-align: center;
padding-bottom: 8rem;
}
.notFound img {
height: 500px;
}
.notFound h1 {
font-style: italic;
}
.notFound .message {
position: absolute;
max-width: 20rem;
top: 40%;
left: 30%;
}
/* ============= Device specific fixes ======= */
/* Large screens such as TV */
@media only screen and (min-width: 1824px) {
}
/* Extra large devices (large desktops, 1200px and up) */
@media (max-width: 1400px) {
}
@media (max-width: 1200px) {
.notFound .message {
top: 50%;
left: 25%;
}
}
/* IPad Pro */
@media (max-width: 1024px) {
}
/* Large devices (desktops, 992px and up) */
@media (max-width: 992px) {
.notFound .message {
top: 46%;
left: 25%;
}
}
/* Medium devices (tablets, 768px and up) */
@media only screen and (max-width: 768px) {
.notFound img {
height: 400px;
}
.notFound .message {
top: 20rem;
left: 4rem;
}
}
/* Small devices (landscape phones, 576px and up) */
@media only screen and (max-width: 576px) {
.notFound img {
height: 250px;
}
.notFound .message {
top: 20rem;
left: 2rem;
}
}
/* iPhoneX, iPhone 6,7,8 */
@media only screen and (max-width: 375px) {
}
/* Galaxy S5, Moto G4 */
@media only screen and (max-width: 360px) {
}
/* iPhone 5 or before */
@media only screen and (max-width: 320px) {
}