tmdinosaurcenter
/
tainacan-theme
mirror of https://github.com/tainacan/tainacan-theme.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

Alinhamento do menu no mobile e no desktop.

This commit is contained in:
Fabiano Alencar 2018-01-30 13:58:50 -02:00
parent e53955141f
commit 93a85ef6bd
2 changed files with 79 additions and 60 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

15
src/assets/scss/style.scss
View File

@ -20,11 +20,26 @@ nav{
form{
&.tainacan-form-search{
flex-flow: nowrap;
.tainacan-input-search{
&:focus{
border-color: none;
box-shadow: none;
}
}
.tainacan-button-search{
border-color: none;
box-shadow: none;
}
}
}
.header{
.header-img{
@media only screen{
@media (max-width: 768px){
min-height: 240px;
}
}
}
}

48
src/header.php
View File

@ -8,14 +8,18 @@
<link href="https://fonts.googleapis.com/icon?family=Material+Icons"
rel="stylesheet">
<?php wp_head(); ?>
</head>
<body>
</head>
<body>
<nav class="navbar navbar-expand-lg navbar-light bg-white menu-shadow">
<a class="navbar-brand pt-0" href="#">
<div class="d-flex flex-nowrap w-100">
<div class="mr-auto p-0">
<a class="navbar-brand" href="#">
<img src="<?php echo get_template_directory_uri().'/assets/images/logo.svg' ?>" class="logo" style="width: 150px">
</a>
<div class="btn-group pt-1 ml-auto">
</div>
<div class="p-0">
<div class="btn-group pt-1">
<button type="button" class="btn btn-link text-heavy-metal pr-0"><i class="material-icons">folder_open</i></button>
<button type="button" class="btn btn-link text-jelly-bean pl-0 dropdown-toggle dropdown-toggle-split" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
<span class="sr-only">Toggle Dropdown</span>
@ -41,38 +45,38 @@
<a class="dropdown-item" href="#">Separated link</a>
</div>
</div>
<button class="navbar-toggler text-heavy-metal border-0 px-0" type="button" data-toggle="collapse" data-target="#menuTp" aria-controls="menuTp" aria-expanded="false" aria-label="Toggle navigation">
</div>
<div class="p-0">
<button class="navbar-toggler text-heavy-metal border-0 px-0 pt-2 mt-1" type="button" data-toggle="collapse" data-target="#menuTp" aria-controls="menuTp" aria-expanded="false" aria-label="Toggle navigation">
<i class="material-icons">more_vert</i>
</button>
<div class="collapse navbar-collapse" id="menuTp">
<ul class="navbar-nav mr-auto">
<div class="collapse navbar-collapse mt-sm-1" id="menuTp">
<ul class="navbar-nav">
<li class="nav-item">
<a class="nav-link text-havy-metal" href="#"><i class="material-icons">notifications_none</i></a>
<a class="nav-link text-heavy-metal" href="#"><i class="material-icons">notifications_none</i></a>
</li>
<li class="nav-item">
<a class="nav-link text-havy-metal" href="#"><i class="material-icons">event</i></a>
<a class="nav-link text-heavy-metal" href="#"><i class="material-icons">event</i></a>
</li>
<li class="nav-item">
<a class="nav-link text-havy-metal" href="#"><i class="material-icons">help_outline</i></a>
<a class="nav-link text-heavy-metal" href="#"><i class="material-icons">help_outline</i></a>
</li>
</ul>
</div>
</div>
</div>
</nav>
<div class="d-flex flex-column mt-2 d-lg-none">
<form class="form-inline tainacan-form-search">
<div class="input-group">
<input class="form-control ml-1 tainacan-input-search invisible" type="search">
<div class="input-group-prepend">
<!-- <div class="input-group-text border-0 p-0 text-heavy-metal bg-white mr-2">
<i class="material-icons">search</i>
</div> -->
<button type="submit" class="btn btn-primary border-0 text-heavy-metal bg-white p-0 mx-2 pt-1" onclick=""><i class="material-icons">search</i></button>
<form class="tainacan-form-search">
<div class="d-flex justify-content-between">
<div class="w-100 pt-1 mt-2 pl-1">
<input class="form-control h-75 tainacan-input-search py-0 border-0" type="search" placeholder="Pesquisar">
</div>
<div class="pt-1 mt-2 mx-1">
<button type="submit" class="btn h-75 pt-2 border-0 text-heavy-metal bg-white tainacan-button-search" onclick=""><i class="material-icons">search</i></button>
</div>
</div>
</form>
</div>
</form>
<div class="d-flex flex-column header">
<img src="<?php echo get_template_directory_uri() ?>/assets/images/capa.png" class="img-fluid header-img">