Produits Entr'ouvert » Intégrations graphiques Publik

@mixin bottom-border($max-width: 19rem) {

	&::after {

		display: block;

		margin: 1.5rem 0;

		content: '';

		max-width: $max-width;

		width: 100%;

		height: 0.3125rem;

		background-color: $primary-color;

	}

}

%button {

	text-transform: uppercase;

	font-weight: 700;

	font-size: 0.87rem;

	padding: 5px 15px;

	line-height: 1rem;

	color: #ffffff;

}

div#nav {

	margin-top: 0;

	margin-bottom: 0;

	> ul {

		margin-top: 0;

		margin-bottom: 0;

	}

}

#main-content {

	background: white;

	padding: 10px;

	@media screen and (max-width: $mobile-limit) {

		padding: 10px 0;

	}

}

label {

	color: $primary-color;

	text-transform: uppercase;

	font-family: "Roboto Condensed", sans-serif;

	font-size: 1.125rem;

	margin-bottom: 20px;

}

input, select, textarea {

	box-shadow: 1px 2px 8px rgba(23, 23, 22, 0.2);

	height: 2.2rem;

}

div#rub_service {

	h2 {

		color: #000000;

		margin: 0;

		text-align: left;

		padding: 1ex;

	}

	>h2:first-child {

		@include bottom-border(100%);

	}

	div.back-home-button {

		margin-bottom: 3ex;

		a {

			@extend %button;

			background-color: $button-background;

			border-radius: $button-border-radius;

			&::before {

				content: '\f053'; /* chevron-left */

				font-family: FontAwesome;

				margin-right: 0.5rem;

			}

		}

	}

}

.gru-content {

	div.cell, div.block, div.a2-block {

		box-shadow: 2px 3px 5px rgba(0, 0, 0, 0.28);

		padding-bottom: 0.1ex;

		margin-bottom: 1.4rem;

		h2:first-child {

			&::before {

				content: url("images/icon-pause.png");

				position: absolute;

				left: 0;

				top: 30%;

			}

		}

	}

	button {

		@extend %button;

	}

}

div.cell {

	h2:first-child {

		&::before {

			content: url("images/icon-pause.png");

			position: absolute;

			left: 0;

		}

	}

	&.trackingcodeinputcell {

		background-color: $primary-color;

		font-family: Roboto, serif;

		color: #ffffff;

		border-color: $primary-color;

		h2:first-child {

			color: #ffffff;

			font-size: 1.875rem;

			padding: 1ex;

			background-color: $primary-color;

			&::before {

				display: none;

			}

		}

		button {

			background: #ffffff;

			color: $primary-color;

		}

		#tracking-code {

			width: 13rem;

			padding: 0 1rem;

			color: $primary-color;

			height: 3.125rem;

			margin-right: 0.325rem;

		}

	}

	&.dashboard-title {

		box-shadow: 2px 3px 5px rgba(0, 0, 0, 0.28);

		h2:first-child {

			padding: 1ex;

			background-color: #eeeeee;

			font-size: 1.875rem;

			&::before {

				display: none;

			}

		}

	}

	&.dashboard {

		border: 0;

		padding: 1.5rem;

		background-color: #eeeeee;

		ul {

			li {

				a {

					font-weight: 700;

					font-size: 1.1rem;

					color: #a9aaac;

					border-bottom: 1px solid #a9aaac;

					&:hover {

						color: #00515e;

						text-decoration: underline;

					}

				}

				&.selected a {

					color: #00515e;

					text-decoration: underline;

				}

				@each $item in (profil, demandes, porte-document, alertes) {

					&.menu-#{$item} a {

						background-image: url('images/#{$item}.png');

						background-size: auto 2.5em;

						background-repeat: no-repeat;

						padding: 1.5rem 0 1.5rem 3.5rem;

						background-position: left center;

						&:hover {

							background-image: url('images/#{$item}-active.png');

						}

					}

					&.menu-#{$item}.selected a {

						background-image: url('images/#{$item}-active.png');

					}

				}

			}

		}

	}

}

ul.account-management li {

	padding: 0;

	a {

		font-weight: 700;

	}

}

.field {

	margin-bottom: 0.95rem;

	.label {

		padding: 0;

		text-align: left;

	}

	.value {

		font-weight: 700;

		line-height: 1.125rem;

	}

}

div.block {

	flex-wrap: wrap;

	@media screen and (max-width: $mobile-limit) {

		padding: 0;

	}

}

div.login-actions {

	font-style: italic;

	font-size: 1.125rem;

	line-height: 1.25rem;

	color: #636361;

	margin-bottom: 1.25rem;

}

