svg

Co-authored-by: Arnaud Fornerot <afornerot@cadoles.com>
Reviewed-on: #8

.env

@@ -0,0 +1,175 @@
+# Symfony
+APP_ENV=prod
+APP_SECRET=changeme
+APP_SESSIONTIME=1440
+
+# Messenger
+MESSENGER_TRANSPORT_DSN=doctrine://default?auto_setup=0
+
+# Database
+DATABASE_URL="postgresql://symfony:ChangeMe@127.0.0.1:5432/nineblog?serverVersion=13&charset=utf8"
+
+# Redis Session
+REDIS_HOST=127.0.0.1
+REDIS_PORT=6379
+
+# Mailer
+MAILER_METHOD=smtp
+MAILER_DSN=smtp://127.0.0.1:1025
+MAILER_NOREPLY=noreply@noreply.fr
+
+# Basic
+APP_WEBURL=127.0.0.1:8000
+APP_MASTERIDENTITY=SQL          # SQL | SSO | LDAP
+APP_AUTH=SQL                    # SQL | CAS | LDAP | OPENID | à faire SAML
+APP_ALIAS=/
+APP_NAME=Nineblog
+APP_MODEREGISTRATION=           # null | BYADMIN | BYUSER
+APP_ADMINS='["admin"]'
+
+# Structure Organisationnelle
+APP_NIVEAUUPDATABLE=0           # Quel degres de niveau est modifiable par les utilisateurs seule les admin et modo via console peuvent outre passer ce param
+
+APP_NIVEAU01LABEL="Niveau 01"
+APP_NIVEAU01LABELS="Niveaux 01"
+
+APP_NIVEAU02USE=1
+APP_NIVEAU02LABEL="Niveau 02"
+APP_NIVEAU02LABELS="Niveaux 02"
+APP_NIVEAU02MANDATORY='[""]'
+
+APP_NIVEAU03USE=1
+APP_NIVEAU03LABEL="Niveau 03"
+APP_NIVEAU03LABELS="Niveaux 03"
+APP_NIVEAU03MANDATORY='[""]'
+
+APP_NIVEAU04USE=0
+APP_NIVEAU04LABEL="Niveau 04"
+APP_NIVEAU04LABELS="Niveaux 04"
+APP_NIVEAU04MANDATORY='[""]'
+
+APP_GROUPUSE=1
+APP_GROUPSUBMITER='["ALL"]'
+
+APP_ANNUSCOPEADMIN=ALL          # ALL or number of niveau view : 1||2||3||4
+APP_ANNUSCOPEMODO=ALL           # ALL or number of niveau view : 1||2||3||4
+APP_ANNUSCOPEMASTER=ALL         # ALL or number of niveau view : 1||2||3||4
+APP_ANNUSCOPEMANAGER=ALL        # ALL or number of niveau view : 1||2||3||4
+APP_ANNUSCOPEUSER=ALL           # ALL or number of niveau view : 1||2||3||4
+
+APP_USERVIEWISVISIBLE=1         # Profil user with isvisible field  
+
+# Synchronisation
+APP_SYNCHRO=                    # Synchronisation null | LDAP2NINE | NINE2LDAP | NINE2NINE
+APP_SYNDCHROPURGENIVEAU01=1     # Purger les niveau01s obsolète en cas de synchronisation
+APP_SYNDCHROPURGENIVEAU02=1     # Purger les niveau02s obsolète en cas de synchronisation
+APP_SYNDCHROPURGENIVEAU03=1     # Purger les niveau03s obsolète en cas de synchronisation
+APP_SYNDCHROPURGENIVEAU04=1     # Purger les niveau04s obsolète en cas de synchronisation
+APP_SYNDCHROPURGEGROUP=1        # Purger les groups obsolète en cas de synchronisation
+APP_SYNDCHROPURGEUSER=1         # Purger les users obsolète en cas de synchronisation
+
+# LDAP
+LDAP_HOST=                      # host du serveur ldap
+LDAP_PORT=                      # port du serveur ldap
+LDAP_USETLS=0                   # connection TLS 0/1
+LDAP_USERWRITER=0               # LDAP_USER compte writer ? 0/1
+LDAP_USER=                      # DN compte access ldap
+LDAP_PASSWORD=                  # Password comte access ldap
+LDAP_BASEDN=                    # Base DN ex:dc=nine,dc=fr
+LDAP_BASEORGANISATION=          # Base Organisation ex:ou=nineblog,dc=nine,dc=fr
+LDAP_BASENIVEAU01=              # Base Niveau01 ex:ou=niveau01,ou=nineblog,dc=nine,dc=fr
+LDAP_BASENIVEAU02=              # Base Niveau02 ex:ou=niveau02,ou=nineblog,dc=nine,dc=fr
+LDAP_BASENIVEAU03=              # Base Niveau03 ex:ou=niveau03,ou=nineblog,dc=nine,dc=fr
+LDAP_BASENIVEAU04=              # Base Niveau04 ex:ou=niveau04,ou=nineblog,dc=nine,dc=fr
+LDAP_BASEGROUP=                 # Base Group ex:ou=groups,ou=nineblog,dc=nine,dc=fr
+LDAP_BASEUSER=                  # Base User ex:ou=users,ou=nineblog,dc=nine,dc=fr
+LDAP_USERNAME=uid               # Attribut id d'un user
+LDAP_FIRSTNAME=givenname        # Attribut firstname d'un user
+LDAP_LASTNAME=sn                # Attribut lastname d'un user
+LDAP_EMAIL=mail                 # Attribut email d'un user
+LDAP_AVATAR=                    # Attribut avatar d'un user
+LDAP_MEMBEROF=memberof          # Attribut memberof d'un user
+LDAP_GROUPGID=gidnumber         # Attribut gid d'un groupe
+LDAP_GROUPNAME=cn               # Attribut name d'un groupe
+LDAP_GROUPMEMBER=memberuid      # Attribut stockant les membres d'un groupe
+LDAP_GROUPMEMBERISDN=0          # LDAP_GROUPMEMBER stocke un uid ou un dn ? 0/1
+LDAP_FILTERGROUP=(cn=*)         # requete ldap pour rechercher les groupes
+LDAP_FILTERUSER=(uid=*)         # requete ldap pour rechercher les users
+LDAP_AUTOSUBMIT=1               # if APP_AUTH = LDAP autocréer les users non existant
+LDAP_AUTOUPDATE=1               # if APP_AUTH = LDAP automodifier les users existant
+
+# If APP_AUTH = CAS
+CAS_HOST=
+CAS_PORT=
+CAS_PATH=
+CAS_USERNAME=username
+CAS_EMAIL=email
+CAS_LASTNAME=lastname
+CAS_FIRSTNAME=firstname
+CAS_AVATAR=
+CAS_NIVEAU01=
+CAS_GROUP=
+CAS_AUTOSUBMIT=1                # if APP_AUTH = CAS autocréer les users non existant
+CAS_AUTOUPDATE=1                # if APP_AUTH = CAS automodifier les users existant
+
+# If APP_AUTH = OPENID
+OAUTH_CLIENTID=
+OAUTH_CLIENTSECRET=
+OAUTH_LOGINURL=
+OAUTH_LOGOUTURL=
+OAUTH_TOKENURL=
+OAUTH_USERINFO=
+OAUTH_USERNAME=username
+OAUTH_EMAIL=email
+OAUTH_LASTNAME=lastname
+OAUTH_FIRSTNAME=firstname
+OAUTH_AVATAR=
+OAUTH_NIVEAU01=
+OAUTH_GROUP=
+OAUTH_AUTOSUBMIT=1              # if APP_AUTH = OPENID autocréer les users non existant
+OAUTH_AUTOUPDATE=1              # if APP_AUTH = OPENID automodifier les users existant
+
+# IF APP_SYNCHRO=NINE2NINE
+NINE_URL=
+NINE_SECRET=
+
+# If APP_MODEREGISTRATION != NULL
+APP_MODEREGISTRATIONTERM=6      # Temps en heure de la durée de validité de l'inscription
+
+# Proxy
+PROXY_USE=0
+PROXY_HOST=
+PROXY_PORT=
+
+# Audit
+AUDIT_USE=0
+
+# Sonde statistic
+SONDE_USE=0
+SONDE_URL=
+
+# Mercure
+MERCURE_URL=https://127.0.0.1/.well-known/mercure
+MERCURE_PUBLIC_URL=https://127.0.0.1/.well-known/mercure
+MERCURE_JWT_SECRET="!changeme!changeme!changeme!changeme!changeme!changeme!"
+
+# Minio
+MINIO_URL=http://127.0.0.1:9000
+MINIO_KEY=minio
+MINIO_SECRET=changeme
+MINIO_BUCKET=nineblog
+MINIO_ROOT=
+MINIO_PATH_STYLE=1
+MINIO_SECURE=0
+
+# Hydra apps
+HYDRA_LOGINCHALLENGE="http://127.0.0.1:4445/oauth2/auth/requests/login?login_challenge="
+HYDRA_LOGINCHALLENGEACCEPT="http://127.0.0.1:4445/oauth2/auth/requests/login/accept?login_challenge="
+HYDRA_CONSENTCHALLENGE="http://127.0.0.1:4445/oauth2/auth/requests/consent?consent_challenge="
+HYDRA_CONSENTCHALLENGEACCEPT="http://127.0.0.1:4445/oauth2/auth/requests/consent/accept?consent_challenge="
+
+# Lock
+LOCK_DSN="postgresql://symfony:ChangeMe@127.0.0.1:5432/nineblog?serverVersion=13&charset=utf8"
+
+# Sentry
+SENTRY_DSN=

