Matt Gerrard (Talk | contribs) |
Matt Gerrard (Talk | contribs) |
||
Line 43: | Line 43: | ||
.main.menu .items { | .main.menu .items { | ||
− | margin-top: | + | margin-top: 6rem; |
} | } | ||
Line 54: | Line 54: | ||
text-align: center; | text-align: center; | ||
− | margin-bottom: | + | margin-bottom: 2rem; |
border-radius: 50%; | border-radius: 50%; | ||
Line 93: | Line 93: | ||
.main.menu .item:hover { | .main.menu .item:hover { | ||
border-left-color: #2980B9; | border-left-color: #2980B9; | ||
+ | } | ||
+ | |||
+ | .main.menu .sub-items { | ||
+ | display: inline-block; | ||
+ | |||
+ | margin-top: 0.3rem; | ||
+ | |||
+ | height: 0; | ||
+ | overflow: hidden; | ||
+ | |||
+ | transition: height 0.3s; | ||
+ | } | ||
+ | |||
+ | .main.menu .item:hover .sub-items { | ||
+ | height: auto; | ||
+ | } | ||
+ | |||
+ | .main.menu .sub-item { | ||
+ | display: inline-block; | ||
+ | |||
+ | margin-top: 0.7rem; | ||
+ | |||
+ | font-weight: bold; | ||
+ | font-size: 0.9rem; | ||
+ | |||
+ | padding: 0 0.5rem; | ||
+ | |||
+ | color: rgba(240, 240, 240, 1); | ||
+ | |||
+ | border-right: 3px solid transparent; | ||
+ | border-left: 3px solid transparent; | ||
+ | |||
+ | transition: border 0.2s; | ||
+ | } | ||
+ | |||
+ | .main.menu .sub-item:hover { | ||
} | } | ||
Line 280: | Line 316: | ||
<script src="https://cdn.bootcss.com/semantic-ui/2.2.10/semantic.min.js"></script> | <script src="https://cdn.bootcss.com/semantic-ui/2.2.10/semantic.min.js"></script> | ||
</head> | </head> | ||
+ | |||
+ | <style> | ||
+ | #top_menu_14:hover { | ||
+ | top: 0; | ||
+ | } | ||
+ | </style> | ||
<script> | <script> | ||
Line 328: | Line 370: | ||
// remove some weird components | // remove some weird components | ||
$("#sideMenu").remove(); | $("#sideMenu").remove(); | ||
− | $("#top_menu_14"). | + | |
+ | $("#top_menu_14").css({ | ||
+ | top: -$("#top_menu_14").height() + "px", | ||
+ | "padding-bottom": "1rem", | ||
+ | transition: "top 0.3s" | ||
+ | }); | ||
glob.Aquamade = {}; | glob.Aquamade = {}; | ||
Line 360: | Line 407: | ||
<div class="main view"> | <div class="main view"> | ||
<div class="main menu"> | <div class="main menu"> | ||
− | <div class="items | + | <div class="items"> |
<div class="logo"><i class="fa fa-bath"></i></div><br> | <div class="logo"><i class="fa fa-bath"></i></div><br> | ||
− | <div class="item item-home">HOME</div><br> | + | <div style="text-align: center; display: inline-block; width: auto;"> |
− | + | <div class="item item-home">HOME</div><br> | |
− | + | <div class="item item-project"> | |
− | + | PROJECT<br> | |
− | + | <div class="sub-items"> | |
− | + | <div class="sub-item">OVERVIEW</div><br> | |
+ | <div class="sub-item">RESULTS</div><br> | ||
+ | <div class="sub-item">PROFF</div> | ||
+ | </div> | ||
+ | </div><br> | ||
+ | <div class="item item-parts">PARTS</div><br> | ||
+ | <div class="item item-model">MODELLING</div><br> | ||
+ | <div class="item item-hprac">HUMAN PRACTICES</div><br> | ||
+ | <div class="item item-team">TEAM</div><br> | ||
+ | </div> | ||
</div> | </div> | ||
</div> | </div> |
Revision as of 01:11, 17 June 2017