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

Attempt

This commit is contained in:
Fred Boniface 2022-10-29 21:09:16 +01:00
parent 53807d6843
commit 9722c3eb49
3 changed files with 11 additions and 11 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
page-blocks/head-img.php
View File

@ -1,4 +1,4 @@
<div class="header_image" id="header_index"> <!-- id needs to match $page_title and CSS adjusting -->
<div class="header_image" id="<?php echo $page_title; ?>">
<div id="page_title" class="hide_micro">
<?php
@ -6,6 +6,6 @@ global $page_title;
if (strcmp($page_title, 'home') == 0){
include "./php/head-img-face.php";
} ?>
<h1><?php echo ucwords($page_title); ?></h1> <!-- Apply Title Case To This Output -->
<h1><?php echo ucwords($page_title); ?></h1>
</div>
</div>

2
page-blocks/head.php
View File

@ -4,5 +4,5 @@
<meta name="author" content="Frederick Boniface">
<link rel="icon" type="image/png" href="/images/favicon.png">
<link rel="stylesheet" href="/style/new_style.css">
<title><?php echo $page_title ?></title> <!-- Apply Title Case To This Output -->
<title><?php echo ucwords($page_title); ?></title> <!-- Apply Title Case To This Output -->
</head>

16
style/new_style.css
View File

@ -59,14 +59,14 @@ body {
position: sticky;
top: -145px;
}
#header_index{background-color: #a04911} /* Try using image-set() here to offer different formats */
@media(min-width: 50px){#header_index{background-image:url("/images/headers/index/300.webp")}}
@media(min-width: 301px){#header_index{background-image:url("/images/headers/index/500.webp")}}
@media(min-width: 501px){#header_index{background-image:url("/images/headers/index/800.webp")}}
@media(min-width: 801px){#header_index{background-image:url("/images/headers/index/1024.webp")}}
@media(min-width:1025px){#header_index{background-image:url("/images/headers/index/1920.webp")}}
@media(min-width:1921px){#header_index{background-image:url("/images/headers/index/2800.webp")}}
@media(min-width:2801px){#header_index{background-image:url("/images/headers/index/4096.webp")}}
#home{background-color: #a04911} /* Try using image-set() here to offer different formats */
@media(min-width: 50px){#home{background-image:url("/images/headers/index/300.webp")}}
@media(min-width: 301px){#home{background-image:url("/images/headers/index/500.webp")}}
@media(min-width: 501px){#home{background-image:url("/images/headers/index/800.webp")}}
@media(min-width: 801px){#home{background-image:url("/images/headers/index/1024.webp")}}
@media(min-width:1025px){#home{background-image:url("/images/headers/index/1920.webp")}}
@media(min-width:1921px){#home{background-image:url("/images/headers/index/2800.webp")}}
@media(min-width:2801px){#home{background-image:url("/images/headers/index/4096.webp")}}
#header_face {
display: flex;
position: absolute;