Zenjob Notes, and new Templates
This commit is contained in:
@ -0,0 +1,353 @@
|
||||
<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"
|
||||
>
|
||||
Start Free
|
||||
</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"> Start free </a>
|
||||
<a
|
||||
class="login-button"
|
||||
aria-label="Login"
|
||||
href="{% route login %}"
|
||||
>
|
||||
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>
|
||||
Reference in New Issue
Block a user