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

Compare commits

base: fred.boniface:8dc5b0ebe532e6bc4fd51328f2307b0091dfb32e
Branches Tags
fred.boniface:master
fred.boniface:testing
...
compare: fred.boniface:a2b1dc0e939a1fb13889fa46cb3d65f3271d1f52
Branches Tags
fred.boniface:master
fred.boniface:testing

2 Commits
8dc5b0ebe5 ... a2b1dc0e93

Author SHA1 Message Date
Fred Boniface a2b1dc0e93 Various 2022-10-19 11:51:07 +01:00
Fred Boniface 4de0e362ce Various changes 2022-10-19 11:51:03 +01:00
3 changed files with 38 additions and 32 deletions
Show Stats Expand all files Collapse all files

28
new_index.html
View File

@ -13,35 +13,35 @@
<body>
<div class="header-image-home">
<div class="page-title">
<h1>Fred Boniface</h1>
<h1>Page Title</h1>
</div>
</div>
<div class="menubar">
<div id="menubar">
<script src="/js/navbar.js"></script>
<div class="menubar_logo">
<div id="menubar_logo">
<picture>
<source srcset="/images/logo/full-60.webp" type="image/webp">
<img src="/images/logo/full-60.png" alt="Fred Boniface logo">
</picture>
</div>
<div class="menubar_hamburger">
<button id="sidebar_open_short" class="sidebar_open_short" onclick="sidebarOpen()">&#9776;</button>
<button class="sidebar_open_long" onclick="sidebarOpen()">Menu &#9776;</button>
<button id="sidebar_close_short" class="sidebar_close_short" onclick="sidebarClose()">&times;</button>
<button class="sidebar_close_long" onclick="sidebarClose()">Close &times;</button>
<div id="menubar_hamburger">
<button id="sidebar_open_short" onclick="sidebarOpen()">&#9776;</button>
<button id="sidebar_close_short" onclick="sidebarClose()">&times;</button>
</div>
</div>
<div id="sidebar" class="sidebar">
<div id="sidebar">
<a href="/">Home</a>
<a href="/gpg.php">GPG/PGP</a>
<a href="/projects.php">Things I Do</a>
<a href="/contact.php">Contact</a>
<a href="/about.php">About</a>
<picture>
<source srcset="/images/logo/short-40.jxl" type="image/jxl">
<img src="/images/logo/short-40.png" alt="FB Initials">
</picture>
<div class="sidebar_social">
<div id="sidebar_logo">
<picture>
<source srcset="/images/logo/short-40.jxl" type="image/jxl">
<img src="/images/logo/short-40.png" alt="FB Initials">
</picture>
</div>
<div id="sidebar_social">
SOCIAL_LINKS
</div>
</div>

33
style/new_menu.css
View File

@ -1,4 +1,4 @@
.menubar {
#menubar {
background-color: darkslategrey;
color: azure;
position: fixed;
@ -8,40 +8,37 @@
height: 40px;
}
.menubar_logo img {
max-width: 13%;
padding: 5px;
#menubar_logo img {
max-width: 20px;
padding: 10px;
}
.menubar_hamburger {
#menubar_hamburger {
position: absolute;
top: 2px;
right: 0;
padding: 5px;
}
.sidebar_open_long {display: none;}
.sidebar_close_long {display: none;}
.sidebar_open_short {
#sidebar_open_short {
display: block;
font-size: larger;
background-color: slategrey;
background-color: transparent;
color: azure;
border: none;
border-radius: 2px;
}
.sidebar_close_short {
#sidebar_close_short {
display: none;
font-size: larger;
background-color: slategrey;
background-color: transparent;
color: azure;
border: none;
border-radius: 2px;
}
.sidebar {
#sidebar {
position: fixed;
top: 40px;
right: 0;
@ -54,7 +51,7 @@
transition: 0.7s;
}
.sidebar a {
#sidebar a {
padding: 8px 8px 8px 8px;
margin-left: 20px;
margin-top: 10px;
@ -67,14 +64,18 @@
display: block;
}
.sidebar_social {
#sidebar_logo {
}
#sidebar_social {
position: absolute;
bottom: 50px;
width: 100%;
}
@media screen and (min-width: 800px) {
.menubar {
#menubar {
position: -webkit-sticky;
position: sticky;
top: 0px;

9
style/new_style.css
View File

@ -8,9 +8,10 @@ body {
.header-image-home {
background-image: url(https://via.placeholder.com/375x335webp);
min-height: 50%;
min-height: 40%;
max-height: 45%;
width: 100%;
position: fixed;
position: fixed; /* Try setting this to relative and .page-title to absolute */
top: 40px;
left: 0;
}
@ -23,3 +24,7 @@ body {
box-shadow: 3px;
color: azure;
}
.content {
margin-top: 95%;
}