Mizuno and Aiim templates. Almost done with the default class and liquid extraction script.
This commit is contained in:
Norm Rasmussen
266
Custom_Templates/customer_templates/AIIM+/_header.html.liquid
Normal file
266
Custom_Templates/customer_templates/AIIM+/_header.html.liquid
Normal file
@ -0,0 +1,266 @@
|
||||
<header class="np-header np-header-color np-hidden-mobile">
|
||||
<div class="np-header-content-upper">
|
||||
<div class="np-header-content-upper-left">
|
||||
<a class='upper-menu-button' href='https://www.aiim.org/'>
|
||||
<< Back to AIIM.org
|
||||
</a>
|
||||
</div>
|
||||
<div class="np-header-content-upper-right">
|
||||
{% if current_person.signed_in? %}
|
||||
{% include 'user_bar_desktop' %}
|
||||
{% else %}
|
||||
<a class="np-header-sign-in np-header-desktop-nav-link np-header-font-color" href="{% route login %}"> {% t shared.sign_in %}
|
||||
{% endif %}
|
||||
</div>
|
||||
</div>
|
||||
<div class="np-header-content-bottom">
|
||||
{% if current_school.logo_url %}
|
||||
<h1 class="np-header-logo">
|
||||
<a href="{% route home %}">
|
||||
<img
|
||||
alt="{{ current_school.name }}"
|
||||
class="np-header-logo-image"
|
||||
src="{{ current_school.logo_url }}"
|
||||
/>
|
||||
</a>
|
||||
</h1>
|
||||
{% else %}
|
||||
<a href="{% route home %}" class="np-school-name np-header-font-color">
|
||||
{{ current_school.name }}
|
||||
</a>
|
||||
{% endif %}
|
||||
<div class='bottom-menu'>
|
||||
<a class='bottom-menu-list aiim-yellow' href='https://community.aiim.org/home'>
|
||||
Home
|
||||
</a>
|
||||
<div class='menu-with-dropdown'>
|
||||
<div class='bottom-menu-list' id='communities-hover'>
|
||||
Communities <i class="fas fa-angle-down aiim-yellow"></i>
|
||||
</div>
|
||||
<div class='bottom-menu-list-dropdown' id="communities-list">
|
||||
<a class='bottom-menu-list-dropdown-item' href='https://community.aiim.org/home'>
|
||||
Open Forum
|
||||
</a>
|
||||
<a class='bottom-menu-list-dropdown-item' href='https://community.aiim.org/communities/allcommunities'>
|
||||
All Communities
|
||||
</a>
|
||||
<a class='bottom-menu-list-dropdown-item' href='https://community.aiim.org/communities/mycommunities'>
|
||||
My Communities
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
<div class='menu-with-dropdown'>
|
||||
<div class='bottom-menu-list' id='members-hover'>
|
||||
Find a Member <i class="fas fa-angle-down aiim-yellow"></i>
|
||||
</div>
|
||||
<div class='bottom-menu-list-dropdown' id="members-list">
|
||||
<a class='bottom-menu-list-dropdown-item' href='https://community.aiim.org/network/members'>
|
||||
Member Directory
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
<div class='menu-with-dropdown'>
|
||||
<div class='bottom-menu-list' id='events-hover'>
|
||||
Events <i class="fas fa-angle-down aiim-yellow"></i>
|
||||
</div>
|
||||
<div class='bottom-menu-list-dropdown' id="events-list">
|
||||
<a class='bottom-menu-list-dropdown-item' href='https://community.aiim.org/events'>
|
||||
Upcoming AIIM Events
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
<div class='menu-with-dropdown'>
|
||||
<div class='bottom-menu-list' id='resources-hover'>
|
||||
Resources <i class="fas fa-angle-down aiim-yellow"></i>
|
||||
</div>
|
||||
<div class='bottom-menu-list-dropdown' id="resources-list">
|
||||
<a class='bottom-menu-list-dropdown-item' href='https://community.aiim.org/resources/member-content'>
|
||||
AIIM+ Member Resources
|
||||
</a>
|
||||
<a class='bottom-menu-list-dropdown-item' href='https://community.aiim.org/browse/blogs'>
|
||||
Blogs
|
||||
</a>
|
||||
<a class='bottom-menu-list-dropdown-item' href='https://community.aiim.org/browse/casestudylibrary'>
|
||||
Case Study Library
|
||||
</a>
|
||||
<a class='bottom-menu-list-dropdown-item' href='https://community.aiim.org/network/supplierdirectory'>
|
||||
Solution Provider Directory
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
<div class='menu-with-dropdown'>
|
||||
<div class='bottom-menu-list' id='training-hover'>
|
||||
AIIM+ Pro: Training Courses <i class="fas fa-angle-down aiim-yellow"></i>
|
||||
</div>
|
||||
<div class='bottom-menu-list-dropdown' id="training-list">
|
||||
<a class='bottom-menu-list-dropdown-item' href='https://aiim.northpass.com/app'>
|
||||
Home
|
||||
</a>
|
||||
<a class='bottom-menu-list-dropdown-item' href='https://aiim.northpass.com/app/courses'>
|
||||
Courses
|
||||
</a>
|
||||
<a class='bottom-menu-list-dropdown-item' href='https://aiim.northpass.com/app/learning_paths'>
|
||||
Learning Paths
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</header>
|
||||
<header class="np-hidden-desktop np-header-mobile-menu-nav">
|
||||
<div class='user-logo-mobile'>
|
||||
{% if current_person.signed_in? %}
|
||||
{% include 'mobile_buttons' %}
|
||||
{% include 'mobile_header' %}
|
||||
{% endif %}
|
||||
</div>
|
||||
<div class='mobile-school-logo'>
|
||||
{% if current_school.logo_url %}
|
||||
<h1 class="np-header-logo">
|
||||
<a href="{% route home %}">
|
||||
<img
|
||||
alt="{{ current_school.name }}"
|
||||
class="np-header-logo-image"
|
||||
src="{{ current_school.logo_url }}"
|
||||
/>
|
||||
</a>
|
||||
</h1>
|
||||
{% else %}
|
||||
<a href="{% route home %}" class="np-school-name np-header-font-color">
|
||||
{{ current_school.name }}
|
||||
</a>
|
||||
{% endif %}
|
||||
</div>
|
||||
</header>
|
||||
|
||||
{% include "messages" %}
|
||||
|
||||
<style>
|
||||
.bottom-menu {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
}
|
||||
.np-header {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
height: 135px;
|
||||
color: #fff;
|
||||
}
|
||||
.np-header-content-upper {
|
||||
width: 100%;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
margin-top: 5px;
|
||||
}
|
||||
.np-header-content-upper-right {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
justify-content: space-between;
|
||||
}
|
||||
.np-header-content-bottom {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
width: 100%;
|
||||
}
|
||||
.bottom-menu-list {
|
||||
padding: 20px 20px;
|
||||
color: #333333;
|
||||
}
|
||||
.menu-with-dropdown {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
}
|
||||
.aiim-yellow {
|
||||
color: #FFAA1F !important;
|
||||
}
|
||||
.fa-angle-down {
|
||||
padding: 0 3px;
|
||||
}
|
||||
a:visited {
|
||||
text-decoration: none;
|
||||
color: initial;
|
||||
}
|
||||
a:hover {
|
||||
text-decoration: none;
|
||||
color: initial;
|
||||
}
|
||||
a {
|
||||
text-decoration: none;
|
||||
color: initial;
|
||||
}
|
||||
.bottom-menu-list-dropdown {
|
||||
flex-direction: column;
|
||||
display: none;
|
||||
background: #EBEBEB;
|
||||
position: absolute;
|
||||
margin-top: 45px;
|
||||
z-index: 1;
|
||||
padding: 15px;
|
||||
border-radius: 10px;
|
||||
}
|
||||
#communities-list:hover {
|
||||
display: flex;
|
||||
}
|
||||
#members-list:hover {
|
||||
display: flex;
|
||||
}
|
||||
#events-list:hover {
|
||||
display: flex;
|
||||
}
|
||||
#resources-list:hover {
|
||||
display: flex;
|
||||
}
|
||||
#training-list:hover {
|
||||
display: flex;
|
||||
}
|
||||
#communities-hover:hover + #communities-list {
|
||||
display: flex;
|
||||
}
|
||||
#members-hover:hover + #members-list {
|
||||
display: flex;
|
||||
}
|
||||
#events-hover:hover + #events-list {
|
||||
display: flex;
|
||||
}
|
||||
#resources-hover:hover + #resources-list {
|
||||
display: flex;
|
||||
}
|
||||
#training-hover:hover + #training-list {
|
||||
display: flex;
|
||||
}
|
||||
.bottom-menu-list-dropdown-item {
|
||||
padding: 10px 5px;
|
||||
}
|
||||
.bottom-menu-list-dropdown-item:hover {
|
||||
color: #FFAA1F
|
||||
}
|
||||
@media only screen and (max-width: 768px) {
|
||||
.bottom-menu {
|
||||
display: none;
|
||||
}
|
||||
.np-header-mobile-menu-nav {
|
||||
position: relative;
|
||||
height: 70px;
|
||||
display: flex;
|
||||
}
|
||||
.mobile-school-logo {
|
||||
margin: auto;
|
||||
}
|
||||
.np-header-mobile-menu-nav-button {
|
||||
height: 100%;
|
||||
width: 100%;
|
||||
padding-left: 15px;
|
||||
}
|
||||
.np-header-logo {
|
||||
margin: 0px;
|
||||
height: 60px;
|
||||
}
|
||||
.np-header-logo-image {
|
||||
height: 60px;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
Reference in New Issue
Block a user