.githooks/commit-msg

@@ -0,0 +1,18 @@
+#!/bin/bash
+
+set -eo pipefail
+
+DIR="$(cd "$( dirname "${BASH_SOURCE[0]}" )" >/dev/null 2>&1 && pwd)"
+export PATH="${PATH}:${DIR}/../node_modules/.bin"
+
+function lint_commit_message {
+    local commit_message_file="$1"
+    cat "$commit_message_file" | commitlint
+}
+
+function main {
+    local commit_message_file="$1"
+    lint_commit_message "$commit_message_file"
+}
+
+main $@

.gitignore

@@ -0,0 +1,31 @@
+
+/docker-compose.override.yml
+/.env.local
+/.env.local.php
+/.env.*.local
+/config/secrets/prod/prod.decrypt.private.php
+/public/bundles/
+/var/
+/vendor/
+/node_modules/
+/public/build/
+npm-debug.log
+yarn-error.log
+/phpunit.xml
+.phpunit.result.cache
+.phpunit.result.cache
+/phpunit.xml
+
+
+/uploads
+!/public/uploads/avatar
+/public/uploads/avatar/*
+!/public/uploads/avatar/admin.jpg
+!/public/uploads/avatar/noavatar.jpg
+!/public/uploads/avatar/system.jpg
+!/public/uploads/avatar
+/public/uploads/logo/*
+!/public/uploads/logo/logo.png
+/public/uploads/ckeditor
+
+.php-cs-fixer.cache

.jenkins/build-symfony-image.groovy

@@ -0,0 +1,15 @@
+def exec() {
+    String dockerfile = readFile(file:'Dockerfile')
+
+    dockerfile = """
+    ${dockerfile}
+
+    RUN apt update && apt install -y php-gd php-curl php-zip curl
+    RUN curl -fsSL https://deb.nodesource.com/setup_16.x | bash - && apt-get install -y nodejs
+    RUN npm install -g yarn
+    """.stripIndent()
+
+    writeFile(file:'Dockerfile', text: dockerfile)
+}
+
+return this

.php-cs-fixer.dist.php

@@ -0,0 +1,12 @@
+<?php
+
+$finder = PhpCsFixer\Finder::create()
+    ->in(__DIR__.'/src');
+
+$config = new PhpCsFixer\Config();
+return $config->setRules([
+        '@Symfony' => true,
+        'full_opening_tag' => false,
+    ])
+    ->setFinder($finder)
+;

.php-version

@@ -0,0 +1 @@
+8.1

.vscode/settings.json

@@ -0,0 +1,3 @@
+{
+    "esbonio.sphinx.confDir": ""
+}

Jenkinsfile

@@ -0,0 +1,3 @@
+@Library('cadoles') _
+
+symfonyAppPipeline('ubuntu:22.04')

Makefile

@@ -1,26 +1,18 @@
-################################
+SHELL := /bin/bash
-# Makefile
+export PATH := $(HOME)/.symfony/bin:$(PATH)
-################################
 
-SOURCE=nineskeletor
+deps:
-VERSION=1.0
+	wget https://get.symfony.com/cli/installer -O - | bash
-EOLE_VERSION=2.7
+	symfony composer install
-EOLE_RELEASE=2.7.1
+	symfony composer install --working-dir=tools/php-cs-fixer
-PKGAPPS=web
+	symfony composer install --working-dir=tools/phpstan
+	npm ci
 
-################################
+phpstan:
-# Début de zone à ne pas éditer
+	symfony php tools/phpstan/vendor/bin/phpstan analyze ./src -l 1
-################################
 
-include eole.mk
+php-cs-fixer:
-include apps.mk
+	tools/php-cs-fixer/symfony-php-cs-fixer.sh fix --verbose --show-progress=dots
 
-################################
+install-git-hooks:
-# Fin de zone à ne pas éditer
+	git config core.hooksPath .githooks
-################################
-
-# Makefile rules dedicated to application
-# if exists
-ifneq (, $(strip $(wildcard $(SOURCE).mk)))
-include $(SOURCE).mk
-endif

README.md

@@ -1,231 +1,154 @@
-# Renommer le squelette 
+# NINESKELETOR
-## Dupliquer nineskeletor et renommer en nineXXXX
-Puis effectuer les changement suivants
-- Renommer db/nineskeletor-create-0.sql en db/nineXXXX-create-0.sql
-- Modifier db/nineXXXX-create-0.sql et changer le nom de la base de données en nineXXXX
-- Renommer dicos/90_nineskeletor.xml en dicos/90_nineXXXX.xml
-- Modifier dicos/nineXXXX-nineXXXX.xml et remplacer tout les nineskeletor en nineXXXX
-- Renommer logrotate/nineskeletor en logrotate/nineXXXX
-- Modifier logrotate/nineXXXX et remplacer tout les nineskeletor en nineXXXX
-- Renommer postservice/90-nineskeletor en postservice/90-nineXXXX
-- Modifier postservice/90-nineXXXX et remplacer tout les nineskeletor en nineXXXX
-- Renommer pretemplate/25-nineskeletor en pretemplate/25-nineXXXX
-- Modifier pretemplate/25-nineXXXX et remplacer tout les nineskeletor en nineXXXX
-- Renommer src/nineskeletor-1.0 en src/nineXXXX-1.0
-- Modifier src/nineXXXX-1.0/webpack.config.js et remplacer tout les nineskeletor en nineXXXX
-- Renommer sso/filtres/nineskeletor.ini en sso/filtres/nineXXXX.ini
-- Renommer sso/filtres/nineskeletor_apps.ini en sso/filtres/nineXXXX_apps.ini
-- Modifier sso/filtres/nineXXXX_apps.ini et remplacer tout les nineskeletor en nineXXXX
-- Renommer tmpl/nineskeletor.cron en tmpl/nineXXXX.cron
-- Modifier tmpl/nineXXXX.cron et remplacer tout les nineskeletor en nineXXXX
-- Renommer tmpl/nineskeletor-apache.conf en tmpl/nineXXXX-apache.conf
-- Modifier tmpl/nineXXXX-apache.conf et remplacer tout les nineskeletor en nineXXXX
-- Renommer tmpl/nineskeletor-db.yml en tmpl/nineXXXX-db.yml
-- Modifier tmpl/nineXXXX-db.yml et remplacer tout les nineskeletor en nineXXXX
-- Renommer tmpl/nineskeletor-env.local en tmpl/nineXXXX-env.local
-- Modifier tmpl/nineXXXX-env.local et remplacer tout les nineskeletor en nineXXXX
-- Renommer tmpl/nineskeletor-proxy.sh en tmpl/nineXXXX-proxy.sh
-- Modifier Makefile et remplacer tout les nineskeletor en nineXXXX
-- Remplacer logo public/uploads/logo/logo.png
 
-## Compilier les asset
+Squelette applicatif symfony
-- apt-get install npm
-- si proxy
-- npm config set proxy "http://monproxyurl:monproxyport"
-- npm config set https-proxy "http://monproxyurl:monproxyport"
-- npm install -g yarn
-- yarn install
-- yarn encore dev
-- yarn encore prod
 
-# Description du squelette
+## Installation for local dev
+```
+curl -1sLf 'https://dl.cloudsmith.io/public/symfony/stable/setup.deb.sh' | sudo -E bash  
+curl -sS https://dl.yarnpkg.com/debian/pubkey.gpg | sudo apt-key add -  
+echo "deb https://dl.yarnpkg.com/debian/ stable main" | sudo tee /etc/apt/sources.list.d/yarn.list  
+apt-get update  
+apt-get install git docker-compose composer symfony-cli php php-xml php-zip php-gd php-curl php-pgsql yarn  
+git clone https://forge.cadoles.com/Cadoles/nineskeletor.git  
+cd nineskeletor  
+symfony server:ca:install  
+cp .env .env.local  
+```
+Change in .env.local APP_SECRET variabile  
+This secret is the init password for admin user  
 
-## Bundle
+Change in .env.local MERCURE_JWT_SECRET variable  
-- DebugBundle
+And report this secret in docker-compose.yml MERCURE_PUBLISHER_JWT_KEY and MERCURE_SUBSCRIBER_JWT_KEY
-- DoctrineBundle
+
-- DoctrineMigrationsBundle
+And finish with
-- FOSCKEditorBundle
+```
-- FOSRestBundle
+bin/reconfigure.sh
-- FrameworkBundle
+```
-- KnpSnappyBundle
+
-- MakerBundle
+## Run for local
-- MonologBundle
+
-- NelmioApiDocBundle
+```
-- OneupUploaderBundle
+symfony server:start
-- SecurityBundle
+```
-- SensioFrameworkExtraBundle
+
-- SwiftmailerBundle
+## Installation for apache
-- TetranzSelect2EntityBundle
+exec installation for local dev except /bin/reconfigure.sh  
-- TwigBundle
+
-- TwigExtraBundle
+Between   
-- WebProfilerBundle
+Change in .env.local APP_WEBURL variable  
-- WebpackEncoreBundle
+For sample
-- ramsey/uuid
+```
-- cboden/ratchet
+APP_WEBURL=MyDomaine
+```
+
+Change in .env.local MERCURE variable like  
+The /hub alias must be the same on Apache configuration ProxyPass and ProxyPassReverse
+```
+MERCURE_URL=http://MyDomaine/hub/.well-known/mercure
+MERCURE_PUBLIC_URL=http://MyDomaine/hub/.well-known/mercure  
+```
+
+
+Create the file docker-compose.override.yml like  
+The port 9090 must be the same in the apache configuration ProxyPass and ProxyPassReverse
+```
+version: '3'
+
+services:
+  mercure:
+    ports:
+      - "9090:80"    
+    environment:
+      SERVER_NAME: ':80'
+      MERCURE_PUBLISHER_JWT_KEY: '!ChangeMe!'
+      MERCURE_SUBSCRIBER_JWT_KEY: '!ChangeMe!'
+      MERCURE_EXTRA_DIRECTIVES: |
+        cors_origins http://MyDomaine
+```
+
+And finish with
+```
+bin/reconfigure.sh
+```
+
+After install and configure apache
+```
+apt-get install apache libmodapache2
+a2enmod rewrite proxy_http
+service apache2 restart
+```
+
+sample apache configuration in /etc/apache2/site-available/000-
+```
+<VirtualHost *:80>
+	DocumentRoot /var/www/html/nineskeletor/public
+ 	CustomLog /var/log/apache2/access.log common
+    ErrorLog /var/log/apache2/error.log
+
+    <Directory /var/www/html/nineskeletor/public>
+        DirectoryIndex index.php
+
+        <IfModule mod_negotiation.c>
+            Options -MultiViews
+        </IfModule>
+
+        <IfModule mod_rewrite.c>
+            RewriteEngine On
+
+            RewriteCond %{REQUEST_URI}::$0 ^(/.+)/(.*)::\2$
+            RewriteRule .* - [E=BASE:%1]
+
+            RewriteCond %{HTTP:Authorization} .+
+            RewriteRule ^ - [E=HTTP_AUTHORIZATION:%0]
+
+            RewriteCond %{ENV:REDIRECT_STATUS} =""
+            RewriteRule ^index\.php(?:/(.*)|$) %{ENV:BASE}/$1 [R=301,L]
+
+            RewriteCond %{REQUEST_FILENAME} !-f
+            RewriteRule ^ %{ENV:BASE}/index.php [L]
+        </IfModule>
+
+        <IfModule !mod_rewrite.c>
+            <IfModule mod_alias.c>
+                RedirectMatch 307 ^/$ /index.php/
+            </IfModule>
+        </IfModule>
+    </Directory>
+
+    # For mercure server
+    ProxyPass /hub/ http://localhost:9090/
+    ProxyPassReverse /hub/ http://localhost:9090/
+
+</VirtualHost>
+
+<VirtualHost *:1080>
+    # For mailer server
+    ProxyPass / http://localhost:1080/
+    ProxyPassReverse / http://localhost:1080/
+</VirtualHost>
+
+```
+
+
+## Cron Job
+
+Make sure the cron job is running all the minute  
+You can copy this bin/nineskeletor.cron in your crontab
+```
+cp /var/www/html/nineskeletor/bin/nineskeletor.cron /etc/cron.d/nineskeletor
+```
+
+## Messenger worker
+
+Make sure the messenger consume the bus  
+Needed to send mail 
+You can copy this bin/nineskeletor.service in your systemd
+```
+cp /var/www/html/nineskeletor/bin/nineskeletor.service /etc/systemd/system/
+systemctl enable nineskeletor.service
+systemctl start nineskeletor.service
+```
 
 
 
-## Asset
 
-### Tag app
-- jQuery = https://www.npmjs.com/package/jquery
-- jqueryui = https://www.npmjs.com/package/jqueryui
-- bootstrap = https://www.npmjs.com/package/bootstrap
-- timepicki = https://www.npmjs.com/package/timepicki
-- datatables.net-bs4 = https://www.npmjs.com/package/datatables.net-bs4
-- fontawsome-free = https://www.npmjs.com/package/@fortawesome/fontawesome-free
-- bs-stepper = https://www.npmjs.com/package/bs-stepper
-- masonry-layout = https://www.npmjs.com/package/masonry-layout
-- react-slick = https://www.npmjs.com/package/react-slick
-- image-loaded = https://www.npmjs.com/package/image-loaded
-- moment = https://www.npmjs.com/package/moment
-- select2 = https://www.npmjs.com/package/select2
-- crop-select-js = https://www.npmjs.com/package/crop-select-js
-- spectrum-colorpicker2 = https://www.npmjs.com/package/spectrum-colorpicker2
-
-
-
-### Tag fullcalendar
-- @fullcalendar/core = https://www.npmjs.com/package/@fullcalendar/core
-- @fullcalendar/interaction = https://www.npmjs.com/package/@fullcalendar/interaction
-- @fullcalendar/daygrid = https://www.npmjs.com/package/@fullcalendar/daygrid
-
-### Tag dropzone
-- dropzone = https://www.npmjs.com/package/dropzone
-
-
-
-## Parameters
-
-Provient du template env.local
-- appEnv = PROD
-- appSecret = valeur du fichier .key autogénéré au premier reconfigure
-- appWeburl = Valeur du dicos web_url
-- appAuth = Valeur du dicos = CAS / SQL
-- appAlias = En dur l'alias web
-- appName = Nom de l'application
-- appCron = En dur à true pour activer le système de cron
-- appMasteridentity = Valeur du dicos = Ninegate / LDAP / SQL
-- appMasterurl = Si appMasteridentity la valeur du dicos correspondant à l'url du Ninegate maître
-- appMasterkey = Si appMasteridentity la valeur du dicos correspondant à la clé d'API du Ninegate maître
-- databaseName = En dur le nom de la base
-- databaseUser = En dur le user de la base
-- databasePassword = Autogénéré par le reconfigure
-- databaseHost = Valeur du dicos pour le host de la base
-- appMailmethod = Valeur du dicos soit sendmail soit smtp. sendmail par défaut si exim est activé sur le serveur
-- appMailurl = Si smtp url calculé combinant smtphost smtpport smtpencryption smtpauthmode smtpuser smtppwd
-- appMailnoreply = Valeur du dicos du noreplay
-- ldapModel = si masteridentity à LDAP soit open soit scribe
-- ldapHost = Valeur dicos Host LDAP
-- ldapPort = Valeur dicos Port LDAP
-- ldapUser = Valeur dicos User LDAP
-- ldapPassword = Valeur dicos Password LDAP
-- ldapBasedn = Valeur dicos Basedn LDAP
-- ldapUsername = si Scribe en dur sinon valeur du dicos champs annuaire utilisé comme username
-- ldapFirstname = si Scribe en dur sinon valeur du dicos champs annuaire utilisé comme firstname
-- ldapLastname = si Scribe en dur sinon valeur du dicos champs annuaire utilisé comme lastname
-- ldapEmail = si Scribe en dur sinon valeur du dicos champs annuaire utilisé comme email
-- ldapFiltergroup = si Scribe en dur sinon valeur du dicos filtre ldap de recherche des groupes
-- ldapFilteruser = si Scribe en dur sinon valeur du  dicos filtre ldap des groupes
-- ldapAdmins = Liste des admins obligatoire = Admin + valeur dicos
-- casHost = Valeur dicos du host SSO
-- casPort = Valeur dicos du Porst SSO
-- casPath = Valeur dicos du Path SSO
-- casUsername = Valeur en dur correspondant au filtre sso du username
-- casEmail = Valeur en dur correspondant au filtre sso du email
-- casLastname = Valeur en dur correspondant au filtre sso du lastname
-- casFirstname = Valeur en dur correspondant au filtre sso du fistname
-- proxyUse = Valeur dicos utiliser oui/non un proxy
-- proxyHost = Si oui valeurs du dicos du host proxy
-- proxyPort = Si oui valeurs du dicos du post proxy
-- sondeUse = Valeur dicos utiliser oui/non une sonde statistique 
-- sondeUrl = Si oui url de la sonde statistique
-
-## Sécurité
-
-4 rôles possibles 
-- ROLE_ADMIN
-- ROLE_MODO
-- ROLE_MASTER
-- ROLE_USER
-
-4 routes protégés
-- /user = accèssible à ROLE_USER / ROLE_MASTER / ROLE_MODO / ROLE_ADMIN
-- /master = accèssible à ROLE_MASTER / ROLE_MODO / ROLE_ADMIN
-- /modo = = accèssible à ROLE_MODO / ROLE_ADMIN
-- /admin = = accèssible à ROLE_ADMIN
-
-## Job
-
-Nineskeletor intègre un système de job.  
-Ce système va exécuter des commandes symfony à interval régulier.  
-De base les jobs suivants sont livrés :
-- app:sendMail = toutes les minutes = Execution du spool de mail en attente
-- app:dumpBdd = toutes les nuits à 2h00 = Dump de la base
-- app:purgeFile = toutes les nuits à 3h00 = Suppresion des fichiers obsolètes
-- app:synchroUsers = toutes les nuites à 3h00 = Synchronisation des comptes utilisateurs soit via LDAP soit via Ninegate
-
-Pour ajouter un job à la listes, modifier la commande app:initCron qui sera exécutée à chaque reconfigure
-
-## Service
-
-- app.password.encoder = encodage password sur la methode que l'annuaire
-- app.upload.listener = action à réaliser sur upload via oneupload
-- app.upload.samename = permet d'uploader un fichier et préserver le nom de fichier via oneupload
-- app.ldap.service = fonction ldap
-- app.sendmail.transport = executuion du spool de mail via sendmail    
-- app.mail.service = fonction envoit de mail
-- app.twig.extension = extention twig
-
-
-## Twig
-
-### Twig Constantes
-
-Variables globales twig reprises des parametres symfony
-- appAlias
-- appAuth
-- appName
-- appCron
-- appMasteridentity
-- sondeUse
-- sondeUrl
-
-### Twig Extention
-
-App\Twig\AppExtension
-- filtre = urlAvatar à placer avec user.avatar afin de définir l'url complète de l'avatar du user
-
-### Twig Template de base
-
-#### templates/base.html.twig
-
-Deux paramétres non obligatoire
-- useheader = permet d'afficher ou non la bannière dans la page = false par défaut
-- usesidebar = permet d'afficher oun non la sidebar dans la page = false par défaut
-- usemonocolor = afin de placer uniquement la couleur dark sur la page
-Block
-- block encorelinktags = pour déclarer des encore_link_tags spécifique à la page (encorelinktags app est intégré de base)
-- block localstyle = pour déclarer des propriétés css spécifique à page (Include/style.css.twig est intégré de base)
-- block body = le corps de la page
-- block encorescripttags pour déclarer des encore_script_tags spécifique à la page (encorescripttags app est intégré de base)
-- block localjavascript = pour déclarer du js spécifique à la page (Include/javascript.js.twig est intégré de base)
-
-#### templates/Include/style.css.twig
-
-Style de l'applicaiton en surcouche de bootstrap
-
-#### templates/Include/sidebar.html.twig
-
-La sidebar de l'application quand elle est affichée
-
-#### templates/Include/javascript.js.twig
-
-Librairie js de l'application
-
-- object a et button s'ils ont un attribut data-method et data_confirm proposeront une confirmation à l'utilisateur avant de poursuivre l'action
-- ModalLoad(idmodal,titre,url) = permet d'afficher en modal l'url indiqué en parametre. Par défaut on dispose de la modal #mymodal
-
-#### templates/Form/fields.htms.twig
-
-Mise en forme de champs de formulaire

apps.mk

@@ -1,64 +0,0 @@
-# 
-# NE PAS EDITER CE FICHIER
-#
-# Voir Makefile
-
-
-##########################
-# Application web envole #
-##########################
-ifneq (, $(filter oui web, $(PKGAPPS)))
-#
-# Sanity check
-#
-ifeq (, $(filter-out X.X, $(strip $(VERSION))))
-$(error $$(VERSION) variable has incorrect value '$(VERSION)')
-endif
-
-# Where to store web application files
-WEB_PATH				:= $(DESTDIR)/var/www/html
-
-# Envole
-sharenvole_PROG_DIR			:= $(DESTDIR)/usr/share/envole/$(SOURCE)
-
-src_$(SOURCE)-$(VERSION)_REC_DIR	:= $(WEB_PATH)/$(SOURCE)
-src_plugins-$(VERSION)_REC_DIR		:= $(WEB_PATH)/$(SOURCE)/plugin
-src_lang-$(VERSION)_REC_DIR		:= $(WEB_PATH)/$(SOURCE)/lang
-
-endif
-
-##########################
-# Application EOLE flask #
-##########################
-ifneq (, $(filter flask, $(PKGAPPS)))
-#
-# Sanity check
-#
-ifeq (, $(filter-out XXX, $(strip $(FLASK_MODULE))))
-$(error $$(FLASK_MODULE) variable has incorrect value '$(FLASK_MODULE)')
-endif
-
-ifeq (, $(strip $(wildcard src/$(FLASK_MODULE).conf)))
-$(error missing eoleflask configuration file 'src/$(FLASK_MODULE).conf')
-endif
-
-# Everything is related to mount point
-APPS_MOUNT_POINT	:= $(shell sed -ne 's|^"MOUNT_POINT"[[:space:]]*:[[:space:]]*"/\([^"]*\)",|\1|p' \
-	src/$(FLASK_MODULE).conf)
-
-ifeq (, $(strip $(APPS_MOUNT_POINT)))
-$(error no "MOUNT_POINT" in eoleflask configuration file 'src/$(FLASK_MODULE).conf')
-endif
-
-# eole-flask configuration
-src_DATA_DIR		:= $(DESTDIR)/etc/eole/flask/available
-
-# Where to store flask application files
-FLASK_PATH		:= $(eole_DIR)/flask/$(APPS_MOUNT_POINT)
-
-# static files
-src_$(FLASK_MODULE)_static_REC_DIR	:= $(FLASK_PATH)/static
-src_$(FLASK_MODULE)_templates_REC_DIR	:= $(FLASK_PATH)/templates
-src_$(FLASK_MODULE)_instance_REC_DIR	:= $(FLASK_PATH)/resources
-
-endif

assets/app.js

@@ -0,0 +1,72 @@
+// jquery
+import $ from 'jquery'
+window.jQuery = $;
+window.$ = $;
+
+// jqueryui
+import 'jqueryui'
+import 'jqueryui/jquery-ui.min.css';
+
+// Bootstrap
+require('bootstrap');
+require('bootstrap/dist/css/bootstrap.css');
+
+// Fontawesome
+require('@fortawesome/fontawesome-free/css/all.css');
+
+// Datatables
+require('datatables.net-bs4');
+require('datatables.net-bs4/css/dataTables.bootstrap4.min.css');
+require('./js/datatables.init.js');
+
+// Select2
+require('select2');
+require('select2/dist/js/i18n/fr.js');
+require('select2/dist/css/select2.css');
+require('@ttskch/select2-bootstrap4-theme/dist/select2-bootstrap4.css');
+$(() => {
+    $('.select2entity').select2(
+        {
+            theme: 'bootstrap4',
+            language: "fr"
+        }
+    );
+});
+
+// Spectrum-colorpicker2
+require('spectrum-colorpicker2/dist/spectrum.min.js');
+require('spectrum-colorpicker2/dist/spectrum.min.css');
+
+// CropSelectJs
+require('crop-select-js/crop-select-js.min.css');
+window.CropSelectJs = require('crop-select-js/crop-select-js.min.js');
+
+// iframe-resizer
+require('iframe-resizer/js/iframeResizer.min.js');
+require('iframe-resizer/js/iframeResizer.contentWindow.min.js');
+
+// Slick
+require('slick-carousel/slick/slick.css');
+require('slick-carousel/slick/slick-theme.css');
+const slick = require('slick-carousel/slick/slick.min.js');
+global.slick = slick;
+
+// Imageloaded
+const imagesLoaded = require('imagesloaded/imagesloaded.js');
+global.imagesLoaded = imagesLoaded;
+
+// Masonry
+const masonry = require('masonry-layout/dist/masonry.pkgd.min.js');
+global.masonry = masonry;
+
+// Start the Stimulus application
+import './bootstrap';
+
+// App sytle
+import './styles/font.css';
+import './styles/app.css';
+
+// App js
+require('./js/app.js');
+
+

assets/bootstrap.js

@@ -0,0 +1,11 @@
+import { startStimulusApp } from '@symfony/stimulus-bridge';
+
+// Registers Stimulus controllers from controllers.json and in the controllers/ directory
+export const app = startStimulusApp(require.context(
+    '@symfony/stimulus-bridge/lazy-controller-loader!./controllers',
+    true,
+    /\.[jt]sx?$/
+));
+
+// register any custom, 3rd party controllers here
+// app.register('some_controller_name', SomeImportedController);

assets/controllers.json

@@ -0,0 +1,4 @@
+{
+    "controllers": [],
+    "entrypoints": []
+}

assets/controllers/hello_controller.js

@@ -0,0 +1,16 @@
+import { Controller } from '@hotwired/stimulus';
+
+/*
+ * This is an example Stimulus controller!
+ *
+ * Any element with a data-controller="hello" attribute will cause
+ * this controller to be executed. The name "hello" comes from the filename:
+ * hello_controller.js -> "hello"
+ *
+ * Delete this file or adapt it for your use!
+ */
+export default class extends Controller {
+    connect() {
+        this.element.textContent = 'Hello Stimulus! Edit me in assets/controllers/hello_controller.js';
+    }
+}

