updated menu configs and dark mode tweaks
This commit is contained in:
parent
97cf9cb1a0
commit
abc5cb369d
63
header.php
63
header.php
@ -36,16 +36,41 @@
|
||||
|
||||
|
||||
|
||||
<style>#panel {
|
||||
padding: 5px;
|
||||
text-align: center;
|
||||
background-color: #e5eecc;
|
||||
border: solid 1px #c3c3c3;
|
||||
}
|
||||
<style>
|
||||
|
||||
#panel {
|
||||
/* padding: 50px; */
|
||||
padding: 5px;
|
||||
text-align: left;
|
||||
background-color: #e5eecc;
|
||||
border: solid 1px #c3c3c3;
|
||||
/* column-count: 4; */
|
||||
padding: 20px;
|
||||
display: none;
|
||||
margin: 0 0 20px 0;
|
||||
}
|
||||
|
||||
.bar1, .bar2, .bar3 {
|
||||
width: 35px;
|
||||
height: 5px;
|
||||
background-color: #777;
|
||||
margin: 6px 0;
|
||||
transition: 0.4s;
|
||||
}
|
||||
|
||||
.change .bar1 {
|
||||
-webkit-transform: rotate(-45deg) translate(-9px, 6px);
|
||||
transform: rotate(-45deg) translate(-9px, 6px);
|
||||
}
|
||||
|
||||
.change .bar2 {opacity: 0;}
|
||||
|
||||
.change .bar3 {
|
||||
-webkit-transform: rotate(45deg) translate(-8px, -8px);
|
||||
transform: rotate(45deg) translate(-8px, -8px);
|
||||
}
|
||||
|
||||
#flip {
|
||||
margin: -40px 0 0 90%;
|
||||
}
|
||||
</style>
|
||||
|
||||
@ -80,6 +105,7 @@
|
||||
jQuery(document).ready(function(){
|
||||
jQuery("#flip").click(function(){
|
||||
jQuery("#panel").slideToggle();
|
||||
jQuery("#flip").toggleClass("change");
|
||||
});
|
||||
});
|
||||
</script>
|
||||
@ -88,7 +114,7 @@ jQuery(document).ready(function(){
|
||||
<body <?php body_class(); ?>>
|
||||
<div id="wrapper">
|
||||
<?php /* Our navigation menu. If one isn't filled out, wp_nav_menu falls back to wp_page_menu. The menu assiged to the primary position is the one used. If none is assigned, the menu with the lowest ID is used. */ ?>
|
||||
<?php wp_nav_menu( array( 'container_class' => 'melville_header_menu', 'theme_location' => 'header-menu' ) ); ?>
|
||||
|
||||
|
||||
<div id="header">
|
||||
<?php $heading_tag = ( is_home() || is_front_page() ) ? 'h1' : 'div'; ?>
|
||||
@ -97,24 +123,13 @@ jQuery(document).ready(function(){
|
||||
</<?php echo $heading_tag; ?>>
|
||||
<div id="site-description"><?php bloginfo( 'description' ); ?></div>
|
||||
</div><!--#header-->
|
||||
<div id="flip">Click to slide down panel</div>
|
||||
<div id="flip"> <div class="bar1"></div>
|
||||
<div class="bar2"></div>
|
||||
<div class="bar3"></div></div>
|
||||
<div id="panel">
|
||||
<?php wp_nav_menu( array( 'container_class' => 'melville_header_menu', 'theme_location' => 'header-menu' ) ); ?>
|
||||
|
||||
Hello world!Top References
|
||||
<ul>
|
||||
<li>HTML Reference</li>
|
||||
<li>CSS Reference</li>
|
||||
<li>JavaScript Reference</li>
|
||||
<li>SQL Reference</li>
|
||||
<li>Python Reference</li>
|
||||
<li>W3.CSS Reference</li>
|
||||
<li>Bootstrap Reference</li>
|
||||
<li>PHP Reference</li>
|
||||
<li>HTML Colors</li>
|
||||
<li>Java Reference</li>
|
||||
<li>Angular Reference</li>
|
||||
<li>jQuery Reference</li>
|
||||
</ul>
|
||||
<div style="clear: both"></div>
|
||||
|
||||
</div>
|
||||
<div id="content">
|
||||
|
38
style.css
38
style.css
@ -243,7 +243,7 @@ hr { margin: 20px 0; }
|
||||
|
||||
div#content
|
||||
{
|
||||
margin: 0 0 20px 0;
|
||||
margin: 40px 0 20px 0;
|
||||
padding: 0px 80px 0 80px;
|
||||
}
|
||||
|
||||
@ -393,7 +393,7 @@ br.clear
|
||||
/* @group Header ---------------------------------------------- */
|
||||
div#header
|
||||
{
|
||||
margin: 0 0 60px 0;
|
||||
/* margin: 0 0 20px 0; */
|
||||
padding: 0 0 20px 0;
|
||||
color: #777777;
|
||||
/* border-bottom: 1px solid #bbbbbb; */
|
||||
@ -637,7 +637,7 @@ input[type="submit"] { color: #333; }
|
||||
|
||||
#respond
|
||||
{
|
||||
border-top: 1px solid #e7e7e7;
|
||||
/* border-top: 1px solid #e7e7e7; */
|
||||
margin: 24px 0;
|
||||
overflow: hidden;
|
||||
position: relative;
|
||||
@ -761,25 +761,29 @@ h3#reply-title { margin: 18px 0; }
|
||||
/* Footer Menu Styles */
|
||||
.melville_header_menu ul
|
||||
{
|
||||
list-style: none;
|
||||
/* list-style: none; */
|
||||
padding: 0px;
|
||||
}
|
||||
|
||||
.melville_header_menu ul ul
|
||||
{
|
||||
display: none;
|
||||
position: absolute;
|
||||
background-color: white;
|
||||
/* display: none; */
|
||||
/* position: absolute; */
|
||||
/* background-color: white; */
|
||||
}
|
||||
|
||||
.melville_header_menu li
|
||||
{
|
||||
display: inline-block;
|
||||
padding-right: 20px;
|
||||
padding-right: 0px;
|
||||
width: 24%;
|
||||
vertical-align: top;
|
||||
|
||||
}
|
||||
|
||||
.melville_header_menu li a { text-decoration: none; }
|
||||
|
||||
/*
|
||||
.melville_header_menu li:hover ul
|
||||
{
|
||||
display: block;
|
||||
@ -787,13 +791,16 @@ h3#reply-title { margin: 18px 0; }
|
||||
padding: 0 10px;
|
||||
border-top: 1px solid;
|
||||
}
|
||||
*/
|
||||
|
||||
|
||||
.melville_header_menu li li
|
||||
{
|
||||
display: block;
|
||||
/* display: block; */
|
||||
display: inline-block;
|
||||
text-align: left;
|
||||
padding-top: 10px;
|
||||
padding-left: 5px;
|
||||
padding-left: 0px;
|
||||
}
|
||||
|
||||
.melville_header_menu li ul { }
|
||||
@ -801,7 +808,7 @@ h3#reply-title { margin: 18px 0; }
|
||||
|
||||
.melville_header_menu
|
||||
{
|
||||
text-align: center;
|
||||
text-align: left;
|
||||
font-variant: small-caps;
|
||||
}
|
||||
|
||||
@ -1051,10 +1058,17 @@ p.has-drop-cap:not(:focus):first-letter
|
||||
.page-link a:link, .page-link a:visited { background: #f1f1f1; }
|
||||
/* div#footer { background-color: #241f20; } */
|
||||
input#s { background-color: #fefefe; }
|
||||
#commentform input, #commentform textarea { background-color: #fcfcfc; }
|
||||
#commentform input, #commentform textarea {
|
||||
background: #241f20;
|
||||
/* background-color: #fcfcfc; */
|
||||
}
|
||||
#menu div.menu, #menu div.melville_footer_menu
|
||||
{
|
||||
background-color: #67554F;}
|
||||
|
||||
#panel {
|
||||
background: #323232;
|
||||
}
|
||||
|
||||
/* Border Colors */
|
||||
div#wrapper
|
||||
|
Loading…
x
Reference in New Issue
Block a user