Adds include the following,
– Change all text from upper to lower case and vice versa (Table View Only)
– Add a continuous image border
– Change page background color
– Change your navbar background color
– Add a vertical stack navigation icon w/fixed scroll (you can change color, add image or text and a url link), add the following scripts to your header-extras.php
<style>
body{
background-color: #BBCCB6;
text-align: left;
text-transform: uppercase;
background-image: url("hooks/1.png");
background-repeat: repeat-y;
margin-top: 0px;
padding:0px;
}
.navbar {
background-color: #000027;
font-family: Arial, Helvetica, sans-serif;
}
.dropdown-content a {
float: none;
color: black;
padding: 12px 16px;
display: block;
text-align: left;
}
.dropdown:hover
.dropdown-content {
display: block;
}
</style><meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
<style>
body {margin:0;height:2000px;}
.icon-bar {
position: fixed;
top: 34%;
margin-left: -78px;
-webkit-transform: translateY(-50%);
-ms-transform: translateY(-50%);
transform: translateY(-50%);
}
.icon-bar a {
display: block;
text-align: center;
padding: 16px;
transition: all 0.3s ease;
color: white;
font-size: 20px;
}
.icon-bar a:hover {
background-color: #ff902a;
}
.icon1{
background: #657262;
color: white;
}
.icon2 {
background: #8D8D8D;
color: white;
}
.icon3 {
background: #657262;
color: white;
}
.icon4 {
background: #8D8D8D;
color: white;
}
.icon5 {
background: #657262;
color: white;
}
.content {
margin-left: 70px;
font-size: 12px;
}
</style>
<body>
<div class="icon-bar">
<a href="https://www.google.com" class="icon1"><img src="hooks/2.png"></a>
<a href="#" class="icon2"><img src="hooks/3.png"></a>
<a href="#" class="icon3"><img src="hooks/4.png"></a>
<a href="#" class="icon4"><img src="hooks/3.png"></a>
<a href="#" class="icon5"><img src="hooks/4.png"></a>
</div>