assets/dropzone.js

@@ -0,0 +1,21 @@
+
+require('dropzone/dist/dropzone.css');
+const { Dropzone } = require("dropzone");
+
+document.addEventListener('DOMContentLoaded', function() {
+    var elt = document.getElementById('mydropzone');
+    maxFiles=elt.getAttribute("data-maxFiles");
+    if(maxFiles!=1) maxFiles=null;
+    
+    var mydropzone = new Dropzone(elt, {
+        acceptedMimeTypes: $(elt).data("acceptedMimeTypes"),
+        maxFiles: maxFiles,
+        init: function() {
+            dropzoneinit(this);
+        },
+        success: function( file, response ){
+            dropzonesuccess(file,response);
+        },
+    });
+    window.mydropzone=mydropzone;
+});

assets/js/app.js

@@ -0,0 +1,102 @@
+$(document).ready(function() {
+    // Color
+    $(".pick-a-color").spectrum(
+        {
+            preferredFormat: "hex",
+            type: "string",
+            showPalette: true,
+            allowEmpty: true,
+            showAlpha: false,            
+        }
+    );
+    $(".pick-a-color").attr("autocomplete","off");
+
+    // Method confirm
+    var doit = true;
+    $("a[data-method]").on('click',function(){
+        if($(this).data('confirm')){
+            doit = confirm($(this).data('confirm'));
+            if(!doit) return false;
+        }
+    });
+    $("button[data-method]").on('click',function(){
+        if($(this).data('confirm')){
+            doit = confirm($(this).data('confirm'));
+            if(!doit) return false;
+        }
+    }); 
+        
+    // Modal
+    $(".btn-modal").click(function() {
+        $("#"+$(this).data("modalid")+" .modal-title").text($(this).data("modaltitle"));
+        $("#"+$(this).data("modalid")+" iframe").attr("src",$(this).data("modalurl"));
+        $("#"+$(this).data("modalid")).modal("show");
+    });
+
+    // Item
+    $( ".item" ).hover(function() {
+        $(this).find(".item-action a").show();
+    });
+
+    $( ".item" ).mouseleave(function() {
+        $(this).find(".item-action a").hide();
+    });
+
+    $( ".item-info" ).click(function() {
+        parent=$(this).parent().parent().parent().parent().parent();           
+        if(parent.find(".item-description").hasClass("hide")) {
+            parent.find(".item-description").removeClass("hide");
+            parent.addClass("w-100");
+            parent.css("justify-content","flex-start");
+        }
+        else {
+            parent.find(".item-description").addClass("hide");
+            parent.removeClass("w-100");
+
+            if(parent.hasClass("item-large"))
+                parent.css("justify-content","flex-start");
+            else
+                parent.css("justify-content","center"); 
+        }
+    });  
+        
+    // select2-icon
+    function iformat(icon) {
+        return $('<span><i class="' + icon.id + '"></i> ' + icon.text + '</span>');
+    }
+    $('.select2-icon').select2({
+        width: "100%",
+        placeholder: 'choisir un icône',
+        allowClear: true,                
+        templateSelection: iformat,
+        templateResult: iformat,
+        formatResult: iformat,
+        allowHtml: true,
+        escapeMarkup: function(m) {
+            return m;
+        }
+    })
+
+    // Menu
+    $(".dropdown-toggle").click(function(){
+        $(this).parent().find(".dropdown-menu").toggle();
+    })
+    $(".nav-toogle").click(function(){
+        $("#selmenu").modal("toggle");
+    })
+    
+    // Forcer le resize des objects
+    Resize();
+    
+    // Focus
+    $("#page").focus();
+});
+
+$( window ).resize(function() {
+    Resize();
+});
+
+
+
+
+

