Files
Gainsight/Custom_Templates/customer_templates/PipedriveSSO/_header.html.liquid
2022-11-11 21:54:43 -05:00

95 lines
2.3 KiB
Plaintext

<header class="main-header width-limit">
<section class="header-left header-flex">
<img
class="header-mobile-menu-button np-hidden-desktop"
src="https://s3.amazonaws.com/static.northpass.com/pipedrive/hamburger.png"
alt="menu"
>
<a class="header-logo" href="/app">
<img class="header-logo-image"
alt="{{ current_school.name }}"
src="{{ current_school.logo_url }}"
>
</a>
<div class="header-desktop-navigation np-hidden-mobile header-flex">
<a class="header-navigation-item" href="">
Academy Courses
</a>
<a class="header-navigation-item" href="">
Video Tutorials
</a>
<a class="header-navigation-item" href="">
Webinars
</a>
</div>
</section>
<section class="header-right header-flex">
<div class="header-desktop-buttons np-hidden-mobile header-flex">
<a class="header-navigation-item" href="https://www.pipedrive.com">
go to pipedrive.com
</a>
<div class="header-search-button">
<i class="fal fa-search"></i>
</div>
<div class="header-language-selection">
<i class="fal fa-globe"></i>
<i class="fal fa-angle-down"></i>
</div>
<a class="header-navigation-item" href="">
Log in
</a>
</div>
<a class="header-register-button button-1 button-small" href="">
Register
</a>
</section>
</header>
{% include "messages" %}
<style>
.header-flex {
display: flex;
align-items: center;
}
.main-header {
display: flex;
justify-content: space-between;
height: 72px;
padding-top: 20px;
padding-bottom: 20px;
background: #FFF;
}
.header-mobile-menu-button {
height: 100%;
margin-right: 20px;
}
.header-logo {
height: 100%;
}
.header-logo-image {
height: 32px;
}
.header-navigation-item {
padding: 5px 10px;
margin: auto 10px;
}
.header-search-button {
cursor: pointer;
background: #F4F5F6;
border-radius: 50%;
margin-right: 20px;
position: relative;
display: flex;
}
.header-search-button > i {
height: 44px;
width: 44px;
}
.header-search-button > i::before {
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
}
</style>