SethTrowbridge/devo-book
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

dimmer

Browse Source
This commit is contained in:
TreetopFlyer 2021-08-16 12:01:43 -04:00
parent ba60213b14
commit 913b9d852a
1 changed files with 26 additions and 3 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

29
index.html
View File

@ -292,7 +292,7 @@ nav
bottom: 0; bottom: 0;
right: 0px; right: 0px;
width: 200px; width: 200px;
z-index: 10; z-index: 200;
height: 66px; height: 66px;
overflow: hidden; overflow: hidden;
transition: height 0.4s; transition: height 0.4s;
@ -415,17 +415,40 @@ nav > ul
width:100%; width:100%;
transform: translateY(-50%); transform: translateY(-50%);
transition:left 0.4s 0.5s; transition:left 0.4s 0.5s;
list-style-type: none;
}
nav > ul a
{
text-decoration: none !important;
color:black !important;
} }
[nav-open] nav > ul [nav-open] nav > ul
{ {
left:0%; left:0%;
} }
.Dim
{
box-shadow: 0px 0px 10px rgb(0 0 0 / 20%);
z-index: 100;
position: fixed;
right: 0;
bottom: 0%;
height: 65px;
width: 100%;
background: #fff;
opacity: 0.8;
transition: height 0.4s;
}
[nav-open] .Dim
{
height:100%;
}
</style> </style>
<nav> <nav>
<span class="detail edge"></span> <span class="detail edge"></span>
<span class="detail cap cap--top"></span> <span class="detail cap cap--top"></span>
<span class="detail cap cap--bottom"></span> <span class="detail cap cap--bottom"></span>
<ul> <ul>
<li><a href="#top" >Top</a></li> <li><a href="#top" >Top</a></li>
<li><a href="#order">Order</a></li> <li><a href="#order">Order</a></li>
@ -434,9 +457,9 @@ nav > ul
<li><a href="#specs">Specs</a></li> <li><a href="#specs">Specs</a></li>
<li><a href="#email">Sign-up</a></li> <li><a href="#email">Sign-up</a></li>
</ul> </ul>
<span class="button"></span> <span class="button"></span>
</nav> </nav>
<div class="Dim"></div>
<main> <main>
<section id="order"> <section id="order">