assets/js/datatables.init.js

@@ -0,0 +1,31 @@
+$(document).ready(function() {
+    $.extend( $.fn.dataTable.defaults, {
+        responsive: true,
+        "iDisplayLength": 1000,
+        "scrollX": true,
+		"oLanguage": { 
+            "sThousands": " ",
+            "sProcessing":     "Traitement en cours...",
+            "sSearch":         "Rechercher :",
+            "sLengthMenu":     "Afficher _MENU_ éléments",
+            "sInfo":           "Affichage de l'élement _START_ à _END_ sur _TOTAL_ éléments",
+            "sInfoEmpty":      "Affichage de l'élement 0 à 0 sur 0 éléments",
+            "sInfoFiltered":   "(filtré de _MAX_ éléments au total)",
+            "sInfoPostFix":    "",
+            "sLoadingRecords": "Chargement en cours...",
+            "sZeroRecords":    "Aucun élément à afficher",
+            "sEmptyTable":     "Aucune donnée disponible dans le tableau",
+            "oPaginate": {
+                "sFirst":      "Premier",
+                "sPrevious":   "Précédent",
+                "sNext":       "Suivant",
+                "sLast":       "Dernier"
+            },
+            "oAria": {
+                "sSortAscending":  ": activer pour trier la colonne par ordre croissant",
+                "sSortDescending": ": activer pour trier la colonne par ordre décroissant"
+            }		
+		 },
+		//"stateSave": true
+    });
+});

