fred.boniface/fredboniface.co.uk
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Add new sizes for index header image

Browse Source
This commit is contained in:
Fred Boniface 2022-10-20 21:21:53 +01:00
parent d086e2f0df
commit f1dfed80b3
11 changed files with 9 additions and 2 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

BIN
images/headers/index/index_1024.webp Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 84 KiB

BIN
images/headers/index/index_1920.webp Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 252 KiB

BIN
images/headers/index/index_2800.webp Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 881 KiB

BIN
images/headers/index/index_360.webp Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 12 KiB

BIN
images/headers/index/index_400.webp Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 16 KiB

BIN
images/headers/index/index_4096.webp Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 1.6 MiB

BIN
images/headers/index/index_480.webp Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 24 KiB

BIN
images/headers/index/index_810.webp Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 52 KiB

0
images/headers/index/index_w750.jpg → images/headers/index/index_full.jpg
View File

Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 14 MiB

After

Width:  |  Height:  |  Size: 14 MiB

BIN
images/headers/index/index_orig.jpg
View File

Binary file not shown.
Side by Side

Before

Width:  |  Height:  |  Size: 17 MiB

11
style/new_style.css
View File

@ -7,9 +7,9 @@ body {
background-color: lightslategrey; background-color: lightslategrey;
} }
/* PAGE HEADER */ /* PAGE HEADER */
#header_image_home { /* Try z-index: -1; to have content scrolling over - margins will need adjusting */ #header_image_home {
background-color: rgb(29,49,49); background-color: rgb(29,49,49);
background-image: url("/images/headers/index/index_w750.jpg"); background-image: url("/images/headers/index/index_360.webp");
background-repeat: no-repeat; background-repeat: no-repeat;
background-position: top; background-position: top;
background-size: cover; background-size: cover;
@ -21,6 +21,13 @@ body {
position: sticky; position: sticky;
top: -145px; top: -145px;
} }
@media(min-width: 361px){#header_image_home{background-image:url("/images/headers/index/index_400.webp")}}
@media(min-width: 401px){#header_image_home{background-image:url("/images/headers/index/index_480.webp")}}
@media(min-width: 481px){#header_image_home{background-image:url("/images/headers/index/index_810.webp")}}
@media(min-width: 811px){#header_image_home{background-image:url("/images/headers/index/index_1024.webp")}}
@media(min-width: 1025px){#header_image_home{background-image:url("/images/headers/index/index_1920.webp")}}
@media(min-width: 1921px){#header_image_home{background-image:url("/images/headers/index/index_2800.webp")}}
@media(min-width: 2801px){#header_image_home{background-image:url("/images/headers/index/index_4096.webp")}}
#page_title { /* This may be best floating above content div rather than inside header div */ #page_title { /* This may be best floating above content div rather than inside header div */
background-color: #2f4f4f8f; background-color: #2f4f4f8f;
font-family: sans-serif; font-family: sans-serif;