div#login-page {

	display: flex;

	justify-content: center;

	padding: 3.75rem 0;

	div.block {

		max-width: 26.25rem;

		box-sizing: border-box;

		width: 100%;

		background-color: #eeeeee;

		h2:first-child {

			background-color: #eeeeee;

		}

	}

	div#welcome-text {

		display: none;

	}

	p {

		margin-bottom: 1.875rem;

	}

	form {

		input {

			width: 100%;

		}

		@include bottom-border;

	}

}

div#fc-button {

	box-shadow: 0 0 0;

	@media screen and (max-width: $mobile-limit) {

		width: 220px;

	}

	a.button div {

		height: auto;

	}

}

div#fc-button-wrapper p {

	line-height: 1.4;

	font-size: 1.125rem;

}

div.wcsformsofcategorycell ul {

	> li > a {

		border: 0;

		position: relative;

		padding-left: 2rem;

		&::before {

			position: absolute;

			content: '\f0da'; /* caret-right */

			font-family: FontAwesome;

			margin-right: 0.5rem;

			color: #cccccc;

			left: 1rem;

		}

	}

}

div#tracking-code {

	color: #ffffff;

	background-color: $primary-color;

	h3 {

		background-color: $primary-color;

		color: #ffffff;

		padding-left: 0.5ex;

	}

	a {

		color: #ffffff;

		font-size: 100%;

	}

}

div#steps ol {

	background-color: #eeeeee;

	padding: 0 1ex;

	li {

		display: flex;

		align-items: center;

		span.marker {

			font-size: 150%;

			font-weight: 700;

		}

		span.marker, span.label {

			color: #aaaaaa;

			white-space: wrap;

			text-align:left;

			white-space: normal;

		}

		&.current {

			border-bottom: 1px solid #ccc;

			@media screen and (max-width: $mobile-limit) {

				border-bottom: 0;

			}

			span.marker, span.label {

				color: $primary-color;

			}

		}

	}

}

div.widget {

	@include bottom-border;

}

div.buttons {

	div.widget::after {

		display: none;

	}

	> div {

		@media screen and (max-width: $mobile-limit) {

			float: none;

		}

	}

	div.submit-button {

		float: right;

		button::after {

			content: '\f054'; /* chevron-right */

			font-family: FontAwesome;

			margin-left: 0.5rem;

		}

	}

	div.previous-button {

		float: right;

		button::before {

			content: '\f053'; /* chevron-left */

			font-family: FontAwesome;

			margin-right: 0.5rem;

		}

	}

	div.cancel-button {

		float: left;

		@media screen and (max-width: $mobile-limit) {

			float: none;

		}

	}

}

div#summary {

	position: relative;

	h2 {

		@include bottom-border(73%);

	}

	a#disclose-dataview {

		background: $primary-color;

		position: absolute;

		right: 0;

		top: 30%;

		color: #ffffff;

		padding: 0.3rem 0.6rem;

		font-family: 'Bitter', sans-serif;

		font-weight: 700;

		&::after {

			content: '\f078'; /* chevron-down */

			font-family: FontAwesome;

			margin-left: 0.5rem;

		}

	}

	div.dataview {

		div.page {

			h3 {

				font-family: 'Bitter', sans-serif;

				font-size: 1.875rem;

				font-weight: 700;

			}

			@include bottom-border;

		}

		span.label {

			color: $primary-color;

			text-transform: uppercase;

			font-family: "Roboto Condensed", sans-serif;

			margin-bottom: 0.625rem;

			font-size: 1.25rem;

			font-weight: 700;

			display: inline-block;

			padding: 0;

		}

		div.value, span.value {

			color: #636361;

			font-family: "Roboto", sans-serif;

			font-size: 1.25rem;

			font-weight: normal;

			margin: 0;

		}

	}

}

ul#evolutions, div#receipt-intro {

	font-size: 1.25rem;

	color: #636361;

}

ul#evolutions {

	li span.item {

		background: $primary-color !important;

		color: #ffffff !important;

	}

	&::after, li::after {

		background: $primary-color;

	}

	span.status {

		font-weight: normal;

	}

	div.evolution-metadata {

		padding-top: 15px;

	}

}

$primary-color: #0094aa;

$font-family: Roboto, sans-serif;

$font-color: #222;

$font-size: 16px;

$width: 1230px;

$border-radius: 0;

$nav-background: $primary-color;

$nav-color: white;

$nav-active-color: lighten($primary-color, 10%);

$nav-button-background: transparent;

$footer-background: #636361;

$link-color: $primary-color;

$sidebar-width: 450px;

$title-color: #636361;

$title-weight: 700;

$title-font-size: 1.5rem;

$title-font-family: "Bitter", sans-serif;