assets/styles/app.css

@@ -0,0 +1,442 @@
+/* COLOR */
+body {
+    background-color: var(--colorbgbodylight);
+    color:  var(--colorftbodylight);
+}
+
+.header {
+    color: var(--colorfttitledark); 
+}
+
+.header h1, .header a, #sidebar a, #sidebar hr{
+    color: var(--colorfttitledark); 
+}
+
+.header a:hover, #sidebar a:hover {
+    color: var(--colorfttitledark); 
+    text-decoration:none;
+}
+.navbar {
+    background-color: var(--colorbgbodydark);
+}
+
+.table,
+.table-hover > tbody > tr:hover > *,
+.table-striped > tbody > tr:nth-of-type(odd) > * {
+    color: var(--colorftbodylight);
+}
+
+
+
+
+/* FONT */
+body {
+    font-family: var(--fontbody); 
+}
+
+h1, h2, h3, .navbar-brand, .card-header, .modal-header h4, .widgetheader .title {
+    font-family:  var(--fonttitle); 
+    color: var(--colorfttitlelight);
+}
+
+h1 { font-size: var(--fontsizeh1); }
+h2 { font-size: var(--fontsizeh2); }
+h3 { font-size: var(--fontsizeh3); }
+h4 { font-size: var(--fontsizeh4); }
+
+.card-header .custom-control, .grid-item-title h2 {
+    font-family:  var(--fontbody);
+}
+
+
+/* GLOBAL */
+html, body {
+    height:100%;
+}
+
+a {
+    text-decoration: none;
+    cursor: pointer;
+    color: var(--colorfttitlelight); 
+}
+
+a:hover {
+    color: var(--colorfttitlelight-darker);
+}
+
+.btn-link {
+    text-decoration: none;
+    cursor: pointer;
+    color: var(--colorfttitlelight); 
+}
+
+.btn-link:hover {
+    color: var(--colorfttitlelight-darker);
+}
+
+main {
+    display:flex;
+    overflow:hidden;
+}
+
+.dataTable {
+border-style: solid none solid solid;
+border-width: 1px;
+}
+
+.avatar {
+    width:30px;
+    height:30px;
+    background-color: var(--colorbgbodydark);
+    border-radius: 100%;
+}
+
+.select2,.select2-container .select2-search--inline {
+    width:100%!important;
+}
+
+/* HEADER */
+.header h1 {
+    text-transform: uppercase;    
+    padding-left: 10px;
+    padding-top: 15px;
+    margin: 0px;
+    line-height:var(--lineheighth1);
+}
+
+.header h1 small {
+    font-size:60%;
+}
+
+#header .nav-link {
+    padding:0.5rem;
+}
+
+#page {
+    overflow-y: auto;
+    width:100%;
+}
+
+.ckeditor-content img {
+    max-width:100%;
+    height:auto !important;
+}
+
+.hide {
+    display: none !important;
+}
+
+.card-body .form-group:first-child {
+    margin-top: 0px !important;
+}
+
+@media (max-width: 991px) {
+    #header {
+        display:none !important;
+    }
+}
+
+/* NAVBAR */
+.nav {
+    vertical-align: middle;
+}
+
+.navbar-logo {
+    padding: 0 0 0 0.5rem !important;
+}
+.navbar-logo img{
+    height:30px;
+}
+
+#menulink {
+    zoom:150%;
+}
+
+
+
+/* MENU */
+#menu {
+    min-height:44px;
+    padding: 0px 0px 0px 10px !important;
+    justify-content: space-around;
+}
+
+#menu .navbar-logo {
+    margin-right: 10px;
+}
+
+#menuapp {
+    background-color: var(--colorbgbodydark);
+}
+
+#menuuser {
+    min-width: 100px;
+    display:flex;
+    justify-content: end;
+}
+
+.nav-item {
+    padding:10px 10px;
+}
+
+
+.nav-item.active {
+    background-color: var(--colorbgbodydark-darker);
+}
+
+.menupage a {
+    display: flex;
+    align-items: center;
+}
+
+.menupage a i{
+    margin-right: 5px;
+}
+
+.dropdown-menu {
+    background-color: var(--colorbgbodydark);
+    margin-top: 15px;
+}
+
+.dropdown-item:hover, .dropdown-item:focus {
+    background-color: var(--colorbgbodydark-darker);
+    color:  var(--colorftbodydark);
+}
+
+
+@media (max-width: 991px) {
+    #menu {
+        display:flex !important;
+        padding: 0px !important;
+    }
+
+    #menuapp {
+        position: absolute;
+        top:50px;
+        left:0px;
+        width:100%;
+        overflow-y: auto;
+        height:500px;
+        display:none;
+    }
+    
+    #menuapp .nav {
+        flex-direction: column;
+    }
+
+    #menuapp .navbar-nav {
+        flex-direction: column;
+        padding:15px;
+    }
+
+    #menu .nav-toogle {
+        display:block !important;
+    }
+
+    #pagesportal {
+        display:block !important;
+    }
+    
+    #pagesuser {
+        display:block !important;
+    }
+    
+    .navbar-logo {
+        padding: 10px 5px 10px 10px !important;
+    }
+
+    #switchHeader {
+        display:none;
+    }
+}      
+
+
+/* SIDEBAR */
+#sidebar {
+    background-color: var(--colorbgbodydark);
+    width: 100%;
+    max-width:300px;
+    overflow-y: auto;
+}
+
+#sidebar span {
+    padding-left: 5px;
+}
+
+#sidebar .nav-pills .nav-link {
+    border-radius:0px;
+}
+
+#sidebar .nav-pills .nav-link.active {
+    background-color:   var(--colorbgbodydark-darker);
+}
+
+#sidebar .nav-link-items {
+    display: none;
+}
+
+#sidebar .nav-link-item {
+    padding-left: 2em;
+}
+
+@media (max-width: 991px) {
+    #sidebar {
+        max-width:65px;
+    }
+    #sidebar span {
+        display: none;
+    }
+    #sidebar i {
+        font-size: 25px;
+    }    
+    #sidebar .nav-link-item {
+        padding-left: 1rem;
+    }
+    #sidebar .nav-link-section {
+        display:block;
+        margin-bottom: 10px;
+    }
+    #sidebar .nav-link-title {
+        display:none;
+    }
+    #sidebar .nav-link-items {
+        display:block !important;
+        border-bottom: 1px solid var(--colorfttitledark);
+    }
+}
+
+/*== CHILD ======================================================================================================================================= */
+
+.child-sidebar {
+    background-color: var(--colorbgbodyimportant);
+    color: var(--colorftbodydark);
+}
+
+.child-sidebar h3 {
+    color: var(--colorftbodydark);
+}
+
+.child-sidebar a {
+    color: var(--colorfttitledark);
+}
+
+.child-sidebar a:hover {
+    color: var(--colorfttitledark-lighter);
+}
+
+/*== GRID ======================================================================================================================================= */
+
+
+.gutter-sizer  { width: 0%;float:left; }
+
+.grid-sizer {
+    width: 0.1%;
+    margin-bottom: 0%;
+    float:left;
+}
+
+.grid-item {
+    background-color:var(--colorbgbodydark);
+    color: var(--colorfttitledark);
+    overflow:hidden;
+}
+
+.grid-image {
+    width:100%;
+    transition: transform 0.3s;
+    background-position: center;
+    background-size: cover;
+}
+
+.grid-item-title {
+    background-color:var(--colorbgbodyimportant);
+    color: var(--colorfttitledark);
+    width:auto;
+    padding:15px;
+    text-align:center;
+    margin:auto;
+}
+
+
+.grid-item-size-1 { width: 100% }
+.grid-item-size-2 { width: 50% }
+.grid-item-size-3 { width: 33.3% }
+.grid-item-size-4 { width: 25% }
+.grid-item-size-5 { width: 20% }
+.grid-item-full  { width: 100%;  margin-bottom: 0%; font-size:20px;float:left; }
+.grid-item-full h1 {margin: 0; border:none; padding: 20px 0px 0px 10px; }
+
+.grid-tag {font-style:italic}
+.grid-image {cursor: pointer;}
+
+@media (max-width: 980px) {
+    .grid-item-size-1 { width: 30% }
+    .grid-item-size-2 { width: 50% }
+    .grid-item-size-3 { width: 50% }
+    .grid-item-size-4 { width: 50% }
+    .grid-item-size-5 { width: 50% } 
+}
+
+
+/*== HERO ======================================================================================================================================= */
+
+
+.herobody {
+    min-height:500px;
+    width:100%;
+    padding:0px 100px;
+}
+
+.herobody .title {
+    height: auto;
+    position: relative;
+    top: 5%;
+    left: 5%;
+    font-size: 20px;    
+    width:40%;
+    float: left;
+}
+
+.heroheader span {
+    color: var(--colorftbodydark);
+    text-shadow: 1px 1px 2px black;
+}
+
+.herobody .title h1, .heroheader h1, .heroheader h1 {
+    color: var(--colorftbodydark);
+    font-size: 50px; 
+    margin:0px;   
+    text-shadow: 1px 1px 2px black;
+}
+
+.herobody .navigation {
+    width:45%;
+    position: relative;
+    right: 5%;
+    top: 5%;
+    float: right;
+}
+
+@media (max-width: 1099px) {
+    .herobody {
+        padding:0px 50px;
+    }
+
+    .herobody .title {
+        width:90%;
+    }
+
+    .herobody .navigation {
+        width:90%;
+    }
+}
+
+.herobody .grid-item {
+    padding: 5px;
+    background-color: transparent;
+    height: 200px;
+}
+.herobody .grid-image {
+    background-color: var(--colorbgbodydark);
+}
+

