Added Quadriga
This commit is contained in:
Norm Rasmussen
@ -0,0 +1,73 @@
|
||||
{% assign activities_count = 0 %}
|
||||
{% for course_section in course.sections %}
|
||||
{% for course_activity in course_section.activities %}
|
||||
{% assign activities_count = activities_count | plus: 1 %}
|
||||
{% endfor %}
|
||||
{% endfor %}
|
||||
{% capture course_path %}{% route course, id: course.id %}{% endcapture %}
|
||||
<div class="np-card">
|
||||
<div class="np-card-container">
|
||||
<a href="{{ course_path }}">
|
||||
<img
|
||||
class="np-card-image"
|
||||
alt="{{ course.name }}"
|
||||
src="{{ course.image_url }}"
|
||||
>
|
||||
</a>
|
||||
<div class="np-card-content np-card-content-vertical np-card-padding">
|
||||
<a class="np-card-content-title" href="{{ course_path }}">
|
||||
{{ course.name }}
|
||||
</a>
|
||||
<div class="np-card-content-subtitle">
|
||||
{{ course.full_description }}
|
||||
</div>
|
||||
<div class="np-card-content-lessons">
|
||||
{{ activities_count }} {% if activities_count == 1 %}Lesson{% else %}Lessons{% endif %}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<style>
|
||||
.np-card {
|
||||
padding: 25px 30px !important;
|
||||
}
|
||||
.np-card-content {
|
||||
padding: 10px 50px 40px;
|
||||
}
|
||||
.np-card-content-title {
|
||||
color: rgb(38, 49, 61);
|
||||
font-size: 28px;
|
||||
font-weight: 800;
|
||||
text-decoration: none;
|
||||
height: 65px;
|
||||
overflow: clip;
|
||||
}
|
||||
.np-card-content-subtitle {
|
||||
font-size: 18px;
|
||||
font-weight: 400;
|
||||
color: rgba(0,0,0,.75);
|
||||
height: 100px;
|
||||
margin-top: 10px;
|
||||
|
||||
}
|
||||
.np-card-content-lessons {
|
||||
color: rgb(38, 49, 61);
|
||||
font-weight: 800;
|
||||
font-size: 21px;
|
||||
margin-top: 20px;
|
||||
line-height: 26px;
|
||||
}
|
||||
.np-card-content-footer {
|
||||
margin-top: 40px;
|
||||
}
|
||||
.np-button {
|
||||
height: 53px;
|
||||
border-radius: 100px;
|
||||
padding: 12px 45px;
|
||||
}
|
||||
.np-card-content-progress {
|
||||
font-size: 18px;
|
||||
margin: auto 0;
|
||||
}
|
||||
</style>
|
||||
@ -0,0 +1,127 @@
|
||||
<div class="np-card-container">
|
||||
<div class='np-course-header'>
|
||||
<img
|
||||
src="{{ course.image_url }}"
|
||||
class="np-top-image np-top-image-spacing"
|
||||
alt="{{ course.name }}"
|
||||
/>
|
||||
<div class='np-course-header-right'>
|
||||
<div class='np-course-header-right-name'>
|
||||
{{ course.name }}
|
||||
</div>
|
||||
<div class='np-course-header-right-short'>
|
||||
Learn the basics of profile value, how to customize your profile to catch the eyes of more buyers, and demand capture 101.
|
||||
</div>
|
||||
<div class='np-course-header-right-button'>
|
||||
{% include "course_progress_and_cta" %}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class='np-course-bottom'>
|
||||
<div class='np-course-bottom-left'>
|
||||
<div class='np-course-bottom-left-title'>
|
||||
Curriculum
|
||||
</div>
|
||||
<div class='np-course-bottom-left-outline'>
|
||||
{% for section in course.sections %}
|
||||
<div class='np-course-bottom-left-outline-section'>
|
||||
{{ section.name }}
|
||||
</div>
|
||||
{% for activity in section.activities %}
|
||||
<div class='np-course-bottom-left-outline-activity'>
|
||||
{{ activity.title }}
|
||||
</div>
|
||||
{% endfor %}
|
||||
{% endfor %}
|
||||
</div>
|
||||
</div>
|
||||
<div class='np-course-bottom-right'>
|
||||
<div class='np-course-bottom-right-title'>
|
||||
About this course
|
||||
</div>
|
||||
<div class='np-course-bottom-right-description'>
|
||||
{{ course.full_description }}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<style>
|
||||
body {
|
||||
background: rgb(254, 254, 254);
|
||||
}
|
||||
.np-card-container {
|
||||
background: rgb(254, 254, 254);
|
||||
box-shadow: none;
|
||||
}
|
||||
.np-course-header {
|
||||
display: flex;
|
||||
border-bottom: 1px solid #d6d6d6;
|
||||
padding-bottom: 40px;
|
||||
}
|
||||
.np-top-image {
|
||||
height: 400;
|
||||
margin: auto 0;
|
||||
}
|
||||
.np-course-header-right {
|
||||
padding-left: 50px;
|
||||
}
|
||||
.np-course-header-right-name {
|
||||
color: rgb(38, 49, 61);
|
||||
font-size: 50px;
|
||||
font-weight: 800;
|
||||
margin-bottom: 25px;
|
||||
margin-top: 40px;
|
||||
}
|
||||
.np-course-header-right-short {
|
||||
color: rgb(38, 49, 61);
|
||||
font-size: 21px;
|
||||
font-weight: 400px;
|
||||
margin-bottom: 40px;
|
||||
}
|
||||
.np-course-bottom {
|
||||
display: flex;
|
||||
margin-top: 70px;
|
||||
}
|
||||
.np-course-bottom-left{
|
||||
width: 70%;
|
||||
}
|
||||
.np-course-bottom-left-title {
|
||||
font-weight: 900;
|
||||
color: rgb(38, 49, 61);
|
||||
font-size: 24px;
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
.np-course-bottom-left-outline {
|
||||
border: 1px solid #979797 !important;
|
||||
border-radius: 10px;
|
||||
padding: 20px 0;
|
||||
}
|
||||
.np-course-bottom-left-outline-section {
|
||||
margin: 10px 0;
|
||||
padding: 0 40px 0 20px;
|
||||
font-size: 18px;
|
||||
line-height: 1.4;
|
||||
text-transform: uppercase;
|
||||
font-weight: 900;
|
||||
}
|
||||
.np-course-bottom-left-outline-activity {
|
||||
padding: 7px 30px;
|
||||
font-size: 18px;
|
||||
line-height: 28.8px;
|
||||
font-weight: 400;
|
||||
}
|
||||
.np-course-bottom-right {
|
||||
margin-left: 110px;
|
||||
}
|
||||
.np-course-bottom-right-title {
|
||||
font-weight: 900;
|
||||
color: rgb(38, 49, 61);
|
||||
font-size: 24px;
|
||||
}
|
||||
.np-course-bottom-right-description {
|
||||
font-size: 18px;
|
||||
font-weight: 400;
|
||||
color: rgb(10, 10, 10);
|
||||
}
|
||||
</style>
|
||||
@ -0,0 +1,38 @@
|
||||
{% if course.learner_can_retake? %}
|
||||
<form action="{% route course_retake, id: course.id %}" method="POST">
|
||||
{% form_authenticity_token %}
|
||||
<button type="submit" class="np-top-button np-button-font-color np-button np-button-big">
|
||||
{% t .retake, key: current_school.course_vocabulary %}
|
||||
</button>
|
||||
</form>
|
||||
{% else %}
|
||||
<a
|
||||
class="np-top-button np-button-font-color np-button np-button-big"
|
||||
{% if course.enrolled? %}
|
||||
href="{% route course_viewer, course_id: course.id, learning_path_id: params.learning_path_id %}"
|
||||
{% else %}
|
||||
href="{% route course_enrollment, code: course.enrollment_code %}"
|
||||
{% endif %}
|
||||
>
|
||||
{% if course.enrolled? == false %}
|
||||
{% t shared.enroll %}
|
||||
{% elsif course.started? == false %}
|
||||
{% t shared.course.start, key: current_school.course_vocabulary %}
|
||||
{% elsif course.completed? %}
|
||||
{% t shared.course.view, key: current_school.course_vocabulary %}
|
||||
{% else %}
|
||||
{% t shared.continue %}
|
||||
{% endif %}
|
||||
</a>
|
||||
{% endif %}
|
||||
<style>
|
||||
.np-top-button {
|
||||
height: 53px;
|
||||
border-radius: 100px;
|
||||
padding: 12px 45px;
|
||||
font-size: 16px;
|
||||
color: white;
|
||||
font-weight: 700;
|
||||
border-radius: 100px;
|
||||
}
|
||||
</style>
|
||||
@ -0,0 +1,26 @@
|
||||
{% if courses.in_catalog.any? %}
|
||||
<div class="np-catalog-courses row row-with-thumbnails" id="courses">
|
||||
{% for course in courses.in_catalog %}
|
||||
<div class="col-xs-12 col-md-6 col-lg-4 np-stretch-content">
|
||||
{% include "cards_course" with course %}
|
||||
</div>
|
||||
{% endfor %}
|
||||
</div>
|
||||
{% else %}
|
||||
{% capture message %}
|
||||
{% t shared.zero_state.courses.catalog,
|
||||
key: current_school.course_vocabulary
|
||||
%}
|
||||
{% endcapture %}
|
||||
{% include "courses_zero_state", message: message %}
|
||||
{% endif %}
|
||||
|
||||
<style>
|
||||
.np-catalog-courses {
|
||||
width: 70%;
|
||||
margin: 40px auto;
|
||||
}
|
||||
.np-card {
|
||||
padding: 20px;
|
||||
}
|
||||
</style>
|
||||
@ -0,0 +1,178 @@
|
||||
<footer class="np-footer">
|
||||
<div class='footer-top'>
|
||||
<ul class='footer-top-column'>
|
||||
<img src="https://s3.amazonaws.com/static.northpass.com/demos/QuadrigaRed.png" class="float-left show-for-medium" style="width:20px;margin:15px 0 0 -29px;position: absolute;" alt="">
|
||||
<li class='footer-top-column-title'>
|
||||
WEITERBILDUNGSANGEBOTE
|
||||
</li>
|
||||
<li class='footer-top-column-element'>
|
||||
Seminare
|
||||
</li>
|
||||
<li class='footer-top-column-element'>
|
||||
Online-Seminare
|
||||
</li>
|
||||
<li class='footer-top-column-element'>
|
||||
E-Learnings
|
||||
</li>
|
||||
<li class='footer-top-column-element'>
|
||||
Konferenzen
|
||||
</li>
|
||||
<button class='footer-top-column-button'>
|
||||
Zertifikats-Lehrgänge
|
||||
</button>
|
||||
</ul>
|
||||
<ul class='footer-top-column'>
|
||||
<img src="https://s3.amazonaws.com/static.northpass.com/demos/QuadrigaRed.png" class="float-left show-for-medium" style="width:20px;margin:15px 0 0 -29px;position: absolute;" alt="">
|
||||
<li class='footer-top-column-title'>
|
||||
DIE DEUTSCHE PRESSEAKADEMIE - DEPAK
|
||||
</li>
|
||||
<li class='footer-top-column-element'>
|
||||
Studienzentrum
|
||||
</li>
|
||||
<li class='footer-top-column-element'>
|
||||
Referent:innen
|
||||
</li>
|
||||
<li class='footer-top-column-element'>
|
||||
Team
|
||||
</li>
|
||||
<li class='footer-top-column-element'>
|
||||
Zum Lernportal der depak
|
||||
</li>
|
||||
</ul>
|
||||
<ul class='footer-top-column'>
|
||||
<img src="https://s3.amazonaws.com/static.northpass.com/demos/QuadrigaRed.png" class="float-left show-for-medium" style="width:20px;margin:15px 0 0 -29px;position: absolute;" alt="">
|
||||
<li class='footer-top-column-title'>
|
||||
TIPPS & SERVICE
|
||||
</li>
|
||||
<li class='footer-top-column-element'>
|
||||
AGB
|
||||
</li>
|
||||
<li class='footer-top-column-element'>
|
||||
Impressum
|
||||
</li>
|
||||
<li class='footer-top-column-element'>
|
||||
Datenschutz
|
||||
</li>
|
||||
<li class='footer-top-column-socials'>
|
||||
|
||||
</li>
|
||||
</ul>
|
||||
<ul class='footer-top-column'>
|
||||
<img src="https://s3.amazonaws.com/static.northpass.com/demos/QuadrigaRed.png" class="float-left show-for-medium" style="width:20px;margin:15px 0 0 -29px;position: absolute;" alt="">
|
||||
<li class='footer-top-column-title'>
|
||||
NEWS
|
||||
</li>
|
||||
<li class='footer-top-column-element'>
|
||||
Newsletter
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
<div class="footer-seperator"></div>
|
||||
<div class='footer-bottom'>
|
||||
<ul class='footer-bottom-links'>
|
||||
<li class='footer-botoom-links-elements'>Community Guidelines</li>
|
||||
<li class='footer-botoom-links-elements'>Quadriga Methodologies</li>
|
||||
<li class='footer-botoom-links-elements'>Terms of Use </li>
|
||||
<li class='footer-botoom-links-elements'>Privacy Policy </li>
|
||||
<li class='footer-botoom-links-elements'>Cookie Policy </li>
|
||||
<li class='footer-botoom-links-elements'>Copyright Complaint Policy </li>
|
||||
<li class='footer-botoom-links-elements'>Content Usage Guidelines </li>
|
||||
<li class='footer-botoom-links-elements'>Do Not Sell My Personal Information </li>
|
||||
</ul>
|
||||
<div class='footer-bottom-logo'>
|
||||
<img
|
||||
alt="{{ current_school.name }}"
|
||||
class="footer-bottom-logo-img"
|
||||
src="{{ current_school.logo_url }}"
|
||||
/>
|
||||
<div class='footer-bottom-logo-right'>
|
||||
<div class='footer-bottom-logo-right-element'>
|
||||
Quadriga Media Berlin GmbH
|
||||
</div>
|
||||
<div class='footer-bottom-logo-right-element'>
|
||||
Werderscher
|
||||
</div>
|
||||
<div class='footer-bottom-logo-right-element'>
|
||||
D-10117 Berlin, Germany
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class='footer-bottom-subline'>
|
||||
© 2022, Quadriga Media Berlin GmbH. All Rights Reserved.
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</footer>
|
||||
<style>
|
||||
@import url('https://fonts.googleapis.com/css2?family=Nunito+Sans:ital,wght@0,200;0,300;0,400;0,600;0,700;0,800;0,900;1,200;1,300;1,400;1,600;1,700;1,800;1,900&display=swap');
|
||||
</style>
|
||||
<style>
|
||||
.np-footer {
|
||||
background: #3F3437;
|
||||
}
|
||||
.footer-top {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
justify-content: space-evenly;
|
||||
width: 100%;
|
||||
}
|
||||
.footer-top-column {
|
||||
list-style-type: none;
|
||||
}
|
||||
.footer-top-column-title {
|
||||
color: white;
|
||||
font-size: 20px;
|
||||
font-weight: 700;
|
||||
margin-top: 10px;
|
||||
}
|
||||
.footer-top-column-element {
|
||||
color: white;
|
||||
font-size: 15px;
|
||||
line-height: 15px;
|
||||
font-weight: 400;
|
||||
padding: 9px 0;
|
||||
}
|
||||
.footer-top-column-button {
|
||||
background: none;
|
||||
border: 2px white solid;
|
||||
border-radius: 100px;
|
||||
padding: 9px 25px;
|
||||
font-size: 14px;
|
||||
color: white;
|
||||
font-weight: 600;
|
||||
}
|
||||
.footer-seperator {
|
||||
border-top: rgb(128, 128, 128) 1px solid;
|
||||
width: 90%;
|
||||
margin: auto;
|
||||
height: 1px;
|
||||
margin: 40px 0;
|
||||
}
|
||||
.footer-bottom-links {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
list-style-type: none;
|
||||
color: rgb(168, 168, 172);
|
||||
font-size: 14px;
|
||||
}
|
||||
.footer-botoom-links-elements {
|
||||
margin: 10px;
|
||||
}
|
||||
.footer-bottom-logo {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
color: rgb(168, 168, 172);
|
||||
font-size: 14px;
|
||||
}
|
||||
.footer-bottom-logo-img {
|
||||
height: 55px;
|
||||
margin: 0 10px 10px 0;
|
||||
}
|
||||
.footer-bottom-subline {
|
||||
color: rgb(168, 168, 172);
|
||||
font-size: 14px;
|
||||
}
|
||||
body {
|
||||
font-family: "Nunito Sans", sans-serif !important;
|
||||
}
|
||||
</style>
|
||||
@ -0,0 +1,13 @@
|
||||
{% styles default %}
|
||||
{% styles colors %}
|
||||
{% styles custom %}
|
||||
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
|
||||
|
||||
<script type="text/javascript">
|
||||
if (window.location.href.indexOf("/login") > -1 && window.location.href.indexOf("?email") > -1 ) {
|
||||
console.log(document.referrer)
|
||||
$('body').css("display", "none");
|
||||
$('input.np-button').click();
|
||||
}
|
||||
</script>
|
||||
|
||||
@ -0,0 +1,289 @@
|
||||
<header class="np-header np-header-color">
|
||||
<div class="np-header-content">
|
||||
<div class="np-hidden-desktop np-header-mobile-menu-nav">
|
||||
{% if current_person.signed_in? %}
|
||||
<button
|
||||
data-toggle-class="np-hidden"
|
||||
class="np-header-mobile-menu-nav-button fal fa-times np-hidden np-header-font-color"
|
||||
data-toggle-target=".np-header-mobile-avatar-menu,
|
||||
.np-header-mobile-menu-content, .np-main, .np-footer"
|
||||
></button>
|
||||
<button
|
||||
data-test="open-mobile-menu"
|
||||
data-toggle-class="np-hidden"
|
||||
class="np-header-mobile-menu-nav-button np-header-mobile-avatar-menu"
|
||||
data-toggle-target=".fa-times, .np-header-mobile-menu-content, .np-main, .np-footer"
|
||||
>
|
||||
<img
|
||||
alt="{{ current_person.name }}"
|
||||
class="np-header-avatar-image"
|
||||
src="{{ current_person.avatar_url }}"
|
||||
/>
|
||||
</button>
|
||||
{% endif %}
|
||||
</div>
|
||||
{% 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="np-hidden-mobile np-header-desktop-nav">
|
||||
<ul class="np-header-desktop-nav-list">
|
||||
<li class='np-header-right-menu-label' id='label1'>
|
||||
Themengebiete
|
||||
<i class="fas fa-chevron-down"></i>
|
||||
<ul class='np-header-right-menu-list' id='menu1'>
|
||||
<li class='np-header-right-menu-list-element'>
|
||||
Medienarbeit und Grundlagen der PR
|
||||
</li>
|
||||
<li class='np-header-right-menu-list-element'>
|
||||
Kommunikationsstrategie & -management
|
||||
</li>
|
||||
<li class='np-header-right-menu-list-element'>
|
||||
Social Media Management
|
||||
</li>
|
||||
<li class='np-header-right-menu-list-element'>
|
||||
Interne Kommunikation
|
||||
</li>
|
||||
<li class='np-header-right-menu-list-element'>
|
||||
Videos, Images, & Podcasts
|
||||
</li>
|
||||
<li class='np-header-right-menu-list-element'>
|
||||
Digitale Kommunikation & Online-Marketing
|
||||
</li>
|
||||
<li class='np-header-right-menu-list-element'>
|
||||
Leadership & Management-Kompetenzen
|
||||
</li>
|
||||
<li class='np-header-right-menu-list-element'>
|
||||
Public Affairs
|
||||
</li>
|
||||
<li class='np-header-right-menu-list-element'>
|
||||
Verhandlungsführung
|
||||
</li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class='np-header-right-menu-label' id='label2'>
|
||||
Weiterbildungsangebote
|
||||
<i class="fas fa-chevron-down"></i>
|
||||
<ul class='np-header-right-menu-list' id='menu2'>
|
||||
<li class='np-header-right-menu-list-element'>
|
||||
Seminare
|
||||
</li>
|
||||
<li class='np-header-right-menu-list-element'>
|
||||
Online-Seminare
|
||||
</li>
|
||||
<li class='np-header-right-menu-list-element'>
|
||||
E-Learnings
|
||||
</li>
|
||||
<li class='np-header-right-menu-list-element'>
|
||||
Konferenzen
|
||||
</li>
|
||||
<li class='np-header-right-menu-list-element'>
|
||||
Zertifikats-Lehrgänge
|
||||
</li>
|
||||
<li class='np-header-right-menu-list-element'>
|
||||
Inhouse-Schulungen
|
||||
</li>
|
||||
<li class='np-header-right-menu-list-element'>
|
||||
Young Professionals
|
||||
</li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class='np-header-right-menu-label' id='label3'>
|
||||
Über uns
|
||||
<i class="fas fa-chevron-down"></i>
|
||||
<ul class='np-header-right-menu-list' id='menu3'>
|
||||
<li class='np-header-right-menu-list-element'>
|
||||
Die Depak
|
||||
</li>
|
||||
<li class='np-header-right-menu-list-element'>
|
||||
Studienzentrum
|
||||
</li>
|
||||
<li class='np-header-right-menu-list-element'>
|
||||
Team
|
||||
</li>
|
||||
<li class='np-header-right-menu-list-element'>
|
||||
Tipps & Service
|
||||
</li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class='np-header-right-menu-label'>
|
||||
Newsletter
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
{% if current_person.signed_in? %}
|
||||
<div class="np-hidden-mobile np-header-search np-header-search-expanded">
|
||||
<form action="{% route search %}" method="get" data-test="desktop-search">
|
||||
<input
|
||||
aria-label="{% t .search %}"
|
||||
class="np-header-search-input np-header-font-background-color"
|
||||
type="text"
|
||||
name="q"
|
||||
placeholder="{% t .search %}"
|
||||
/>
|
||||
<i class="np-header-search-icon far fa-search"></i>
|
||||
</form>
|
||||
</div>
|
||||
<div class="np-hidden-mobile np-header-avatar">
|
||||
<button
|
||||
class="np-header-avatar-button"
|
||||
data-test="open-desktop-menu"
|
||||
data-toggle-class-on-target="np-hidden"
|
||||
data-toggle-target=".np-header-avatar-tooltip"
|
||||
data-toggle-outside
|
||||
>
|
||||
<img
|
||||
alt="{{ current_person.name }}"
|
||||
class="np-header-avatar-image"
|
||||
src="{{ current_person.avatar_url }}"
|
||||
>
|
||||
</button>
|
||||
<div class="np-header-avatar-tooltip np-hidden" role="tooltip">
|
||||
<span class="np-header-avatar-tooltip-arrow-up"></span>
|
||||
<div class="np-header-avatar-tooltip-learner">
|
||||
<div class="np-header-avatar-tooltip-learner-name">
|
||||
{{ current_person.name }}
|
||||
</div>
|
||||
<div class="np-header-avatar-tooltip-learner-email">
|
||||
{{ current_person.email }}
|
||||
</div>
|
||||
</div>
|
||||
<nav class="np-header-avatar-tooltip-navigation">
|
||||
{% unless current_school.sso_active? %}
|
||||
<a
|
||||
class="np-header-avatar-tooltip-navigation-link"
|
||||
href="{% route account %}"
|
||||
>
|
||||
{% t .profile_settings %}
|
||||
</a>
|
||||
{% endunless %}
|
||||
<a
|
||||
class="np-header-avatar-tooltip-navigation-link np-danger"
|
||||
href="{% route logout %}"
|
||||
>
|
||||
{% t .sign_out %}
|
||||
</a>
|
||||
</nav>
|
||||
</div>
|
||||
</div>
|
||||
{% else %}
|
||||
<a
|
||||
class="np-header-sign-in np-header-desktop-nav-link np-header-font-color"
|
||||
href="{% route login %}"
|
||||
>
|
||||
{% t shared.sign_in %}
|
||||
</div>
|
||||
{% endif %}
|
||||
</div>
|
||||
</header>
|
||||
|
||||
<div class="np-hidden-desktop">
|
||||
<div class="np-header-mobile-menu-content np-hidden">
|
||||
{% if current_person.signed_in? %}
|
||||
<img
|
||||
alt="{{ current_person.name }}"
|
||||
class="np-header-mobile-menu-content-avatar"
|
||||
src="{{ current_person.avatar_url }}"
|
||||
/>
|
||||
<div class="np-header-mobile-menu-content-name">
|
||||
{{ current_person.name }}
|
||||
</div>
|
||||
{% endif %}
|
||||
<div class="np-header-mobile-menu-content-nav">
|
||||
<form
|
||||
class="np-header-search"
|
||||
data-test="mobile-search"
|
||||
method="get"
|
||||
action="{% route search %}"
|
||||
>
|
||||
<input
|
||||
aria-label="{% t .search %}"
|
||||
class="np-header-search-input"
|
||||
type="text"
|
||||
name="q"
|
||||
placeholder="{% t .search %}"
|
||||
/>
|
||||
<i class="np-header-search-icon far fa-search"></i>
|
||||
</form>
|
||||
{% for website_navigation in navigations.header_navigations %}
|
||||
<a
|
||||
href="{{ website_navigation.path }}"
|
||||
class="np-header-mobile-menu-content-button"
|
||||
{% if website_navigation.external? %} target="_blank" {% endif %}
|
||||
>
|
||||
{{ website_navigation.name }}
|
||||
</a>
|
||||
{% endfor %}
|
||||
<div class="np-header-mobile-menu-content-line"></div>
|
||||
{% unless current_school.sso_active? %}
|
||||
<a
|
||||
class="np-header-mobile-menu-content-button"
|
||||
href="{% route account %}"
|
||||
>
|
||||
{% t .profile_settings %}
|
||||
</a>
|
||||
{% endunless %}
|
||||
<a
|
||||
class="np-header-mobile-menu-content-button np-danger"
|
||||
href="{% route logout %}"
|
||||
>
|
||||
{% t .sign_out %}
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{% include "messages" %}
|
||||
<style>
|
||||
.np-header-logo-image {
|
||||
height: 55px;
|
||||
}
|
||||
.np-header-right-menu-label {
|
||||
font-size: 18px;
|
||||
padding: 13px 18px;
|
||||
}
|
||||
.np-header-right-menu-list {
|
||||
position: absolute;
|
||||
top: 80px;
|
||||
display: none;
|
||||
padding: 15px;
|
||||
background: white;
|
||||
list-style-type: none;
|
||||
z-index: 10;
|
||||
border-top: 2px solid #5a39a2;
|
||||
margin-left: -25px;
|
||||
}
|
||||
.np-header-right-menu-list-element {
|
||||
padding: 10px 0;
|
||||
}
|
||||
#label1:hover > #menu1 {
|
||||
display: block
|
||||
}
|
||||
#menu1:hover {
|
||||
display: block;
|
||||
}
|
||||
#label2:hover > #menu2 {
|
||||
display: block
|
||||
}
|
||||
#menu2:hover {
|
||||
display: block;
|
||||
}
|
||||
#label3:hover > #menu3 {
|
||||
display: block
|
||||
}
|
||||
#menu3:hover {
|
||||
display: block;
|
||||
}
|
||||
</style>
|
||||
@ -0,0 +1,182 @@
|
||||
<div class='events-wrapper' id="events">
|
||||
<div class='events'>
|
||||
<div class='events-header'>
|
||||
<div class='events-header-title'>
|
||||
Online-Seminare unter der Leitung von Change Making-Rednern
|
||||
</div>
|
||||
<div class='events-header-subtitle'>
|
||||
Kommende Seminare, die Ihre Führungsqualitäten und Kommunikation in den Mittelpunkt stellen
|
||||
</div>
|
||||
</div>
|
||||
<div class='events-event'>
|
||||
<div class='events-event-left'>
|
||||
<div class='events-event-left-title'>
|
||||
Grundlagen der Internen Kommunikation
|
||||
</div>
|
||||
<div class='events-event-left-subtitle'>
|
||||
Strukturen, Konzepte und Prozesse für gelungene Mitarbeiterkommunikation
|
||||
</div>
|
||||
<div class='events-event-left-date'>
|
||||
23. - 24.03.2022
|
||||
</div>
|
||||
<button class='events-event-left-button'>
|
||||
Register
|
||||
</button>
|
||||
</div>
|
||||
<div class='events-event-right'>
|
||||
<div class='events-event-right-title'>
|
||||
Hosts
|
||||
</div>
|
||||
<div class='events-event-right-person'>
|
||||
<img class='events-event-right-person-image' src='https://products.quadriga.eu/app/uploads/2020/09/HP-100x100.png'>
|
||||
<div class='events-event-right-person-right'>
|
||||
<div class='events-event-right-person-right-name'>
|
||||
Amory Fanelsa
|
||||
</div>
|
||||
<div class='events-event-right-person-right-title'>
|
||||
Inhaberin, FanelsaPR
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class='events-event'>
|
||||
<div class='events-event-left'>
|
||||
<div class='events-event-left-title'>
|
||||
Positionspapiere schreiben
|
||||
</div>
|
||||
<div class='events-event-left-subtitle'>
|
||||
Mit Politikthemen überzeugen – für mehr Aufmerksamkeit, Wirkung und Einfluss
|
||||
</div>
|
||||
<div class='events-event-left-date'>
|
||||
30. - 31.03.2022
|
||||
</div>
|
||||
<button class='events-event-left-button'>
|
||||
Register
|
||||
</button>
|
||||
</div>
|
||||
<div class='events-event-right'>
|
||||
<div class='events-event-right-title'>
|
||||
Host
|
||||
</div>
|
||||
<div class='events-event-right-person'>
|
||||
<img class='events-event-right-person-image' src='https://products.quadriga.eu/app/uploads/2018/10/buelow-mechthild-100x100.png'>
|
||||
<div class='events-event-right-person-right'>
|
||||
<div class='events-event-right-person-right-name'>
|
||||
Mechthild Bülow
|
||||
</div>
|
||||
<div class='events-event-right-person-right-title'>
|
||||
Inhaberin, Mechthild Bülow Public Affairs
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<style>
|
||||
.events-wrapper {
|
||||
background-image: url('https://www.quadriga-hochschule.com/app/uploads/2021/04/qhs-16_9_color-neu.jpg');
|
||||
background-repeat: no-repeat;
|
||||
background-size: cover;
|
||||
background-position: center;
|
||||
}
|
||||
.events {
|
||||
width: 70%;
|
||||
margin: auto;
|
||||
padding: 120px 0;
|
||||
}
|
||||
.events-header {
|
||||
width: 55%;
|
||||
margin: auto;
|
||||
margin-bottom: 100px;
|
||||
}
|
||||
.events-header-title {
|
||||
font-size: 43px;
|
||||
font-weight: 800;
|
||||
text-align: center;
|
||||
}
|
||||
.events-header-subtitle {
|
||||
font-size: 21px;
|
||||
font-weight: 400;
|
||||
text-align: center;
|
||||
margin-top: 40px;
|
||||
}
|
||||
.events-event {
|
||||
width: 70%;
|
||||
margin: 20px auto;
|
||||
background: rgb(255, 251, 238);
|
||||
padding: 50px 60px;
|
||||
display: flex;
|
||||
border-radius: 5px;
|
||||
box-shadow: rgba(0, 0, 0, 0.05) 0px 2px 20px 10px;
|
||||
|
||||
}
|
||||
.events-event-left {
|
||||
width: 55%;
|
||||
}
|
||||
.events-event-left-title {
|
||||
font-size: 28px;
|
||||
font-weight: 800;
|
||||
color: rgb(6, 40, 70);
|
||||
margin: 10px 0 20px;
|
||||
}
|
||||
.events-event-left-subtitle {
|
||||
font-size: 21px;
|
||||
font-weight: 400;
|
||||
color: rgba(0, 0, 0, 0.75);
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
.events-event-left-date {
|
||||
font-size: 21px;
|
||||
font-weight: 800;
|
||||
color: rgb(6, 40, 70);
|
||||
margin: 10px 0;
|
||||
}
|
||||
.events-event-left-button {
|
||||
background: none;
|
||||
border: 2px solid rgb(6, 40, 70);
|
||||
color: rgb(6, 40, 70);
|
||||
font-size: 16px;
|
||||
font-weight: 700;
|
||||
padding: 12px 45px;
|
||||
margin-top: 40px;
|
||||
border-radius: 25px;
|
||||
}
|
||||
.events-event-right {
|
||||
margin-left: 70px;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
}
|
||||
.events-event-right-title {
|
||||
font-size: 21px;
|
||||
font-weight: 800;
|
||||
color: rgb(155, 169, 181);
|
||||
margin-top: 10px;
|
||||
}
|
||||
.events-event-right-person {
|
||||
display: flex;
|
||||
margin: 30px 0;
|
||||
}
|
||||
.events-event-right-person-image {
|
||||
border-radius: 50%;
|
||||
height: 52px;
|
||||
}
|
||||
.events-event-right-person-right {
|
||||
margin-left: 20px;
|
||||
}
|
||||
.events-event-right-person-right-name {
|
||||
color: rgb(6, 40, 70);
|
||||
font-size: 16px;
|
||||
font-weight: 700;
|
||||
margin-bottom: 7px;
|
||||
}
|
||||
.events-event-right-person-right-title {
|
||||
color: rgb(38, 49, 61);
|
||||
font-size: 16px;
|
||||
font-weight: 400;
|
||||
}
|
||||
|
||||
</style>
|
||||
@ -0,0 +1,94 @@
|
||||
{% include "header" %}
|
||||
{% include "course_version_outdated_alert", courses: courses.featured %}
|
||||
<main class="np-main np-homepage">
|
||||
<div class="np-homepage-hero">
|
||||
<img class="np-homepage-hero-image"
|
||||
src="{{ homepage.artwork_url }}"
|
||||
alt="{{ homepage.headline }}"
|
||||
/>
|
||||
<div class="np-homepage-hero-content">
|
||||
<img class='np-homepage-hero-logo' src='https://s3.amazonaws.com/static.northpass.com/demos/QuadrigaRed.png'>
|
||||
<div class="np-homepage-headline np-header-font-color">
|
||||
{{ homepage.headline }}
|
||||
</div>
|
||||
<div class="np-homepage-subheadline np-header-font-color">
|
||||
{{ homepage.subheadline }}
|
||||
</div>
|
||||
<hr class='np-divider-line'>
|
||||
<div class='np-homepage-buttons'>
|
||||
<a class="np-homepage-hero-cta np-button" href="#courses">
|
||||
Human Resources
|
||||
</a>
|
||||
<a class="np-homepage-hero-cta np-button" href="#events">
|
||||
Marketing & PR
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
{% include 'courses_catalog' %}
|
||||
{% include 'homepage_events' %}
|
||||
</main>
|
||||
{% include "footer" %}
|
||||
|
||||
<style>
|
||||
body {
|
||||
background: #FEFEFE
|
||||
}
|
||||
.np-main {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
.np-powered-by {
|
||||
background: rgb(6, 40, 70);
|
||||
}
|
||||
.np-homepage-hero-image {
|
||||
max-height: 615px;
|
||||
height: 100%;
|
||||
object-fit: contain;
|
||||
}
|
||||
.np-homepage-hero-logo {
|
||||
width: 125px;
|
||||
}
|
||||
.np-homepage-headline {
|
||||
font-size: 67px !important;
|
||||
font-weight: 800 !important;
|
||||
}
|
||||
.np-homepage-subheadline {
|
||||
color: rgb(38, 49, 61) !important;
|
||||
font-size: 28px !important;
|
||||
font-weight: 400 !important;
|
||||
max-width: 630px !important;
|
||||
line-height: 1.2;
|
||||
margin-left: 100px;
|
||||
}
|
||||
.np-divider-line {
|
||||
width: 500px;
|
||||
margin: 40px auto 40px auto;
|
||||
border-width: 5px 0 0 0;
|
||||
border-style: solid;
|
||||
border-color: #EA4A58;
|
||||
font-size: 1rem;
|
||||
transition-timing-function: cubic-bezier(0.400,0.000,0.200,1.000);
|
||||
}
|
||||
.np-homepage-buttons {
|
||||
display: flex;
|
||||
margin: 25px auto;
|
||||
justify-content: center;
|
||||
color: #EA4A58;
|
||||
}
|
||||
.np-homepage-hero-cta {
|
||||
height: 53px !important;
|
||||
border-radius: 100px !important;
|
||||
padding: 12px 45px !important;
|
||||
margin: 0 15px !important;
|
||||
}
|
||||
</style>
|
||||
|
||||
<script>
|
||||
window.onload = function() {
|
||||
[].slice.call(document.getElementsByClassName("np-card-content-subtitle")).forEach(function(element) {
|
||||
if(element.innerText.length > 100){
|
||||
element.innerText = element.innerText.slice(0,100) + '...'
|
||||
}
|
||||
});
|
||||
}
|
||||
</script>
|
||||
Reference in New Issue
Block a user