$title-padding: 1ex 1ex 1ex 3ex;

$title-background: transparent;

$cell-title-cover-border: false;

$cell-entry-hover-effect: none;

$cell-border: 0;

$button-background: $primary-color;

$button-border-radius: 1.8rem;

$widget-border: 1px solid $primary-color;

$widget-focus-background: #ffffff;

@charset "UTF-8";

@import 'vars';

@import '../includes/publik';

@import 'custom';

#! /usr/bin/env python

import os

import subprocess

import re

import sys

from lxml import etree

from lxml.html import html_parser

FILENAME = 'tmp.html'

if os.path.exists(FILENAME):

    os.unlink(FILENAME)

URL = 'https://perso.entrouvert.org/~smihai/villeurbanne/sample.php'

subprocess.call(['wget', '--quiet', '-O', FILENAME, '--convert-links', URL])

content = open(FILENAME).read().strip()

if len(content) < 500:

    sys.exit(0)

root = etree.fromstring(content, parser=html_parser)

for script in root.xpath('//script'):

    # remove all google related tags

    if script.text and 'google' in script.text or 'google' in script.attrib.get('src', ''):

        parent = script.getparent()

        parent.remove(script)

# remove external undesired elements

elements = ['container.css', 'font-awesome']

for link in root.xpath('//link'):

    for element in elements:

        if element in link.attrib['href']:

            parent = link.getparent()

            parent.remove(link)

# empty "content" container

for content in root.xpath('//div[@class="main-content"]/div[@class="container"]'):

    content.clear()

    content.attrib['class'] ='publik-container'

content = etree.tostring(root, method='html', pretty_print=True)

# remove all references to downloaded temporary file

content = content.replace(FILENAME, '')

# remove copy of jquery

content = re.sub('<script src=.*jquery.min.js.*', '', content)

content = content.replace('<head>', '<head>{% block head %}{% endblock %}')

content = content.replace('</head>', '<title>{% block global_title %}{% endblock %}</title>\n</head>')

content = content.replace('<body',

        r'<body {% block bodyargs %}{% endblock %} ')

content = content.replace('<div class="publik-container">', '''

<div class="publik-container">

{% block nav %}{% endblock %}

{% block messages %}

{% endblock %}

{% block site-content %}

{% endblock %}''')

content = content.replace('</body>', '''

{% block tracking %}

{% endblock %}

</body>

''')

open('base-theme.html', 'w').write(content)

{% extends 'base-theme.html' %}

{% load i18n static combo %}

{% block global_title %}

{% firstof global_title "Villeurbanne" %} {% block title %}{% endblock %}

{% endblock %}

{% block head %}

    {% if meta_robots %}

    <meta name="robots" content="{{ meta_robots }}" />

    {% elif environment_label %}

    <meta name="robots" content="noindex, nofollow, noarchive, nosnippet, notranslate, noimageindex" />

    {% endif %}

    {% if meta_description %}

    <meta name="description" content="{{ meta_description }}" />

    {% endif %}

    {% if favicon %}

    <link rel="shortcut icon" href="{{site_base}}{% static "" %}{{favicon}}" />

    {% endif %}

    {% block extra_top_head %}

    {% endblock %}

    {{ media }}

    <link rel="stylesheet" type="text/css" href="{{site_base}}{% static 'villeurbanne-2018/style.css' %}?{{statics_hash}}">

    {% block extra_css %}

    {% endblock %}

    {% block extra_scripts %}

    {% endblock %}

{% endblock %}

{% block bodyargs %}class="touch-ok {% block bodyclasses %}{% endblock %}" {% block bodyattrs %}{% endblock %}{% endblock %}

{% block 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&eacute;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 %}

{% endblock %}

{% block nav %}

<nav>

<div id="nav" class="togglable">

{% block menu %}

{% endblock %}

</div>

</nav>

{% endblock %}

{% block messages %}

{% if messages %}

<div id="messages">

  <ul class="messages">

      {% for message in messages %}

      <li{% if message.tags %} class="{{ message.tags }}"{% endif %}>{{ message }}</li>

      {% endfor %}

  </ul>

</div>

{% endif %}

{% endblock %}

{% block site-content %}

<div id="main-content-wrapper">

  <div id="main-content">

    <div id="content" class="gru-content">

      {% block content %}

      {% endblock %}

    </div>

  </div>

{% endblock %}

{% block tracking %}

    {% include "includes/tracking.html" %}

{% endblock %}

  {"id": "villeurbanne-2018",

   "label": "Villeurbanne 2018",

   "variables": {

     "css_variant": "villeurbanne-2018",

     "no_extra_js": true,

     "theme_color": "#00515e"

   }

  },