assets/styles/font.css

@@ -0,0 +1,189 @@
+@font-face {
+font-family: 'Redressed';
+src: url('../fonts/Redressed-webfont.ttf') format('truetype');
+font-weight: normal;
+font-style: normal;    
+}
+
+@font-face {
+font-family: 'Acme-Regular';
+src: url('../fonts/Acme-Regular-webfont.ttf') format('truetype');
+font-weight: normal;
+font-style: normal;    
+}
+
+@font-face {
+font-family: 'Peacesans';
+src: url('../fonts/Peacesans-webfont.ttf') format('truetype');
+font-weight: normal;
+font-style: normal;    
+}
+
+@font-face {
+font-family: 'Roboto-Regular';
+src: url('../fonts/Roboto-Regular-webfont.ttf') format('truetype');
+font-weight: normal;
+font-style: normal;    
+}
+
+@font-face {
+font-family: 'Justanotherhand-Regular';
+src: url('../fonts/Justanotherhand-Regular-webfont.ttf') format('truetype');
+font-weight: normal;
+font-style: normal;    
+}  
+
+@font-face {
+font-family: 'Lato-Regular';
+src: url('../fonts/Lato-Regular.ttf') format('truetype');
+font-weight: normal;
+font-style: normal;    
+}  
+
+@font-face {
+font-family: 'ABeeZee-Regular';
+src: url('../fonts/ABeeZee-Regular.ttf') format('truetype');
+font-weight: normal;
+font-style: normal;    
+}  
+
+@font-face {
+font-family: 'AlfaSlabOne-Regular';
+src: url('../fonts/AlfaSlabOne-Regular.ttf') format('truetype');
+font-weight: normal;
+font-style: normal;    
+} 
+
+@font-face {
+font-family: 'Anton-Regular';
+src: url('../fonts/Anton-Regular.ttf') format('truetype');
+font-weight: normal;
+font-style: normal;    
+}   
+
+@font-face {
+font-family: 'FredokaOne-Regular';
+src: url('../fonts/FredokaOne-Regular.ttf') format('truetype');
+font-weight: normal;
+font-style: normal;    
+}   
+
+@font-face {
+font-family: 'Overpass-Black';
+src: url('../fonts/Overpass-Black.ttf') format('truetype');
+font-weight: normal;
+font-style: normal;    
+}   
+
+@font-face {
+font-family: 'Righteous-Regular';
+src: url('../fonts/Righteous-Regular.ttf') format('truetype');
+font-weight: normal;
+font-style: normal;    
+}   
+
+@font-face {
+font-family: 'Signika-Regular';
+src: url('../fonts/Signika-Regular.ttf') format('truetype');
+font-weight: normal;
+font-style: normal;    
+}   
+
+@font-face {
+font-family: 'Teko-Bold';
+src: url('../fonts/Teko-Bold.ttf') format('truetype');
+font-weight: normal;
+font-style: normal;    
+}   
+
+@font-face {
+font-family: 'LuckiestGuy-Regular';
+src: url('../fonts/LuckiestGuy-Regular.ttf') format('truetype');
+font-weight: normal;
+font-style: normal;    
+}  
+
+@font-face {
+font-family: 'Baloo-Regular';
+src: url('../fonts/Baloo-Regular.ttf') format('truetype');
+font-weight: normal;
+font-style: normal;    
+}  
+
+@font-face {
+font-family: 'CarterOne-Regular';
+src: url('../fonts/CarterOne-Regular.ttf') format('truetype');
+font-weight: normal;
+font-style: normal;    
+}  
+
+@font-face {
+font-family: 'Chewy-Regular';
+src: url('../fonts/Chewy-Regular.ttf') format('truetype');
+font-weight: normal;
+font-style: normal;    
+}   
+
+@font-face {
+font-family: 'Courgette-Regular';
+src: url('../fonts/Courgette-Regular.ttf') format('truetype');
+font-weight: normal;
+font-style: normal;    
+}   
+
+@font-face {
+font-family: 'LexendDeca-Regular';
+src: url('../fonts/LexendDeca-Regular.ttf') format('truetype');
+font-weight: normal;
+font-style: normal;    
+}   
+
+@font-face {
+font-family: 'RubikMonoOne-Regular';
+src: url('../fonts/RubikMonoOne-Regular.ttf') format('truetype');
+font-weight: normal;
+font-style: normal;    
+}   
+
+@font-face {
+font-family: 'SigmarOne-Regular';
+src: url('../fonts/SigmarOne-Regular.ttf') format('truetype');
+font-weight: normal;
+font-style: normal;    
+}   
+
+@font-face {
+font-family: 'Viga-Regular';
+src: url('../fonts/Viga-Regular.ttf') format('truetype');
+font-weight: normal;
+font-style: normal;    
+}   
+
+@font-face {
+font-family: 'Grandstander';
+src: url('../fonts/Grandstander-Black.ttf') format('truetype');
+font-weight: normal;
+font-style: normal;    
+} 
+
+@font-face {
+font-family: 'PassionOne';
+src: url('../fonts/PassionOne-Regular.ttf') format('truetype');
+font-weight: normal;
+font-style: normal;    
+}  
+
+@font-face {
+font-family: 'Theboldfont';
+src: url('../fonts/theboldfont.ttf') format('truetype');
+font-weight: normal;
+font-style: normal;    
+}  
+
+@font-face {
+    font-family: 'Futura-Condensed-Extra-Bold';
+    src: url('../fonts/Futura-Condensed-Extra-Bold.otf') format('opentype');
+    font-weight: normal;
+    font-style: normal;    
+    }  
+