347 lines
8.7 KiB
Plaintext
347 lines
8.7 KiB
Plaintext
<header class="header-desktop">
|
|
<div class="header-logo">
|
|
<a href="{% route home %}">
|
|
<img
|
|
alt="{{ current_school.name }}"
|
|
class="header-logo-image"
|
|
src="{{ current_school.logo_url }}"
|
|
/>
|
|
</a>
|
|
</div>
|
|
<div class="header-content">
|
|
<div class="header-content-dropdown" id="dropdown-1-button">
|
|
<div class="header-content-text">
|
|
Categories <i class="fa-solid fa-angle-down"></i>
|
|
</div>
|
|
<ul class="header-content-menu" id="dropdown-1-menu">
|
|
<li class="header-content-menu-element">
|
|
<a
|
|
class="header-content-dropdown-link"
|
|
href="/app/catalog#category-businessfoundations"
|
|
>
|
|
Business Foundations
|
|
</a>
|
|
</li>
|
|
<li class="header-content-menu-element">
|
|
<a
|
|
class="header-content-dropdown-link"
|
|
href="/app/catalog#category-emailmarketingfundamentals"
|
|
>
|
|
Email Marketing Fundamentals
|
|
</a>
|
|
</li>
|
|
<li class="header-content-menu-element">
|
|
<a
|
|
class="header-content-dropdown-link"
|
|
href="/app/catalog#category-expert-ledtutorials"
|
|
>
|
|
Expert-led Tutorials
|
|
</a>
|
|
</li>
|
|
<li class="header-content-menu-element">
|
|
<a
|
|
class="header-content-dropdown-link"
|
|
href="/app/catalog#category-omnisendbasics"
|
|
>
|
|
Omnisend Basics
|
|
</a>
|
|
</li>
|
|
<li class="header-content-menu-element">
|
|
<a
|
|
class="header-content-dropdown-link"
|
|
href="/app/catalog#category-productupdates"
|
|
>
|
|
Product Updates
|
|
<li class="header-content-menu-element">
|
|
<a
|
|
class="header-content-dropdown-link"
|
|
href="/app/catalog#category-webinars"
|
|
>
|
|
Webinars
|
|
</a>
|
|
</li>
|
|
</ul>
|
|
</div>
|
|
<div class="header-content-dropdown" id="dropdown-2-button">
|
|
<div class="header-content-text">
|
|
Resources <i class="fa-solid fa-angle-down"></i>
|
|
</div>
|
|
<ul class="header-content-menu" id="dropdown-2-menu">
|
|
<li class="header-content-menu-element">
|
|
<a
|
|
class="header-content-dropdown-link"
|
|
href="https://www.omnisend.com/blog/"
|
|
>
|
|
Blog
|
|
</a>
|
|
</li>
|
|
<li class="header-content-menu-element">
|
|
<a
|
|
class="header-content-dropdown-link"
|
|
href="https://www.omnisend.com/resources/library/"
|
|
>
|
|
Library
|
|
</a>
|
|
</li>
|
|
<li class="header-content-menu-element">
|
|
<a
|
|
class="header-content-dropdown-link"
|
|
href="https://www.omnisend.com/resources/reports/"
|
|
>
|
|
Reports
|
|
</a>
|
|
</li>
|
|
<li class="header-content-menu-element">
|
|
<a
|
|
class="header-content-dropdown-link"
|
|
href="https://www.omnisend.com/resources/podcast/"
|
|
>
|
|
Podcast
|
|
</a>
|
|
</li>
|
|
<li class="header-content-menu-element">
|
|
<a
|
|
class="header-content-dropdown-link"
|
|
href="https://www.omnisend.com/resources/interviews/"
|
|
>
|
|
Interviews
|
|
</a>
|
|
</li>
|
|
<li class="header-content-menu-element">
|
|
<a
|
|
class="header-content-dropdown-link"
|
|
href="https://support.omnisend.com/en/"
|
|
>
|
|
Knowledge Base
|
|
</a>
|
|
</li>
|
|
</ul>
|
|
</div>
|
|
<a
|
|
class="register-button"
|
|
href="https://app.omnisend.com/registrationv2?utm_source=academy&utm_medium=startfree&utm_campaign=academy"
|
|
>
|
|
Sign up for Omnisend
|
|
</a>
|
|
<a class="header-content-text" href="/app/faq"> FAQ </a>
|
|
<div class="header-content-search">
|
|
<form
|
|
class="header-content-search-form"
|
|
method="get"
|
|
action="{% route search %}"
|
|
>
|
|
<i class="fal fa-search"></i>
|
|
<input
|
|
aria-label="Search"
|
|
class="header-content-search-form-input"
|
|
type="text"
|
|
name="q"
|
|
placeholder="Search"
|
|
/>
|
|
</form>
|
|
</div>
|
|
{% if current_person.signed_in? %}
|
|
<div class="header-content-avatar" id="avatar-button">
|
|
<button class="header-content-avatar-button">
|
|
<img
|
|
alt="{{ current_person.name }}"
|
|
class="header-content-avatar-image"
|
|
src="{{ current_person.avatar_url }}"
|
|
/>
|
|
</button>
|
|
<ul class="header-content-menu" id="avatar-dropdown">
|
|
<li class="header-content-menu-text">
|
|
{{ current_person.name }}
|
|
</a>
|
|
</li>
|
|
<li class="header-content-menu-text">
|
|
{{ current_person.email }}
|
|
</li>
|
|
{% unless current_school.sso_active? %}
|
|
<li class="header-content-menu-element">
|
|
<a
|
|
class="header-content-dropdown-link"
|
|
href="{% route account %}"
|
|
>
|
|
Profile
|
|
</a>
|
|
</li>
|
|
{% endunless %}
|
|
<li class="header-content-menu-element">
|
|
<a
|
|
class="header-content-dropdown-link"
|
|
href="{% route logout %}"
|
|
>
|
|
Logout
|
|
</a>
|
|
</li>
|
|
</ul>
|
|
</div>
|
|
{% else %}
|
|
<a class="register-button" href="/sign_up" style="margin-left: 20px"> Log in </a>
|
|
{% endif %}
|
|
</div>
|
|
</header>
|
|
|
|
<style>
|
|
.header-desktop {
|
|
margin-bottom: 40px;
|
|
display: flex;
|
|
justify-content: space-between;
|
|
padding: 15px 4%;
|
|
}
|
|
.header-desktop > .header-content > * {
|
|
font-size: 1.25rem;
|
|
}
|
|
.header-logo {
|
|
margin: auto 0;
|
|
}
|
|
.header-logo-image {
|
|
height: 50px;
|
|
}
|
|
.header-content {
|
|
display: flex;
|
|
justify-content: space-evenly;
|
|
align-items: center;
|
|
}
|
|
.header-content-dropdown {
|
|
position: relative;
|
|
}
|
|
.header-content-text {
|
|
padding: 0 20px;
|
|
color: #1e2423;
|
|
text-decoration: none;
|
|
cursor: pointer;
|
|
align-self: center;
|
|
}
|
|
.header-content-text:hover {
|
|
color: black;
|
|
}
|
|
.header-content-text .fa-angle-down {
|
|
margin-left: 5px;
|
|
}
|
|
.header-content-menu {
|
|
display: none;
|
|
position: absolute;
|
|
padding: 15px;
|
|
background: white;
|
|
z-index: 100;
|
|
border-radius: 10px;
|
|
border: 1px lightgray solid;
|
|
-webkit-box-shadow: 11px 11px 8px -10px #000000;
|
|
box-shadow: 11px 11px 8px -10px #000000;
|
|
list-style: none;
|
|
}
|
|
.header-content-menu-element {
|
|
padding: 5px 25px;
|
|
margin: 2px 0;
|
|
}
|
|
.header-content-menu-text {
|
|
opacity: 0.8;
|
|
padding: 5px 25px;
|
|
}
|
|
.header-content-menu-element:hover {
|
|
background-color: lightgray;
|
|
}
|
|
.header-content-dropdown-link {
|
|
text-decoration: none;
|
|
color: #1e2423;
|
|
white-space: nowrap;
|
|
}
|
|
.header-content-dropdown-link:hover {
|
|
color: black;
|
|
}
|
|
.header-content-search {
|
|
align-self: center;
|
|
margin-left: 10px;
|
|
}
|
|
.header-content-search-form {
|
|
border: 1px solid #1e2423;
|
|
border-radius: 10px;
|
|
padding: 8px 16px;
|
|
}
|
|
.header-content-search-form-input {
|
|
border: none;
|
|
outline: none;
|
|
padding: 0 10px;
|
|
}
|
|
.header-content-avatar {
|
|
margin-left: 15px;
|
|
}
|
|
.header-content-avatar-button {
|
|
border: none;
|
|
background: none;
|
|
}
|
|
.header-content-avatar-image {
|
|
border-radius: 50%;
|
|
height: 50px;
|
|
}
|
|
#avatar-dropdown {
|
|
right: 0;
|
|
}
|
|
.register-button {
|
|
background-color: #1E2423;
|
|
color: white;
|
|
padding: 11px 16px;
|
|
text-decoration: none;
|
|
border-radius: 10px;
|
|
}
|
|
.register-button:hover {
|
|
color: white;
|
|
background-color: black;
|
|
}
|
|
@media only screen and (min-width: 1800px) {
|
|
.header-desktop {
|
|
padding: 20px 10%;
|
|
}
|
|
}
|
|
@media only screen and (max-width: 1300px) {
|
|
.header-content-text {
|
|
padding: 0 10px;
|
|
}
|
|
}
|
|
@media only screen and (max-width: 1150px) {
|
|
.header-content-search-form-input {
|
|
max-width: 160px;
|
|
}
|
|
}
|
|
@media only screen and (max-width: 1000px) {
|
|
.header-logo-image {
|
|
height: 40px;
|
|
}
|
|
.header-content-avatar-image {
|
|
height: 40px;
|
|
}
|
|
.header-content-search-form-input {
|
|
max-width: 120px;
|
|
}
|
|
}
|
|
</style>
|
|
|
|
<script>
|
|
$("#dropdown-1-button").hover(
|
|
function () {
|
|
$("#dropdown-1-menu").show();
|
|
},
|
|
function () {
|
|
$("#dropdown-1-menu").hide();
|
|
}
|
|
);
|
|
$("#dropdown-2-button").hover(
|
|
function () {
|
|
$("#dropdown-2-menu").show();
|
|
},
|
|
function () {
|
|
$("#dropdown-2-menu").hide();
|
|
}
|
|
);
|
|
$("#avatar-button").hover(
|
|
function () {
|
|
$("#avatar-dropdown").show();
|
|
},
|
|
function () {
|
|
$("#avatar-dropdown").hide();
|
|
}
|
|
);
|
|
</script>
|