moselle: add initial basic theme (#21304)
This commit is contained in:
parent
b55b61acd6
commit
042046be9d
|
|
@ -0,0 +1,151 @@
|
|||
#page {
|
||||
background: #712281;
|
||||
}
|
||||
|
||||
#toplinks {
|
||||
z-index: 100;
|
||||
font-size: 80%;
|
||||
box-shadow: none;
|
||||
}
|
||||
|
||||
header {
|
||||
background: $primary-color;
|
||||
position: fixed;
|
||||
top: 0;
|
||||
left: 0;
|
||||
z-index: 100;
|
||||
#header {
|
||||
transition: all ease 0.2s;
|
||||
margin-top: 0.5rem;
|
||||
margin-bottom: 1rem;
|
||||
h1 {
|
||||
margin-top: 0.4rem;
|
||||
a {
|
||||
padding-left: 1rem;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
div#nav {
|
||||
position: fixed;
|
||||
top: 0;
|
||||
right: 0;
|
||||
width: 100%;
|
||||
max-width: unset;
|
||||
text-align: right;
|
||||
padding-right: 1rem;
|
||||
border-bottom: 1px solid darken($primary-color, 30%);
|
||||
z-index: 10;
|
||||
margin-top: 0;
|
||||
& > ul {
|
||||
transition: all ease 0.2s;
|
||||
margin-top: 2rem;
|
||||
margin-bottom: 2rem;
|
||||
li > a {
|
||||
font-weight: normal;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
div#main-content-wrapper {
|
||||
background: white;
|
||||
z-index: 0;
|
||||
padding: 8rem 1rem 0 1rem;
|
||||
box-sizing: border-box;
|
||||
|
||||
&::after,
|
||||
&::before {
|
||||
content: "";
|
||||
background: url(mos.png) center right no-repeat;
|
||||
background-size: 200px;
|
||||
position: absolute;
|
||||
width: 200px;
|
||||
height: 100%;
|
||||
left: -200px;
|
||||
top: 0;
|
||||
}
|
||||
&::after {
|
||||
left: auto;
|
||||
right: -200px;
|
||||
}
|
||||
}
|
||||
|
||||
body.has-picture {
|
||||
nav::after {
|
||||
content: "";
|
||||
display: block;
|
||||
width: 100%;
|
||||
height: 600px;
|
||||
background: white center center no-repeat;
|
||||
background-size: cover;
|
||||
}
|
||||
div#main-content-wrapper {
|
||||
padding-top: 1rem;
|
||||
}
|
||||
}
|
||||
|
||||
#logo a {
|
||||
background: url(logo.png) top left no-repeat;
|
||||
background-size: cover;
|
||||
text-indent: -10000px;
|
||||
display: block;
|
||||
height: 80px;
|
||||
width: 240px;
|
||||
color: $primary-color;
|
||||
font-weight: normal;
|
||||
}
|
||||
|
||||
body.scrolled {
|
||||
header #header {
|
||||
margin: 0;
|
||||
}
|
||||
div#nav > ul {
|
||||
margin-top: 0.5rem;
|
||||
margin-bottom: 0.5rem;
|
||||
}
|
||||
#logo a {
|
||||
height: 50px;
|
||||
width: 150px;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
|
||||
footer {
|
||||
border-top: 10px solid $primary-color;
|
||||
z-index: 100;
|
||||
}
|
||||
|
||||
@media screen and (max-width: $mobile-limit) {
|
||||
#page {
|
||||
background: transparent;
|
||||
}
|
||||
div#nav, header {
|
||||
text-align: left;
|
||||
position: static;
|
||||
width: unset;
|
||||
padding-right: 0;
|
||||
border-bottom: 0;
|
||||
#header h1 a {
|
||||
padding-left: 0;
|
||||
}
|
||||
}
|
||||
|
||||
header #header,
|
||||
div#nav > ul {
|
||||
margin-top: 2rem;
|
||||
margin-bottom: 1rem;
|
||||
}
|
||||
|
||||
div#main-content-wrapper {
|
||||
padding-top: 0;
|
||||
}
|
||||
|
||||
#toplinks {
|
||||
right: 1vw;
|
||||
left: auto;
|
||||
top: -2rem;
|
||||
width: auto;
|
||||
}
|
||||
}
|
||||
|
|
@ -0,0 +1,21 @@
|
|||
$font-color: #333;
|
||||
$primary-color: #f7433a;
|
||||
$border-radius: 3px;
|
||||
$width: 1100px;
|
||||
|
||||
$nav-background: $primary-color;
|
||||
$nav-color: white;
|
||||
$nav-active-color: $primary-color;
|
||||
$nav-submenu-color: white;
|
||||
$nav-item-hover-background: lighten($primary-color, 10%);
|
||||
|
||||
$footer-background: white;
|
||||
$footer-color: $font-color;
|
||||
|
||||
$button-background: $primary-color;
|
||||
$button-color: white;
|
||||
$cell-border: 1px solid transparent;
|
||||
$title-border-bottom: 2px solid $primary-color;
|
||||
$title-border-radius: 0;
|
||||
|
||||
$notification-style: border-icon;
|
||||
|
|
@ -0,0 +1,15 @@
|
|||
$(function() {
|
||||
/* set page picture as background */
|
||||
if (document.body.attributes['data-picture']) {
|
||||
var sheet = document.head.appendChild(document.createElement("style")).sheet;
|
||||
sheet.insertRule('body.has-picture nav::after { background-image: url(' + document.body.attributes['data-picture'].value + ')');
|
||||
}
|
||||
/* add a class to body when the page got scrolled */
|
||||
$(window).on('scroll', function() {
|
||||
if ($(window).scrollTop() == 0) {
|
||||
$('body').removeClass('scrolled');
|
||||
} else {
|
||||
$('body').addClass('scrolled');
|
||||
}
|
||||
});
|
||||
});
|
||||
Binary file not shown.
|
After Width: | Height: | Size: 12 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 43 KiB |
|
|
@ -0,0 +1,5 @@
|
|||
@charset "UTF-8";
|
||||
|
||||
@import 'vars';
|
||||
@import '../includes/publik';
|
||||
@import 'custom';
|
||||
|
|
@ -0,0 +1,28 @@
|
|||
{% extends "../../combo/page_template.html" %}
|
||||
{% load combo %}
|
||||
|
||||
{% block nav %}
|
||||
|
||||
<div id="toplinks">
|
||||
{% block user-info %}
|
||||
{% skeleton_extra_placeholder user-info %}
|
||||
{% if user.is_authenticated %}
|
||||
<span class="logged-in">
|
||||
{% if idp_account_url %}<a href="{{idp_account_url}}">{% endif %}
|
||||
<span class="connected-user">{{user.first_name}} {{user.last_name}}</span>{% if idp_account_url %}</a>{% endif %}
|
||||
<a accesskey="o" class="logout" href="{% url 'auth_logout' %}">Déconnexion</a>
|
||||
</span>
|
||||
{% else %}
|
||||
{% if idp_registration_url %}
|
||||
<span class="login"><a accesskey="2" href="{% url 'auth_login' %}">Connexion</a> <span class="sep">/</span>
|
||||
<a class="registration" href="{{idp_registration_url}}">Inscription</a></span>
|
||||
{% else %}
|
||||
<span class="login"><a accesskey="2" href="{% url 'auth_login' %}">Connexion <span class="sep">/</span> Inscription</a></span>
|
||||
{% endif %}
|
||||
{% endif %}
|
||||
{% end_skeleton_extra_placeholder %}
|
||||
{% endblock %}
|
||||
</div>
|
||||
|
||||
{{ block.super }}
|
||||
{% endblock %}
|
||||
10
themes.json
10
themes.json
|
|
@ -309,6 +309,16 @@
|
|||
},
|
||||
"overlay": "montpellier-theme"
|
||||
},
|
||||
{"id": "moselle",
|
||||
"label": "Moselle",
|
||||
"variables": {
|
||||
"css_variant": "moselle",
|
||||
"include_top_links": false,
|
||||
"no_extra_js": false,
|
||||
"theme_color": "#f7433a"
|
||||
}
|
||||
},
|
||||
|
||||
{"id": "nancy",
|
||||
"label": "Nancy",
|
||||
"variables": {
|
||||
|
|
|
|||
Loading…
Reference in New Issue