feat: REST clients, beans, new pages (coaches, sessions, workshops), dashboard real data
This commit is contained in:
dahoud
@@ -0,0 +1,70 @@
|
||||
<?xml version="1.0" encoding="UTF-8"?>
|
||||
<faces-config xmlns="https://jakarta.ee/xml/ns/jakartaee"
|
||||
xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
|
||||
xsi:schemaLocation="https://jakarta.ee/xml/ns/jakartaee
|
||||
https://jakarta.ee/xml/ns/jakartaee/web-facesconfig_4_0.xsd"
|
||||
version="4.0">
|
||||
|
||||
<application>
|
||||
<locale-config>
|
||||
<default-locale>fr</default-locale>
|
||||
<supported-locale>en</supported-locale>
|
||||
<supported-locale>fr</supported-locale>
|
||||
</locale-config>
|
||||
|
||||
<resource-bundle>
|
||||
<base-name>messages</base-name>
|
||||
<var>msg</var>
|
||||
</resource-bundle>
|
||||
</application>
|
||||
|
||||
<!-- Freya Menu Component Configuration -->
|
||||
<component>
|
||||
<component-type>org.primefaces.component.FreyaMenu</component-type>
|
||||
<component-class>org.primefaces.freya.component.FreyaMenu</component-class>
|
||||
</component>
|
||||
|
||||
<render-kit>
|
||||
<renderer>
|
||||
<component-family>org.primefaces.component</component-family>
|
||||
<renderer-type>org.primefaces.component.FreyaMenuRenderer</renderer-type>
|
||||
<renderer-class>org.primefaces.freya.component.FreyaMenuRenderer</renderer-class>
|
||||
</renderer>
|
||||
</render-kit>
|
||||
|
||||
<!-- Navigation Rules -->
|
||||
<navigation-rule>
|
||||
<from-view-id>*</from-view-id>
|
||||
|
||||
<navigation-case>
|
||||
<from-outcome>dashboard</from-outcome>
|
||||
<to-view-id>/pages/dashboard.xhtml</to-view-id>
|
||||
<redirect/>
|
||||
</navigation-case>
|
||||
|
||||
<navigation-case>
|
||||
<from-outcome>profile</from-outcome>
|
||||
<to-view-id>/pages/profile.xhtml</to-view-id>
|
||||
<redirect/>
|
||||
</navigation-case>
|
||||
|
||||
<navigation-case>
|
||||
<from-outcome>clients</from-outcome>
|
||||
<to-view-id>/pages/clients.xhtml</to-view-id>
|
||||
<redirect/>
|
||||
</navigation-case>
|
||||
|
||||
<navigation-case>
|
||||
<from-outcome>home</from-outcome>
|
||||
<to-view-id>/index.xhtml</to-view-id>
|
||||
<redirect/>
|
||||
</navigation-case>
|
||||
|
||||
<navigation-case>
|
||||
<from-outcome>login</from-outcome>
|
||||
<to-view-id>/login.xhtml</to-view-id>
|
||||
<redirect/>
|
||||
</navigation-case>
|
||||
</navigation-rule>
|
||||
|
||||
</faces-config>
|
||||
@@ -0,0 +1,93 @@
|
||||
<ui:composition xmlns="http://www.w3.org/1999/xhtml"
|
||||
xmlns:f="http://java.sun.com/jsf/core"
|
||||
xmlns:h="http://java.sun.com/jsf/html"
|
||||
xmlns:ui="http://java.sun.com/jsf/facelets"
|
||||
xmlns:p="http://primefaces.org/ui">
|
||||
|
||||
<a href="#" id="layout-config-button" class="layout-config-button">
|
||||
<i class="pi pi-cog"/>
|
||||
</a>
|
||||
|
||||
<div id="layout-config" class="layout-config">
|
||||
<h:form id="config-form" styleClass="layout-config-form">
|
||||
<h5 style="margin-top: 0">Menu Type</h5>
|
||||
<p:selectOneRadio value="#{guestPreferences.menuMode}" layout="pageDirection"
|
||||
onchange="PrimeFaces.FreyaConfigurator.changeMenuMode(event.target.value)" >
|
||||
<f:selectItem itemLabel="Horizontal" itemValue="layout-horizontal" />
|
||||
<f:selectItem itemLabel="Sidebar" itemValue="layout-sidebar" />
|
||||
<f:selectItem itemLabel="Slim" itemValue="layout-slim" />
|
||||
<p:ajax listener="#{guestPreferences.onMenuTypeChange}" update="config-form" />
|
||||
</p:selectOneRadio>
|
||||
|
||||
<hr/>
|
||||
|
||||
<h5>Color Scheme</h5>
|
||||
<p:selectOneRadio value="#{guestPreferences.darkMode}" layout="pageDirection"
|
||||
onchange="PrimeFaces.FreyaConfigurator.changeLayout('#{guestPreferences.componentTheme}', event.target.value)" >
|
||||
<f:selectItem itemLabel="Light" itemValue="light" />
|
||||
<f:selectItem itemLabel="Dark" itemValue="dark" />
|
||||
<p:ajax onstart="PrimeFaces.FreyaConfigurator.beforeResourceChange()" update="config-form logolink"/>
|
||||
</p:selectOneRadio>
|
||||
|
||||
<p:outputPanel rendered="#{guestPreferences.menuMode eq 'layout-horizontal'}">
|
||||
<hr/>
|
||||
<h5>Topbar and Menu Mode</h5>
|
||||
<p:selectOneRadio value="#{guestPreferences.topbarTheme}" layout="pageDirection"
|
||||
onchange="PrimeFaces.FreyaConfigurator.changeSectionTheme(event.target.value , 'layout-topbar');PrimeFaces.FreyaConfigurator.changeSectionTheme(event.target.value , 'layout-menu')" >
|
||||
<f:selectItem itemLabel="Light" itemValue="light" itemDisabled="#{guestPreferences.darkMode != 'light'}" />
|
||||
<f:selectItem itemLabel="Dark" itemValue="dark" itemDisabled="#{guestPreferences.darkMode != 'light'}"/>
|
||||
<p:ajax update="logolink config-form"/>
|
||||
</p:selectOneRadio>
|
||||
</p:outputPanel>
|
||||
|
||||
<p:outputPanel rendered="#{guestPreferences.menuMode != 'layout-horizontal'}">
|
||||
<hr/>
|
||||
<h5>Topbar Mode</h5>
|
||||
<p:selectOneRadio value="#{guestPreferences.topbarTheme}" layout="pageDirection"
|
||||
onchange="PrimeFaces.FreyaConfigurator.changeSectionTheme(event.target.value , 'layout-topbar')" >
|
||||
<f:selectItem itemLabel="Light" itemValue="light" itemDisabled="#{guestPreferences.darkMode != 'light'}" />
|
||||
<f:selectItem itemLabel="Dark" itemValue="dark" itemDisabled="#{guestPreferences.darkMode != 'light'}"/>
|
||||
<p:ajax update="logolink config-form"/>
|
||||
</p:selectOneRadio>
|
||||
</p:outputPanel>
|
||||
|
||||
<p:outputPanel rendered="#{guestPreferences.menuMode != 'layout-horizontal'}">
|
||||
<hr/>
|
||||
<h5>Menu Mode</h5>
|
||||
<p:selectOneRadio value="#{guestPreferences.menuTheme}" layout="pageDirection"
|
||||
onchange="PrimeFaces.FreyaConfigurator.changeSectionTheme(event.target.value , 'layout-menu')" >
|
||||
<f:selectItem itemLabel="Light" itemValue="light" itemDisabled="#{guestPreferences.darkMode != 'light'}" />
|
||||
<f:selectItem itemLabel="Dark" itemValue="dark" itemDisabled="#{guestPreferences.darkMode != 'light'}"/>
|
||||
<p:ajax update="logolink config-form"/>
|
||||
</p:selectOneRadio>
|
||||
</p:outputPanel>
|
||||
|
||||
<hr/>
|
||||
|
||||
<h5>Input Style</h5>
|
||||
<p:selectOneRadio value="#{guestPreferences.inputStyle}" layout="pageDirection"
|
||||
onchange="PrimeFaces.FreyaConfigurator.updateInputStyle(event.target.value)">
|
||||
<f:selectItem itemLabel="Outlined" itemValue="outlined" />
|
||||
<f:selectItem itemLabel="Filled" itemValue="filled" />
|
||||
<p:ajax />
|
||||
</p:selectOneRadio>
|
||||
|
||||
<hr/>
|
||||
|
||||
<h5>Theme Colors</h5>
|
||||
<div class="layout-themes">
|
||||
<ui:repeat value="#{guestPreferences.componentThemes}" var="componentTheme">
|
||||
<div>
|
||||
<p:commandLink actionListener="#{guestPreferences.setComponentTheme(componentTheme.file)}"
|
||||
style="background-color: #{componentTheme.color};" title="#{componentTheme.name}"
|
||||
process="@this"
|
||||
update="config-form"
|
||||
onstart="PrimeFaces.FreyaConfigurator.beforeResourceChange()"
|
||||
oncomplete="PrimeFaces.FreyaConfigurator.changeComponentsTheme('#{componentTheme.file}', '#{guestPreferences.darkMode}')">
|
||||
</p:commandLink>
|
||||
</div>
|
||||
</ui:repeat>
|
||||
</div>
|
||||
</h:form>
|
||||
</div>
|
||||
</ui:composition>
|
||||
@@ -0,0 +1,56 @@
|
||||
<ui:composition xmlns="http://www.w3.org/1999/xhtml" xmlns:h="http://java.sun.com/jsf/html" xmlns:f="http://java.sun.com/jsf/core"
|
||||
xmlns:ui="http://java.sun.com/jsf/facelets" xmlns:p="http://primefaces.org/ui">
|
||||
|
||||
<div class="layout-footer">
|
||||
<div class="grid">
|
||||
<div class="col-12 lg:col-4">
|
||||
<div class="grid">
|
||||
<div class="col-6">
|
||||
<span class="footer-menutitle">SITE MAP</span>
|
||||
<ul>
|
||||
<li><a href="dashboard.xhtml">Dashboard</a></li>
|
||||
<li><a href="crud.xhtml">Crud</a></li>
|
||||
<li><a href="invoice.xhtml">Invoice</a></li>
|
||||
<li><a href="help.xhtml">Help</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
<div class="col-6">
|
||||
<span class="footer-menutitle"></span>
|
||||
<ul>
|
||||
<li><a href="calendar.xhtml">Calendar</a></li>
|
||||
<li><a href="widgets.xhtml">Widgets</a></li>
|
||||
<li><a href="documentation.xhtml">Documentation</a></li>
|
||||
<li><a href="https://www.primefaces.org/store">Buy Now</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
<div class="col-12 md:col-6 lg:col-3">
|
||||
<span class="footer-menutitle">CONTACT US</span>
|
||||
<ul>
|
||||
<li>(415) 931-1624 794</li>
|
||||
<li>Mcallister St San Francisco,</li>
|
||||
<li>California(CA), 94102</li>
|
||||
</ul>
|
||||
</div>
|
||||
<div class="col-12 md:col-6 lg:col-5">
|
||||
<span class="footer-menutitle">NEWSLETTER</span>
|
||||
<span class="footer-subtitle">Join our newsletter to get notification about the new features.</span>
|
||||
<h:form>
|
||||
<div class="newsletter-input">
|
||||
<p:inputText placeholder="email address" />
|
||||
<p:commandButton value="Join" styleClass="ui-button-secondary "/>
|
||||
</div>
|
||||
</h:form>
|
||||
</div>
|
||||
<div class="col-12">
|
||||
<div class="footer-bottom">
|
||||
<h4>freya</h4>
|
||||
<h6>Copyright Ⓒ PrimeTek Informatics</h6>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</ui:composition>
|
||||
@@ -0,0 +1,61 @@
|
||||
<ui:composition xmlns="http://www.w3.org/1999/xhtml" xmlns:h="http://java.sun.com/jsf/html"
|
||||
xmlns:f="http://java.sun.com/jsf/core" xmlns:ui="http://java.sun.com/jsf/facelets"
|
||||
xmlns:p="http://primefaces.org/ui" xmlns:fr="http://primefaces.org/freya">
|
||||
|
||||
<div class="menu-wrapper">
|
||||
<div class="sidebar-logo">
|
||||
<h:link outcome="/pages/dashboard">
|
||||
<p:graphicImage name="images/logo-freya-single.svg" library="freya-layout" />
|
||||
</h:link>
|
||||
<a href="#" class="sidebar-pin" title="Toggle Menu">
|
||||
<span class="pin"></span>
|
||||
</a>
|
||||
</div>
|
||||
<div class="layout-menu-container">
|
||||
<h:form id="menuform">
|
||||
<fr:menu widgetVar="FreyaMenuWidget">
|
||||
<p:menuitem id="m_dashboard" value="Dashboard" icon="pi pi-home" outcome="/pages/dashboard" />
|
||||
<p:submenu id="m_clients" label="Clients" icon="pi pi-users">
|
||||
<p:menuitem id="m_clients_overview" value="Vue d'ensemble" icon="pi pi-chart-pie"
|
||||
outcome="/pages/clients" />
|
||||
<p:menuitem id="m_clients_list" value="Liste des Clients" icon="pi pi-list"
|
||||
outcome="/pages/clients" />
|
||||
<p:menuitem id="m_clients_add" value="Ajouter Client" icon="pi pi-plus"
|
||||
outcome="/pages/clients/add" />
|
||||
<p:menuitem id="m_clients_search" value="Rechercher" icon="pi pi-search"
|
||||
outcome="/pages/clients/search" />
|
||||
</p:submenu>
|
||||
<p:submenu id="m_coaches" label="Coaches" icon="pi pi-user-edit">
|
||||
<p:menuitem id="m_coaches_list" value="Liste des Coaches" icon="pi pi-list"
|
||||
outcome="/pages/coaches" />
|
||||
<p:menuitem id="m_coaches_dashboard" value="Tableau de Bord" icon="pi pi-chart-line"
|
||||
outcome="/pages/dashboard" />
|
||||
</p:submenu>
|
||||
<p:submenu id="m_sessions" label="Sessions" icon="pi pi-calendar">
|
||||
<p:menuitem id="m_sessions_list" value="Liste des Sessions" icon="pi pi-list"
|
||||
outcome="/pages/sessions" />
|
||||
<p:menuitem id="m_sessions_dashboard" value="Tableau de Bord" icon="pi pi-chart-line"
|
||||
outcome="/pages/dashboard" />
|
||||
</p:submenu>
|
||||
<p:submenu id="m_workshops" label="Ateliers" icon="pi pi-book">
|
||||
<p:menuitem id="m_workshops_list" value="Liste des Ateliers" icon="pi pi-list"
|
||||
outcome="/pages/workshops" />
|
||||
<p:menuitem id="m_workshops_dashboard" value="Tableau de Bord" icon="pi pi-chart-line"
|
||||
outcome="/pages/dashboard" />
|
||||
</p:submenu>
|
||||
<p:submenu id="m_reports" label="Rapports" icon="pi pi-chart-bar">
|
||||
<p:menuitem id="m_reports_dashboard" value="Tableau de Bord" icon="pi pi-chart-line"
|
||||
outcome="/pages/dashboard" />
|
||||
<p:menuitem id="m_reports_coming" value="À venir" icon="pi pi-clock" disabled="true" />
|
||||
</p:submenu>
|
||||
<p:submenu id="m_admin" label="Administration" icon="pi pi-cog">
|
||||
<p:menuitem id="m_admin_profile" value="Mon Profil" icon="pi pi-user"
|
||||
outcome="/pages/profile" />
|
||||
<p:menuitem id="m_admin_coming" value="À venir" icon="pi pi-clock" disabled="true" />
|
||||
</p:submenu>
|
||||
</fr:menu>
|
||||
</h:form>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</ui:composition>
|
||||
@@ -0,0 +1,139 @@
|
||||
<!DOCTYPE html>
|
||||
<html xmlns="http://www.w3.org/1999/xhtml"
|
||||
xmlns:h="http://java.sun.com/jsf/html"
|
||||
xmlns:f="http://java.sun.com/jsf/core"
|
||||
xmlns:ui="http://java.sun.com/jsf/facelets"
|
||||
xmlns:p="http://primefaces.org/ui">
|
||||
|
||||
<h:head>
|
||||
<f:facet name="first">
|
||||
<meta charset="utf-8"/>
|
||||
<meta http-equiv="X-UA-Compatible" content="IE=edge"/>
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1"/>
|
||||
<meta name="author" content="GBCM LLC"/>
|
||||
<meta name="description" content="Global Business Consulting & Management - Votre partenaire de confiance pour le développement professionnel"/>
|
||||
<meta name="keywords" content="consulting, coaching, management, business, formation"/>
|
||||
</f:facet>
|
||||
|
||||
<title>
|
||||
<ui:insert name="title">GBCM - Global Business Consulting & Management</ui:insert>
|
||||
</title>
|
||||
|
||||
<!-- PrimeFaces Core CSS (automatiquement inclus par Quarkus) -->
|
||||
|
||||
<!-- Freya Theme CSS -->
|
||||
<h:outputStylesheet name="theme.css" library="primefaces-freya-blue-light"/>
|
||||
|
||||
<!-- Layout CSS -->
|
||||
<h:outputStylesheet name="css/layout.css" library="freya-layout"/>
|
||||
|
||||
<!-- PrimeFlex CSS pour les utilitaires -->
|
||||
<h:outputStylesheet name="primeflex.min.css" library="primefaces"/>
|
||||
|
||||
<!-- Font Awesome -->
|
||||
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css"/>
|
||||
|
||||
<!-- Custom CSS for public pages with Freya variables -->
|
||||
<style>
|
||||
.public-header {
|
||||
background: linear-gradient(135deg, var(--primary-color, #5297FF) 0%, var(--primary-dark-color, #297FFF) 100%);
|
||||
color: var(--primary-color-text, #FFFFFF);
|
||||
padding: 1rem 0;
|
||||
box-shadow: 0 2px 4px rgba(0,0,0,0.1);
|
||||
}
|
||||
|
||||
.public-header .logo {
|
||||
font-size: 2rem;
|
||||
font-weight: bold;
|
||||
text-decoration: none;
|
||||
color: var(--primary-color-text, #FFFFFF);
|
||||
}
|
||||
|
||||
.public-header .logo:hover {
|
||||
color: var(--primary-lighter-color, rgba(105, 183, 255, 0.8));
|
||||
}
|
||||
|
||||
.public-content {
|
||||
min-height: calc(100vh - 120px);
|
||||
padding: 0;
|
||||
background: var(--surface-a, #ffffff);
|
||||
color: var(--text-color, #69707A);
|
||||
}
|
||||
|
||||
.public-footer {
|
||||
background: var(--surface-d, #D4D6D9);
|
||||
color: var(--text-color, #69707A);
|
||||
text-align: center;
|
||||
padding: 1rem 0;
|
||||
margin-top: 2rem;
|
||||
}
|
||||
|
||||
body {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
font-family: var(--font-family, -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Helvetica Neue, Arial, sans-serif);
|
||||
background: var(--surface-a, #ffffff);
|
||||
color: var(--text-color, #69707A);
|
||||
}
|
||||
|
||||
/* Utiliser les classes Freya pour les composants */
|
||||
.layout-wrapper {
|
||||
max-width: 1200px;
|
||||
margin: 0 auto;
|
||||
}
|
||||
</style>
|
||||
|
||||
<ui:insert name="head"/>
|
||||
</h:head>
|
||||
|
||||
<h:body styleClass="public-layout layout-light">
|
||||
<!-- Header public avec classes Freya -->
|
||||
<div class="public-header">
|
||||
<div class="layout-wrapper">
|
||||
<div class="flex align-items-center justify-content-between px-3">
|
||||
<h:link outcome="/index" styleClass="logo">
|
||||
<i class="pi pi-briefcase mr-2"></i>
|
||||
GBCM
|
||||
</h:link>
|
||||
|
||||
<div class="flex align-items-center gap-3">
|
||||
<h:link outcome="/index" styleClass="text-white no-underline">
|
||||
<i class="pi pi-home mr-1"></i>
|
||||
Accueil
|
||||
</h:link>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Contenu principal -->
|
||||
<div class="public-content">
|
||||
<ui:insert name="content">
|
||||
<p>Contenu par défaut</p>
|
||||
</ui:insert>
|
||||
</div>
|
||||
|
||||
<!-- Footer public -->
|
||||
<div class="public-footer">
|
||||
<div class="layout-wrapper">
|
||||
<div class="px-3">
|
||||
<p class="m-0">
|
||||
© 2025 GBCM LLC - Global Business Consulting & Management.
|
||||
Tous droits réservés.
|
||||
</p>
|
||||
<p class="m-0 mt-2 text-sm">
|
||||
<i class="pi pi-envelope mr-1"></i>
|
||||
contact@gbcm.com |
|
||||
<i class="pi pi-phone mr-1"></i>
|
||||
+33 1 23 45 67 89
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Messages globaux -->
|
||||
<p:growl id="messages" showDetail="true" life="3000"/>
|
||||
|
||||
<ui:insert name="scripts"/>
|
||||
</h:body>
|
||||
</html>
|
||||
@@ -0,0 +1,284 @@
|
||||
<ui:composition xmlns="http://www.w3.org/1999/xhtml"
|
||||
xmlns:f="http://java.sun.com/jsf/core"
|
||||
xmlns:h="http://java.sun.com/jsf/html"
|
||||
xmlns:ui="http://java.sun.com/jsf/facelets"
|
||||
xmlns:p="http://primefaces.org/ui">
|
||||
|
||||
<div class="layout-rightpanel">
|
||||
<div class="rightpanel-wrapper">
|
||||
<div class="rightpanel-section weather-section">
|
||||
<div class="section-header">
|
||||
<h6>Today</h6>
|
||||
</div>
|
||||
<div class="weather">
|
||||
<p:graphicImage name="images/rightpanel/icon-sun.svg" library="demo" />
|
||||
<div class="weather-info">
|
||||
<h6>Ankara, 22 May</h6>
|
||||
<h1>24º</h1>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="rightpanel-section tasks-section">
|
||||
<div class="section-header">
|
||||
<h6>My list</h6>
|
||||
<h:form>
|
||||
<p:commandButton type="button" icon="pi pi-plus" styleClass="ui-button-secondary ui-button-flat rounded-button" />
|
||||
</h:form>
|
||||
</div>
|
||||
<ul>
|
||||
<li>
|
||||
<div class="task-info">
|
||||
<h6>Perform usability testing for P15 MVP</h6>
|
||||
<span>-Public pages</span>
|
||||
<span>-Product pages</span>
|
||||
</div>
|
||||
</li>
|
||||
<li>
|
||||
<div class="task-info">
|
||||
<h6>Buy puzzle set from Amazon</h6>
|
||||
<span>Ravensburger Seurat, 2000</span>
|
||||
</div>
|
||||
</li>
|
||||
<li class="done">
|
||||
<div class="task-info">
|
||||
<h6>Morning Run</h6>
|
||||
</div>
|
||||
<i class="pi pi-check"></i>
|
||||
</li>
|
||||
<li class="done">
|
||||
<div class="task-info">
|
||||
<h6>Morning Run</h6>
|
||||
</div>
|
||||
<i class="pi pi-check"></i>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
<div class="rightpanel-section favorites-section">
|
||||
<div class="section-header">
|
||||
<h6>Favorites</h6>
|
||||
</div>
|
||||
<div class="favorite-items">
|
||||
<a href="#" class="favorite-item">
|
||||
<p:graphicImage name="images/rightpanel/github.svg" library="demo" />
|
||||
</a>
|
||||
<a href="#" class="favorite-item">
|
||||
<p:graphicImage name="images/rightpanel/slack.svg" library="demo" />
|
||||
</a>
|
||||
<a href="#" class="favorite-item">
|
||||
<p:graphicImage name="images/rightpanel/aws.svg" library="demo" />
|
||||
</a>
|
||||
<a href="#" class="favorite-item">
|
||||
<p:graphicImage name="images/rightpanel/jenkins.svg" library="demo" />
|
||||
</a>
|
||||
<a href="#" class="favorite-item">
|
||||
<p:graphicImage name="images/rightpanel/jira.svg" library="demo" />
|
||||
</a>
|
||||
<a href="#" class="add-item">
|
||||
<i class="pi pi-plus"></i>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="rightpanel-section chat-section chat">
|
||||
<h:form>
|
||||
<p:tabView>
|
||||
<p:tab>
|
||||
<f:facet name="title">
|
||||
<p:graphicImage name="images/rightpanel/profile-1.png" library="demo" />
|
||||
<span class="ui-badge">3</span>
|
||||
</f:facet>
|
||||
<div class="chat">
|
||||
<span class="fade"></span>
|
||||
<div class="chat-content">
|
||||
<div class="chat-message send">
|
||||
<span class="name">You</span>
|
||||
<div class="message">
|
||||
<p>Hey M. hope you are well. Our idea is accepted by the board. Now it’s time to execute it.</p>
|
||||
<span>3 mins ago</span>
|
||||
</div>
|
||||
<div class="message">
|
||||
<p>we did it! 🤠</p>
|
||||
<span>3 mins ago</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="chat-message">
|
||||
<span class="name">Micheal J.</span>
|
||||
<div class="message">
|
||||
<p>That’s really good!</p>
|
||||
<span>3 mins ago</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="chat-message send">
|
||||
<span class="name">You</span>
|
||||
<div class="message">
|
||||
<p>But it’s important to ship MVP ASAP</p>
|
||||
<span>3 mins ago</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="chat-message">
|
||||
<span class="name">Micheal J.</span>
|
||||
<div class="message">
|
||||
<p>I’ll be looking at the process then, just to be sure 🤓 </p>
|
||||
<span>3 mins ago</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="chat-message send">
|
||||
<span class="name">You</span>
|
||||
<div class="message">
|
||||
<p>That’s awesome. Thanks!</p>
|
||||
<span>3 mins ago</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="chat-message">
|
||||
|
||||
</div>
|
||||
</div>
|
||||
<div class="chat-input">
|
||||
<p:inputText placeholder="Write here..." />
|
||||
</div>
|
||||
</div>
|
||||
</p:tab>
|
||||
<p:tab>
|
||||
<f:facet name="title">
|
||||
<p:graphicImage name="images/rightpanel/profile-2.png" library="demo" />
|
||||
<span class="ui-badge">1</span>
|
||||
</f:facet>
|
||||
<div class="chat">
|
||||
<span class="fade"></span>
|
||||
<div class="chat-content">
|
||||
<div class="chat-message">
|
||||
<span class="name">Sarah</span>
|
||||
<div class="message">
|
||||
<p>That’s really good!</p>
|
||||
<span>3 mins ago</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="chat-message send">
|
||||
<span class="name">You</span>
|
||||
<div class="message">
|
||||
<p>But it’s important to ship MVP ASAP</p>
|
||||
<span>3 mins ago</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="chat-message">
|
||||
|
||||
</div>
|
||||
</div>
|
||||
<div class="chat-input">
|
||||
<p:inputText placeholder="Write here..." />
|
||||
</div>
|
||||
</div>
|
||||
</p:tab>
|
||||
<p:tab>
|
||||
<f:facet name="title">
|
||||
<p:graphicImage name="images/rightpanel/profile-3.png" library="demo" />
|
||||
</f:facet>
|
||||
<div class="chat">
|
||||
<div class="chat-content no-message">
|
||||
<h4>No Message From Margret K.</h4>
|
||||
</div>
|
||||
<div class="chat-input">
|
||||
<p:inputText placeholder="Write here..." />
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</p:tab>
|
||||
<p:tab>
|
||||
<f:facet name="title">
|
||||
<p:graphicImage name="images/rightpanel/profile-4.png" library="demo" />
|
||||
</f:facet>
|
||||
<div class="chat">
|
||||
<div class="chat-content no-message">
|
||||
<h4>No Message From Bob C.</h4>
|
||||
</div>
|
||||
<div class="chat-input">
|
||||
<p:inputText placeholder="Write here..." />
|
||||
</div>
|
||||
</div>
|
||||
</p:tab>
|
||||
<p:tab>
|
||||
<f:facet name="title">
|
||||
<i class="pi pi-plus"></i>
|
||||
</f:facet>
|
||||
<div class="chat">
|
||||
<span class="fade"></span>
|
||||
<div class="contacts">
|
||||
<ul>
|
||||
<li>
|
||||
<p:graphicImage name="images/rightpanel/profile-1.png" library="demo" />
|
||||
<div class="contact-info">
|
||||
<h6>John Doe</h6>
|
||||
<span>Active</span>
|
||||
</div>
|
||||
</li>
|
||||
<li>
|
||||
<p:graphicImage name="images/rightpanel/profile-2.png" library="demo" />
|
||||
<div class="contact-info">
|
||||
<h6>John Doe</h6>
|
||||
<span>Active</span>
|
||||
</div>
|
||||
</li>
|
||||
<li>
|
||||
<p:graphicImage name="images/rightpanel/profile-3.png" library="demo" />
|
||||
<div class="contact-info">
|
||||
<h6>John Doe</h6>
|
||||
<span>Active</span>
|
||||
</div>
|
||||
</li>
|
||||
<li>
|
||||
<p:graphicImage name="images/rightpanel/profile-4.png" library="demo" />
|
||||
<div class="contact-info">
|
||||
<h6>John Doe</h6>
|
||||
<span>Active</span>
|
||||
</div>
|
||||
</li>
|
||||
<li>
|
||||
<p:graphicImage name="images/rightpanel/profile-1.png" library="demo" />
|
||||
<div class="contact-info">
|
||||
<h6>John Doe</h6>
|
||||
<span>Active</span>
|
||||
</div>
|
||||
</li>
|
||||
<li>
|
||||
<p:graphicImage name="images/rightpanel/profile-1.png" library="demo" />
|
||||
<div class="contact-info">
|
||||
<h6>John Doe</h6>
|
||||
<span>Active</span>
|
||||
</div>
|
||||
</li>
|
||||
<li>
|
||||
<p:graphicImage name="images/rightpanel/profile-1.png" library="demo" />
|
||||
<div class="contact-info">
|
||||
<h6>John Doe</h6>
|
||||
<span>Active</span>
|
||||
</div>
|
||||
</li>
|
||||
<li>
|
||||
<p:graphicImage name="images/rightpanel/profile-1.png" library="demo" />
|
||||
<div class="contact-info">
|
||||
<h6>John Doe</h6>
|
||||
<span>Active</span>
|
||||
</div>
|
||||
</li>
|
||||
<li>
|
||||
<p:graphicImage name="images/rightpanel/profile-1.png" library="demo" />
|
||||
<div class="contact-info">
|
||||
<h6>John Doe</h6>
|
||||
<span>Active</span>
|
||||
</div>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
<div class="chat-input">
|
||||
<p:inputText placeholder="Search new person" />
|
||||
</div>
|
||||
</div>
|
||||
</p:tab>
|
||||
</p:tabView>
|
||||
</h:form>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</ui:composition>
|
||||
@@ -0,0 +1,58 @@
|
||||
<!DOCTYPE html>
|
||||
<html xmlns="http://www.w3.org/1999/xhtml"
|
||||
xmlns:h="http://java.sun.com/jsf/html"
|
||||
xmlns:f="http://java.sun.com/jsf/core"
|
||||
xmlns:ui="http://java.sun.com/jsf/facelets"
|
||||
xmlns:p="http://primefaces.org/ui"
|
||||
lang="en">
|
||||
|
||||
<h:head>
|
||||
<f:facet name="first">
|
||||
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
|
||||
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0"/>
|
||||
<meta name="apple-mobile-web-app-capable" content="yes" />
|
||||
<link rel="icon" href="#{request.contextPath}/resources/freya-layout/images/favicon.ico" type="image/x-icon"></link>
|
||||
</f:facet>
|
||||
<title><ui:insert name="title">GBCM - Global Business Consulting and Management</ui:insert></title>
|
||||
<h:outputStylesheet name="css/layout-#{guestPreferences.darkMode}.css" library="freya-layout" />
|
||||
<h:outputStylesheet name="css/gbcm-custom.css" library="freya-layout" />
|
||||
<h:outputScript name="js/layout.js" library="freya-layout" />
|
||||
<h:outputScript name="js/prism.js" library="freya-layout"/>
|
||||
<ui:insert name="head"/>
|
||||
</h:head>
|
||||
|
||||
<h:body styleClass="#{guestPreferences.inputStyleClass}">
|
||||
<div class="layout-wrapper layout-topbar-#{guestPreferences.topbarTheme} layout-menu-#{guestPreferences.menuTheme} #{guestPreferences.menuMode}" >
|
||||
<ui:include src="./topbar.xhtml"/>
|
||||
|
||||
<ui:include src="./rightpanel.xhtml"/>
|
||||
<ui:include src="./config.xhtml" />
|
||||
|
||||
<div class="layout-main">
|
||||
<div class="layout-content">
|
||||
<ui:insert name="content"/>
|
||||
</div>
|
||||
<ui:include src="./footer.xhtml"/>
|
||||
</div>
|
||||
|
||||
<p:ajaxStatus style="width:32px;height:32px;position:fixed;right:7px;bottom:7px">
|
||||
<f:facet name="start">
|
||||
<i class="pi pi-spin pi-spinner ajax-loader" aria-hidden="true"/>
|
||||
</f:facet>
|
||||
|
||||
<f:facet name="complete">
|
||||
<h:outputText value="" />
|
||||
</f:facet>
|
||||
</p:ajaxStatus>
|
||||
<div class="layout-mask modal-in"></div>
|
||||
</div>
|
||||
<h:outputStylesheet name="css/primeicons.css" library="freya-layout" />
|
||||
<h:outputStylesheet name="css/primeflex.min.css" library="freya-layout" />
|
||||
<h:outputStylesheet name="css/#{guestPreferences.layout}.css" library="freya-layout" />
|
||||
<h:outputStylesheet name="css/demo-#{guestPreferences.darkMode}.css" library="demo" />
|
||||
|
||||
|
||||
</h:body>
|
||||
|
||||
</html>
|
||||
@@ -0,0 +1,151 @@
|
||||
<ui:composition xmlns="http://www.w3.org/1999/xhtml"
|
||||
xmlns:h="http://java.sun.com/jsf/html"
|
||||
xmlns:f="http://java.sun.com/jsf/core"
|
||||
xmlns:ui="http://java.sun.com/jsf/facelets"
|
||||
xmlns:p="http://primefaces.org/ui"
|
||||
xmlns:po="http://primefaces.org/freya">
|
||||
|
||||
<div class="layout-topbar">
|
||||
<div class="layout-topbar-wrapper">
|
||||
<div class="layout-topbar-left">
|
||||
<a href="#" class="menu-button">
|
||||
<i class="pi pi-bars"/>
|
||||
</a>
|
||||
<h:link id="logolink" outcome="/pages/dashboard" styleClass="layout-topbar-logo">
|
||||
<p:graphicImage name="images/#{ guestPreferences.lightLogo ? 'logo-freya-white.svg' : 'logo-freya.svg'}" library="freya-layout" />
|
||||
</h:link>
|
||||
</div>
|
||||
|
||||
<ui:include src="./menu.xhtml" />
|
||||
|
||||
<div class="layout-topbar-right">
|
||||
<ul class="layout-topbar-actions">
|
||||
<li class="topbar-item search-item ">
|
||||
<a href="#">
|
||||
<i class="topbar-icon pi pi-search"/>
|
||||
</a>
|
||||
<h:form>
|
||||
<h:panelGroup styleClass="search-input-wrapper">
|
||||
<p:inputText placeholder="Search..." />
|
||||
<i class="pi pi-search"/>
|
||||
</h:panelGroup>
|
||||
</h:form>
|
||||
<ul>
|
||||
<h:form onsubmit="return false;">
|
||||
<h:panelGroup styleClass="search-input-wrapper">
|
||||
<p:inputText placeholder="Search..." />
|
||||
<i class="pi pi-search"/>
|
||||
</h:panelGroup>
|
||||
</h:form>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="topbar-item user-profile">
|
||||
<a href="#" class="user-profile-link">
|
||||
<h:panelGroup rendered="#{authBean.userAvatar.startsWith('http')}">
|
||||
<img src="#{authBean.userAvatar}" alt="Avatar" class="user-avatar" />
|
||||
</h:panelGroup>
|
||||
<h:panelGroup rendered="#{!authBean.userAvatar.startsWith('http')}">
|
||||
<p:graphicImage name="#{authBean.userAvatar}" library="freya-layout" styleClass="user-avatar" />
|
||||
</h:panelGroup>
|
||||
<span class="user-info">
|
||||
<span class="user-name">
|
||||
#{authBean.userName}
|
||||
<span class="user-status online"></span>
|
||||
<span class="user-separator">|</span>
|
||||
<span class="user-role">#{authBean.primaryRole}</span>
|
||||
</span>
|
||||
<span class="user-email">#{authBean.userEmail}</span>
|
||||
</span>
|
||||
</a>
|
||||
<ul class="user-dropdown-menu">
|
||||
<!-- En-tête du menu avec infos utilisateur -->
|
||||
<li class="user-dropdown-header">
|
||||
<div class="user-dropdown-avatar">
|
||||
<h:panelGroup rendered="#{authBean.userAvatar.startsWith('http')}">
|
||||
<img src="#{authBean.userAvatar}" alt="Avatar" />
|
||||
</h:panelGroup>
|
||||
<h:panelGroup rendered="#{!authBean.userAvatar.startsWith('http')}">
|
||||
<p:graphicImage name="#{authBean.userAvatar}" library="freya-layout" />
|
||||
</h:panelGroup>
|
||||
<span class="user-status-indicator online"></span>
|
||||
</div>
|
||||
<div class="user-dropdown-info">
|
||||
<div class="user-dropdown-name">#{authBean.userName}</div>
|
||||
<div class="user-dropdown-email">#{authBean.userEmail}</div>
|
||||
<div class="user-dropdown-role">#{authBean.primaryRole}</div>
|
||||
</div>
|
||||
</li>
|
||||
|
||||
<!-- Séparateur -->
|
||||
<li class="user-dropdown-divider"></li>
|
||||
|
||||
<!-- Actions principales -->
|
||||
<li class="user-dropdown-section">
|
||||
<div class="section-title">Mon Compte</div>
|
||||
<div class="section-items">
|
||||
<h:link outcome="/pages/profile" styleClass="dropdown-item">
|
||||
<i class="pi pi-user"></i>
|
||||
<span>Mon Profil</span>
|
||||
<i class="pi pi-angle-right item-arrow"></i>
|
||||
</h:link>
|
||||
<a href="#" class="dropdown-item">
|
||||
<i class="pi pi-cog"></i>
|
||||
<span>Paramètres</span>
|
||||
<i class="pi pi-angle-right item-arrow"></i>
|
||||
</a>
|
||||
<a href="#" class="dropdown-item">
|
||||
<i class="pi pi-shield"></i>
|
||||
<span>Sécurité</span>
|
||||
<i class="pi pi-angle-right item-arrow"></i>
|
||||
</a>
|
||||
</div>
|
||||
</li>
|
||||
|
||||
<!-- Communications -->
|
||||
<li class="user-dropdown-section">
|
||||
<div class="section-title">Communications</div>
|
||||
<div class="section-items">
|
||||
<a href="#" class="dropdown-item">
|
||||
<i class="pi pi-envelope"></i>
|
||||
<span>Messages</span>
|
||||
<span class="item-badge">3</span>
|
||||
</a>
|
||||
<a href="#" class="dropdown-item">
|
||||
<i class="pi pi-bell"></i>
|
||||
<span>Notifications</span>
|
||||
<span class="item-badge">12</span>
|
||||
</a>
|
||||
</div>
|
||||
</li>
|
||||
|
||||
<!-- Séparateur -->
|
||||
<li class="user-dropdown-divider"></li>
|
||||
|
||||
<!-- Actions système -->
|
||||
<li class="user-dropdown-section">
|
||||
<div class="section-items">
|
||||
<a href="#" class="dropdown-item">
|
||||
<i class="pi pi-question-circle"></i>
|
||||
<span>Aide & Support</span>
|
||||
</a>
|
||||
<h:form>
|
||||
<p:commandLink action="#{authBean.logout}" styleClass="dropdown-item logout-item">
|
||||
<i class="pi pi-sign-out"></i>
|
||||
<span>Déconnexion</span>
|
||||
</p:commandLink>
|
||||
</h:form>
|
||||
</div>
|
||||
</li>
|
||||
</ul>
|
||||
</li>
|
||||
|
||||
</ul>
|
||||
<a href="#" class="layout-rightpanel-button">
|
||||
<i class="pi pi-arrow-left"/>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
</ui:composition>
|
||||
@@ -0,0 +1,65 @@
|
||||
<?xml version="1.0" encoding="UTF-8"?>
|
||||
<facelet-taglib xmlns="https://jakarta.ee/xml/ns/jakartaee"
|
||||
xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
|
||||
xsi:schemaLocation="https://jakarta.ee/xml/ns/jakartaee https://jakarta.ee/xml/ns/jakartaee/web-facelettaglibrary_4_0.xsd"
|
||||
version="4.0">
|
||||
|
||||
<namespace>http://primefaces.org/freya</namespace>
|
||||
|
||||
<tag>
|
||||
<description><![CDATA[Menu is a navigation component for Freya Layout.]]></description>
|
||||
<tag-name>menu</tag-name>
|
||||
<component>
|
||||
<component-type>org.primefaces.component.FreyaMenu</component-type>
|
||||
<renderer-type>org.primefaces.component.FreyaMenuRenderer</renderer-type>
|
||||
</component>
|
||||
<attribute>
|
||||
<description><![CDATA[Unique identifier of the component in a namingContainer.]]></description>
|
||||
<name>id</name>
|
||||
<required>false</required>
|
||||
<type>java.lang.String</type>
|
||||
</attribute>
|
||||
<attribute>
|
||||
<description><![CDATA[Boolean value to specify the rendering of the component, when set to false component will not be rendered.]]></description>
|
||||
<name>rendered</name>
|
||||
<required>false</required>
|
||||
<type>java.lang.Boolean</type>
|
||||
</attribute>
|
||||
<attribute>
|
||||
<description><![CDATA[An el expression referring to a server side UIComponent instance in a backing bean.]]></description>
|
||||
<name>binding</name>
|
||||
<required>false</required>
|
||||
<type>jakarta.faces.component.UIComponent</type>
|
||||
</attribute>
|
||||
<attribute>
|
||||
<description><![CDATA[Name of the client side widget.]]></description>
|
||||
<name>widgetVar</name>
|
||||
<required>false</required>
|
||||
<type>java.lang.String</type>
|
||||
</attribute>
|
||||
<attribute>
|
||||
<description><![CDATA[A menu model instance to create menu programmatically.]]></description>
|
||||
<name>model</name>
|
||||
<required>false</required>
|
||||
<type>org.primefaces.model.menu.MenuModel</type>
|
||||
</attribute>
|
||||
<attribute>
|
||||
<description><![CDATA[Inline style of the main container element.]]></description>
|
||||
<name>style</name>
|
||||
<required>false</required>
|
||||
<type>java.lang.String</type>
|
||||
</attribute>
|
||||
<attribute>
|
||||
<description><![CDATA[Style class of the main container element.]]></description>
|
||||
<name>styleClass</name>
|
||||
<required>false</required>
|
||||
<type>java.lang.String</type>
|
||||
</attribute>
|
||||
<attribute>
|
||||
<description><![CDATA[Delay to wait in milliseconds before closing menu on mouse leave. Default is 250.]]></description>
|
||||
<name>closeDelay</name>
|
||||
<required>false</required>
|
||||
<type>java.lang.Integer</type>
|
||||
</attribute>
|
||||
</tag>
|
||||
</facelet-taglib>
|
||||
70
src/main/resources/META-INF/resources/WEB-INF/web.xml
Normal file
70
src/main/resources/META-INF/resources/WEB-INF/web.xml
Normal file
@@ -0,0 +1,70 @@
|
||||
<?xml version="1.0" encoding="UTF-8"?>
|
||||
<web-app xmlns="https://jakarta.ee/xml/ns/jakartaee"
|
||||
xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
|
||||
xsi:schemaLocation="https://jakarta.ee/xml/ns/jakartaee
|
||||
https://jakarta.ee/xml/ns/jakartaee/web-app_5_0.xsd"
|
||||
version="5.0">
|
||||
|
||||
<display-name>GBCM Client Web Application</display-name>
|
||||
|
||||
<!-- Context Parameters -->
|
||||
<context-param>
|
||||
<param-name>jakarta.faces.PROJECT_STAGE</param-name>
|
||||
<param-value>Development</param-value>
|
||||
</context-param>
|
||||
|
||||
<!-- Disable CDI integration in JSF -->
|
||||
<context-param>
|
||||
<param-name>jakarta.faces.ENABLE_CDI_RESOLVER_CHAIN</param-name>
|
||||
<param-value>false</param-value>
|
||||
</context-param>
|
||||
|
||||
<context-param>
|
||||
<param-name>jakarta.faces.DISABLE_FACELET_JSF_VIEWHANDLER</param-name>
|
||||
<param-value>false</param-value>
|
||||
</context-param>
|
||||
|
||||
<context-param>
|
||||
<param-name>jakarta.faces.FACELETS_SKIP_COMMENTS</param-name>
|
||||
<param-value>true</param-value>
|
||||
</context-param>
|
||||
|
||||
<context-param>
|
||||
<param-name>jakarta.faces.FACELETS_REFRESH_PERIOD</param-name>
|
||||
<param-value>0</param-value>
|
||||
</context-param>
|
||||
|
||||
<context-param>
|
||||
<param-name>primefaces.THEME</param-name>
|
||||
<param-value>freya</param-value>
|
||||
</context-param>
|
||||
|
||||
<context-param>
|
||||
<param-name>primefaces.FONT_AWESOME</param-name>
|
||||
<param-value>true</param-value>
|
||||
</context-param>
|
||||
|
||||
<!-- Faces Servlet -->
|
||||
<servlet>
|
||||
<servlet-name>Faces Servlet</servlet-name>
|
||||
<servlet-class>jakarta.faces.webapp.FacesServlet</servlet-class>
|
||||
<load-on-startup>1</load-on-startup>
|
||||
</servlet>
|
||||
|
||||
<servlet-mapping>
|
||||
<servlet-name>Faces Servlet</servlet-name>
|
||||
<url-pattern>*.xhtml</url-pattern>
|
||||
</servlet-mapping>
|
||||
|
||||
<!-- Welcome Files -->
|
||||
<welcome-file-list>
|
||||
<welcome-file>index.html</welcome-file>
|
||||
<welcome-file>index.xhtml</welcome-file>
|
||||
</welcome-file-list>
|
||||
|
||||
<!-- Session Configuration -->
|
||||
<session-config>
|
||||
<session-timeout>30</session-timeout>
|
||||
</session-config>
|
||||
|
||||
</web-app>
|
||||
15
src/main/resources/META-INF/resources/index.html
Normal file
15
src/main/resources/META-INF/resources/index.html
Normal file
@@ -0,0 +1,15 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<title>GBCM - Redirection</title>
|
||||
<meta http-equiv="refresh" content="0; url=index.xhtml">
|
||||
<script>
|
||||
window.location.href = 'index.xhtml';
|
||||
</script>
|
||||
</head>
|
||||
<body>
|
||||
<p>Redirection vers GBCM...</p>
|
||||
<p>Si vous n'êtes pas redirigé automatiquement, <a href="index.xhtml">cliquez ici</a>.</p>
|
||||
</body>
|
||||
</html>
|
||||
344
src/main/resources/META-INF/resources/index.xhtml
Normal file
344
src/main/resources/META-INF/resources/index.xhtml
Normal file
@@ -0,0 +1,344 @@
|
||||
<!DOCTYPE html>
|
||||
<html xmlns="http://www.w3.org/1999/xhtml"
|
||||
xmlns:h="http://java.sun.com/jsf/html"
|
||||
xmlns:f="http://java.sun.com/jsf/core"
|
||||
xmlns:ui="http://java.sun.com/jsf/facelets"
|
||||
xmlns:p="http://primefaces.org/ui">
|
||||
|
||||
<h:head>
|
||||
<f:facet name="first">
|
||||
<meta charset="utf-8"/>
|
||||
<meta http-equiv="X-UA-Compatible" content="IE=edge"/>
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1"/>
|
||||
<meta name="author" content="GBCM LLC"/>
|
||||
<meta name="description" content="Global Business Consulting & Management - Votre partenaire de confiance pour le développement professionnel"/>
|
||||
</f:facet>
|
||||
|
||||
<title>GBCM - Global Business Consulting & Management</title>
|
||||
|
||||
<!-- Freya Theme CSS -->
|
||||
<h:outputStylesheet name="theme.css" library="primefaces-freya-blue-light"/>
|
||||
|
||||
<!-- PrimeFlex CSS -->
|
||||
<h:outputStylesheet name="css/primeflex.min.css" library="freya-layout"/>
|
||||
|
||||
<!-- Layout CSS avec guestPreferences -->
|
||||
<h:outputStylesheet name="css/layout-light.css" library="freya-layout"/>
|
||||
|
||||
<!-- Font Awesome -->
|
||||
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css"/>
|
||||
</h:head>
|
||||
|
||||
<h:body styleClass="landing-body">
|
||||
<div class="landing-wrapper">
|
||||
<!-- Header -->
|
||||
<div class="landing-topbar">
|
||||
<div class="landing-topbar-left">
|
||||
<h:link outcome="/index" styleClass="logo">
|
||||
<i class="pi pi-briefcase mr-2" style="font-size: 1.5rem; color: #5297FF;"></i>
|
||||
<span style="font-size: 1.5rem; font-weight: bold; color: #5297FF;">GBCM</span>
|
||||
</h:link>
|
||||
|
||||
<ul class="landing-menu">
|
||||
<li>
|
||||
<a href="#" id="landing-menu-close">
|
||||
<i class="pi pi-times"></i>
|
||||
</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="#home">Accueil</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="#features">Services</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="#pricing">Tarifs</a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
<div class="landing-topbar-right">
|
||||
<a href="pages/dashboard.xhtml" class="second-menubutton">Se Connecter</a>
|
||||
<p:linkButton type="button" outcome="/pages/dashboard" value="Commencer" styleClass="landing-button"/>
|
||||
<a href="#" id="landing-menu-button">
|
||||
<i class="pi pi-bars"></i>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Banner -->
|
||||
<div id="home" class="landing-banner">
|
||||
<div class="landing-banner-content">
|
||||
<span class="title">Transformez votre business avec l'IA.</span>
|
||||
<h3>Coaching stratégique bi-continental pour scale-ups et PME en croissance.<br/>
|
||||
De $500K à $50M+ avec nos méthodologies propriétaires™ et technologie IA</h3>
|
||||
<p:commandButton type="button" value="Voir nos programmes" styleClass="landing-button" onclick="document.getElementById('pricing').scrollIntoView({behavior: 'smooth'})"/>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Features -->
|
||||
<div id="features" class="landing-features">
|
||||
<div class="grid parallax-box">
|
||||
<div class="col-12 lg:col-3">
|
||||
<div class="feature yellow">
|
||||
<span>1</span>
|
||||
<div class="feature-card">
|
||||
<span>1</span>
|
||||
<div class="card-content">
|
||||
<h3>TRANSFORM Programs</h3>
|
||||
<h5>Programmes transformation 12 mois combinant coaching humain + technologie IA. De $8,997 à $59,997/an.</h5>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-12 lg:col-3">
|
||||
<div class="grid">
|
||||
<div class="col-12">
|
||||
<div class="feature blue">
|
||||
<span>2</span>
|
||||
<div class="feature-card">
|
||||
<span>2</span>
|
||||
<div class="card-content">
|
||||
<h3>ADVISORY Retainers</h3>
|
||||
<h5>Consulting stratégique ongoing pour scale-ups en transformation majeure. $7,500-$15,000/mois.</h5>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-12">
|
||||
<div class="feature gray">
|
||||
<span>3</span>
|
||||
<div class="feature-card">
|
||||
<span>3</span>
|
||||
<div class="card-content">
|
||||
<h3>ACCELERATOR<br/>Intensives</h3>
|
||||
<h5>Sprints 90 jours pour résultats rapides. $25,000 par intensive pour growth SMBs.</h5>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-12 lg:col-3 feature-4">
|
||||
<div class="col-12">
|
||||
<div class="feature darker-gray">
|
||||
<span>4</span>
|
||||
<div class="feature-card">
|
||||
<span>4</span>
|
||||
<div class="card-content">
|
||||
<h3>Bi-Continental</h3>
|
||||
<h5>Présence US + Afrique avec pricing PPP-adjusted pour marchés émergents. Expertise globale.</h5>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-12">
|
||||
<div class="feature darker-blue">
|
||||
<span>5</span>
|
||||
<div class="feature-card">
|
||||
<span>5</span>
|
||||
<div class="card-content">
|
||||
<h3>IA-Powered</h3>
|
||||
<h5>Plateforme digitale avec IA intégrée (Phase 2). Méthodologies propriétaires™ éprouvées sur 50+ entreprises.</h5>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="col-12 lg:col-3">
|
||||
<div class="feature gray">
|
||||
<span>6</span>
|
||||
<div class="feature-card">
|
||||
<span>6</span>
|
||||
<div class="card-content">
|
||||
<h3>PLATFORM Membership</h3>
|
||||
<h5>Self-serve subscription pour entrepreneurs et self-directed learners. $297/mois ou $2,970/an.</h5>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Pricing -->
|
||||
<div id="pricing" class="landing-pricing">
|
||||
<div class="section-header">
|
||||
<span class="title">Programmes TRANSFORM</span>
|
||||
<h3>Transformez votre business avec nos programmes coaching + IA. Pricing accessible vs $500K+ consulting firms.</h3>
|
||||
</div>
|
||||
<div class="grid">
|
||||
<div class="col-12 lg:col-4">
|
||||
<div class="pricing-card">
|
||||
<h2>Growth</h2>
|
||||
<span class="price">$8,997</span>
|
||||
<span class="time">par an</span>
|
||||
<ul>
|
||||
<li>Coaching mensuel 1:1</li>
|
||||
<li>Accès plateforme IA</li>
|
||||
<li>Frameworks propriétaires™</li>
|
||||
<li>Community peer support</li>
|
||||
<li>PME $500K-$2M revenue</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-12 lg:col-4 preferred">
|
||||
<div class="pricing-card pro">
|
||||
<span class="preferred-tag">LE PLUS POPULAIRE</span>
|
||||
<h2>Scale</h2>
|
||||
<span class="price">$23,997</span>
|
||||
<span class="time">par an</span>
|
||||
<ul>
|
||||
<li>Tout du Growth, plus :</li>
|
||||
<li>Coaching bi-mensuel</li>
|
||||
<li>Team coaching inclus</li>
|
||||
<li>Strategic planning sessions</li>
|
||||
<li>Scale-ups $2M-$10M revenue</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-12 lg:col-4">
|
||||
<div class="pricing-card enterprise">
|
||||
<h2>Transform</h2>
|
||||
<span class="price">$59,997</span>
|
||||
<span class="time">par an</span>
|
||||
<ul>
|
||||
<li>Tout du Scale, plus :</li>
|
||||
<li>Coaching hebdomadaire</li>
|
||||
<li>Transformation complète</li>
|
||||
<li>Executive team coaching</li>
|
||||
<li>Entreprises $10M+ revenue</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<a href="pages/dashboard.xhtml">Découvrir tous nos services</a>
|
||||
</div>
|
||||
|
||||
<!-- Footer -->
|
||||
<div class="layout-footer">
|
||||
<div class="grid">
|
||||
<div class="col-12 lg:col-4">
|
||||
<div class="grid">
|
||||
<div class="col-6">
|
||||
<span class="footer-menutitle">SERVICES</span>
|
||||
<ul>
|
||||
<li><a href="pages/dashboard.xhtml">Dashboard</a></li>
|
||||
<li><a href="pages/clients.xhtml">Gestion Clients</a></li>
|
||||
<li><a href="pages/coaching.xhtml">Coaching</a></li>
|
||||
<li><a href="pages/workshops.xhtml">Ateliers</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
<div class="col-6">
|
||||
<span class="footer-menutitle">PROGRAMMES</span>
|
||||
<ul>
|
||||
<li><a href="#pricing">TRANSFORM Programs</a></li>
|
||||
<li><a href="pages/analytics.xhtml">ADVISORY Retainers</a></li>
|
||||
<li><a href="#features">ACCELERATOR Intensives</a></li>
|
||||
<li><a href="#features">PLATFORM Membership</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-12 md:col-6 lg:col-3">
|
||||
<span class="footer-menutitle">CONTACT GBCM</span>
|
||||
<ul>
|
||||
<li>contact@gbcm-llc.com</li>
|
||||
<li>Présence bi-continentale :</li>
|
||||
<li>🇺🇸 États-Unis + 🌍 Afrique</li>
|
||||
</ul>
|
||||
</div>
|
||||
<div class="col-12 md:col-6 lg:col-5">
|
||||
<span class="footer-menutitle">NEWSLETTER BUSINESS</span>
|
||||
<span class="footer-subtitle">Recevez nos insights stratégiques et méthodologies propriétaires™ pour scale-ups.</span>
|
||||
<h:form>
|
||||
<div class="newsletter-input">
|
||||
<p:inputText placeholder="votre email professionnel"/>
|
||||
<p:commandButton value="S'abonner" styleClass="ui-button-secondary"/>
|
||||
</div>
|
||||
</h:form>
|
||||
</div>
|
||||
<div class="col-12">
|
||||
<div class="footer-bottom">
|
||||
<h4>GBCM</h4>
|
||||
<h6>Copyright © GBCM LLC</h6>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="landing-mask"></div>
|
||||
</div>
|
||||
|
||||
<!-- Scripts -->
|
||||
<h:outputScript name="js/layout.js" library="freya-layout"/>
|
||||
|
||||
<script>
|
||||
$(document).ready(function ($) {
|
||||
function parallax(){
|
||||
var scrolled = $(window).scrollTop();
|
||||
$('.landing-banner').css('top',-(scrolled*0.01)+'%');
|
||||
$('.landing-banner-content').css('top',+(scrolled*-0.065)+'%');
|
||||
$('.parallax-box .lg\\:col-3:odd').css('transform', 'translateY('+(scrolled * 0.01)+'%)');
|
||||
$('.parallax-box .lg\\:col-3:even').css('margin-top', -(scrolled * 0.01)+'%');
|
||||
};
|
||||
$(window).scroll(function(e){
|
||||
parallax();
|
||||
});
|
||||
|
||||
// Menu mobile
|
||||
$('#landing-menu-button').click(function(e) {
|
||||
e.preventDefault();
|
||||
showMenu();
|
||||
});
|
||||
|
||||
$('#landing-menu-close').click(function(e) {
|
||||
e.preventDefault();
|
||||
hideMenu();
|
||||
});
|
||||
|
||||
// Smooth scrolling pour les liens d'ancrage
|
||||
$('a[href^="#"]').click(function(e) {
|
||||
e.preventDefault();
|
||||
var target = $(this.getAttribute('href'));
|
||||
if (target.length) {
|
||||
$('html, body').animate({
|
||||
scrollTop: target.offset().top
|
||||
}, 1000);
|
||||
}
|
||||
});
|
||||
});
|
||||
|
||||
hideMenu = function () {
|
||||
$('.landing-menu').removeClass('fadeInDown').addClass('fadeOutUp');
|
||||
setTimeout(function () {
|
||||
$('.landing-wrapper').removeClass('landing-menu-active');
|
||||
$('.landing-menu').removeClass('fadeOutUp');
|
||||
$(document.body).removeClass('block-scroll');
|
||||
}, 150);
|
||||
}
|
||||
|
||||
showMenu = function () {
|
||||
$('.landing-wrapper').addClass('landing-menu-active');
|
||||
$('.landing-menu').addClass('fadeInDown');
|
||||
$(document.body).addClass('block-scroll');
|
||||
}
|
||||
$('.landing-menu').addClass('fadeInDown');
|
||||
$(document.body).addClass('block-scroll');
|
||||
}
|
||||
|
||||
$(function () {
|
||||
$('#landing-menu-button').on('click', function (e) {
|
||||
var wrapper = $('.landing-wrapper');
|
||||
if (wrapper.hasClass('landing-menu-active'))
|
||||
hideMenu();
|
||||
else
|
||||
showMenu();
|
||||
e.preventDefault();
|
||||
});
|
||||
|
||||
$('.landing-menu').find('a').on('click', function (e) {
|
||||
hideMenu();
|
||||
});
|
||||
});
|
||||
</script>
|
||||
</h:body>
|
||||
</html>
|
||||
153
src/main/resources/META-INF/resources/pages/clients.xhtml
Normal file
153
src/main/resources/META-INF/resources/pages/clients.xhtml
Normal file
@@ -0,0 +1,153 @@
|
||||
<ui:composition xmlns="http://www.w3.org/1999/xhtml" xmlns:h="http://java.sun.com/jsf/html"
|
||||
xmlns:f="http://java.sun.com/jsf/core" xmlns:ui="http://java.sun.com/jsf/facelets"
|
||||
xmlns:p="http://primefaces.org/ui" template="/WEB-INF/freya-templates/template.xhtml">
|
||||
<ui:define name="title">Gestion des Clients - GBCM</ui:define>
|
||||
|
||||
<ui:define name="content">
|
||||
<div class="grid">
|
||||
<div class="col-12">
|
||||
<div class="card">
|
||||
<div class="flex justify-content-between align-items-center mb-4">
|
||||
<h2 class="text-900 font-semibold text-xl m-0">
|
||||
<i class="pi pi-briefcase mr-2"></i>
|
||||
Gestion des Clients
|
||||
</h2>
|
||||
<p:commandButton value="Nouveau Client" icon="pi pi-plus" styleClass="p-button-success"
|
||||
disabled="true" title="Fonctionnalité à venir" />
|
||||
</div>
|
||||
|
||||
<!-- Filtres et recherche -->
|
||||
<div class="grid mb-4">
|
||||
<div class="col-12 md:col-4">
|
||||
<span class="p-input-icon-left w-full">
|
||||
<i class="pi pi-search"></i>
|
||||
<p:inputText placeholder="Rechercher un client..." styleClass="w-full"
|
||||
disabled="true" />
|
||||
</span>
|
||||
</div>
|
||||
<div class="col-12 md:col-3">
|
||||
<p:selectOneMenu value="" styleClass="w-full" disabled="true">
|
||||
<f:selectItem itemLabel="Tous les statuts" itemValue="" />
|
||||
<f:selectItem itemLabel="Actif" itemValue="ACTIVE" />
|
||||
<f:selectItem itemLabel="Inactif" itemValue="INACTIVE" />
|
||||
<f:selectItem itemLabel="Prospect" itemValue="PROSPECT" />
|
||||
</p:selectOneMenu>
|
||||
</div>
|
||||
<div class="col-12 md:col-3">
|
||||
<p:selectOneMenu value="" styleClass="w-full" disabled="true">
|
||||
<f:selectItem itemLabel="Tous les coachs" itemValue="" />
|
||||
<f:selectItem itemLabel="Coach A" itemValue="1" />
|
||||
<f:selectItem itemLabel="Coach B" itemValue="2" />
|
||||
</p:selectOneMenu>
|
||||
</div>
|
||||
<div class="col-12 md:col-2">
|
||||
<p:commandButton value="Filtrer" icon="pi pi-filter" styleClass="w-full" disabled="true" />
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Tableau des clients (Real Data) -->
|
||||
<p:dataTable value="#{clientBean.clients}" var="client" emptyMessage="Aucun client trouvé"
|
||||
paginator="true" rows="10" paginatorPosition="bottom" styleClass="p-datatable-gridlines">
|
||||
|
||||
<p:column headerText="Photo" width="80">
|
||||
<div
|
||||
style="width: 40px; height: 40px; border-radius: 50%; background: linear-gradient(135deg, #667eea, #764ba2); display: flex; align-items: center; justify-content: center; font-weight: bold; color: white;">
|
||||
#{client.user.initials}
|
||||
</div>
|
||||
</p:column>
|
||||
|
||||
<p:column headerText="Entreprise / Nom" sortBy="#{client.companyName}">
|
||||
<div class="font-bold">#{client.companyName}</div>
|
||||
<div class="text-xs text-500">#{client.user.fullName}</div>
|
||||
</p:column>
|
||||
|
||||
<p:column headerText="Email" sortBy="#{client.user.email}">
|
||||
<h:outputText value="#{client.user.email}" />
|
||||
</p:column>
|
||||
|
||||
<p:column headerText="Téléphone">
|
||||
<h:outputText value="#{client.user.phone}" />
|
||||
</p:column>
|
||||
|
||||
<p:column headerText="Service Principal">
|
||||
<h:outputText value="#{client.primaryServiceType}" />
|
||||
</p:column>
|
||||
|
||||
<p:column headerText="Statut" width="120">
|
||||
<p:badge value="#{client.status}"
|
||||
severity="#{client.status == 'ACTIVE' ? 'success' : 'warning'}" />
|
||||
</p:column>
|
||||
|
||||
<p:column headerText="Actions" width="150">
|
||||
<p:commandButton icon="pi pi-eye"
|
||||
styleClass="p-button-rounded p-button-text p-button-info mr-1" title="Voir le détail"
|
||||
disabled="true" />
|
||||
<p:commandButton icon="pi pi-pencil"
|
||||
styleClass="p-button-rounded p-button-text p-button-warning mr-1" title="Modifier"
|
||||
disabled="true" />
|
||||
<p:commandButton icon="pi pi-trash"
|
||||
styleClass="p-button-rounded p-button-text p-button-danger" title="Supprimer"
|
||||
disabled="true" />
|
||||
</p:column>
|
||||
</p:dataTable>
|
||||
|
||||
<!-- Message informatif -->
|
||||
<div class="mt-4 p-3 border-round"
|
||||
style="background: var(--blue-50); border: 1px solid var(--blue-200);">
|
||||
<div class="flex align-items-center">
|
||||
<i class="pi pi-info-circle text-blue-600 mr-2"></i>
|
||||
<span class="text-blue-800">
|
||||
<strong>Information :</strong> Cette page affiche une interface de démonstration.
|
||||
Les données réelles seront chargées depuis l'API backend une fois la fonctionnalité
|
||||
implémentée.
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Statistiques rapides -->
|
||||
<div class="col-12">
|
||||
<div class="grid">
|
||||
<div class="col-12 md:col-3">
|
||||
<div class="card text-center">
|
||||
<div class="text-blue-600 font-bold text-xl mb-2">
|
||||
<i class="pi pi-users text-4xl mb-3"></i>
|
||||
<div>0</div>
|
||||
</div>
|
||||
<div class="text-600">Total Clients</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-12 md:col-3">
|
||||
<div class="card text-center">
|
||||
<div class="text-green-600 font-bold text-xl mb-2">
|
||||
<i class="pi pi-check-circle text-4xl mb-3"></i>
|
||||
<div>0</div>
|
||||
</div>
|
||||
<div class="text-600">Clients Actifs</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-12 md:col-3">
|
||||
<div class="card text-center">
|
||||
<div class="text-orange-600 font-bold text-xl mb-2">
|
||||
<i class="pi pi-eye text-4xl mb-3"></i>
|
||||
<div>0</div>
|
||||
</div>
|
||||
<div class="text-600">Prospects</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-12 md:col-3">
|
||||
<div class="card text-center">
|
||||
<div class="text-purple-600 font-bold text-xl mb-2">
|
||||
<i class="pi pi-calendar text-4xl mb-3"></i>
|
||||
<div>0</div>
|
||||
</div>
|
||||
<div class="text-600">Sessions ce mois</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</ui:define>
|
||||
|
||||
</ui:composition>
|
||||
@@ -0,0 +1,30 @@
|
||||
<ui:composition xmlns="http://www.w3.org/1999/xhtml"
|
||||
xmlns:h="http://java.sun.com/jsf/html"
|
||||
xmlns:f="http://java.sun.com/jsf/core"
|
||||
xmlns:ui="http://java.sun.com/jsf/facelets"
|
||||
xmlns:p="http://primefaces.org/ui"
|
||||
template="/WEB-INF/freya-templates/template.xhtml">
|
||||
|
||||
<ui:define name="title">
|
||||
Ajouter un Client - GBCM
|
||||
</ui:define>
|
||||
|
||||
<ui:define name="content">
|
||||
<div class="grid">
|
||||
<div class="col-12">
|
||||
<div class="card">
|
||||
<h5>Ajouter un Nouveau Client</h5>
|
||||
<p class="text-600 line-height-3 m-0">
|
||||
Cette fonctionnalité sera bientôt disponible. Vous pourrez ajouter de nouveaux clients à votre portefeuille.
|
||||
</p>
|
||||
|
||||
<div class="mt-4">
|
||||
<p:button value="Retour à la Liste" icon="pi pi-arrow-left" styleClass="ui-button-secondary"
|
||||
outcome="/pages/clients/list" />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</ui:define>
|
||||
|
||||
</ui:composition>
|
||||
111
src/main/resources/META-INF/resources/pages/clients/edit.xhtml
Normal file
111
src/main/resources/META-INF/resources/pages/clients/edit.xhtml
Normal file
@@ -0,0 +1,111 @@
|
||||
<ui:composition xmlns="http://www.w3.org/1999/xhtml"
|
||||
xmlns:h="http://java.sun.com/jsf/html"
|
||||
xmlns:f="http://java.sun.com/jsf/core"
|
||||
xmlns:ui="http://java.sun.com/jsf/facelets"
|
||||
xmlns:p="http://primefaces.org/ui"
|
||||
template="/WEB-INF/freya-templates/template.xhtml">
|
||||
|
||||
<ui:define name="content">
|
||||
<div class="grid">
|
||||
<div class="col-12">
|
||||
<div class="card">
|
||||
<div class="flex align-items-center justify-content-between mb-4">
|
||||
<h5>Modifier le Client</h5>
|
||||
<div>
|
||||
<p:button value="Retour à la liste" icon="pi pi-arrow-left"
|
||||
styleClass="ui-button-secondary" outcome="/pages/clients/list" />
|
||||
<p:button value="Voir" icon="pi pi-eye"
|
||||
styleClass="ui-button-info" style="margin-left: 10px;"
|
||||
outcome="/pages/clients/view?id=#{param.id}" />
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<h:form id="clientForm">
|
||||
<div class="grid">
|
||||
<div class="col-12 md:col-6">
|
||||
<div class="card">
|
||||
<h6>Informations Personnelles</h6>
|
||||
<div class="grid">
|
||||
<div class="col-12 md:col-6">
|
||||
<label for="clientId" class="block text-900 font-medium mb-2">ID Client</label>
|
||||
<p:inputText id="clientId" value="#{param.id}" readonly="true"
|
||||
styleClass="w-full" disabled="true" />
|
||||
</div>
|
||||
<div class="col-12 md:col-6">
|
||||
<label for="status" class="block text-900 font-medium mb-2">Statut</label>
|
||||
<p:selectOneMenu id="status" value="ACTIF" styleClass="w-full">
|
||||
<f:selectItem itemLabel="Actif" itemValue="ACTIF" />
|
||||
<f:selectItem itemLabel="Inactif" itemValue="INACTIF" />
|
||||
<f:selectItem itemLabel="Prospect" itemValue="PROSPECT" />
|
||||
</p:selectOneMenu>
|
||||
</div>
|
||||
<div class="col-12 md:col-6">
|
||||
<label for="lastName" class="block text-900 font-medium mb-2">Nom *</label>
|
||||
<p:inputText id="lastName" value="Dupont" required="true"
|
||||
styleClass="w-full" />
|
||||
<p:message for="lastName" />
|
||||
</div>
|
||||
<div class="col-12 md:col-6">
|
||||
<label for="firstName" class="block text-900 font-medium mb-2">Prénom *</label>
|
||||
<p:inputText id="firstName" value="Jean" required="true"
|
||||
styleClass="w-full" />
|
||||
<p:message for="firstName" />
|
||||
</div>
|
||||
<div class="col-12">
|
||||
<label for="email" class="block text-900 font-medium mb-2">Email *</label>
|
||||
<p:inputText id="email" value="jean.dupont@example.com" required="true"
|
||||
styleClass="w-full" />
|
||||
<p:message for="email" />
|
||||
</div>
|
||||
<div class="col-12">
|
||||
<label for="phone" class="block text-900 font-medium mb-2">Téléphone</label>
|
||||
<p:inputText id="phone" value="01.23.45.67.89"
|
||||
styleClass="w-full" />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="col-12 md:col-6">
|
||||
<div class="card">
|
||||
<h6>Informations Complémentaires</h6>
|
||||
<div class="grid">
|
||||
<div class="col-12">
|
||||
<label for="company" class="block text-900 font-medium mb-2">Entreprise</label>
|
||||
<p:inputText id="company" value="ACME Corp"
|
||||
styleClass="w-full" />
|
||||
</div>
|
||||
<div class="col-12">
|
||||
<label for="position" class="block text-900 font-medium mb-2">Poste</label>
|
||||
<p:inputText id="position" value="Directeur Général"
|
||||
styleClass="w-full" />
|
||||
</div>
|
||||
<div class="col-12">
|
||||
<label for="address" class="block text-900 font-medium mb-2">Adresse</label>
|
||||
<p:inputTextarea id="address" rows="3" styleClass="w-full"
|
||||
value="123 Rue de la Paix 75001 Paris France" />
|
||||
</div>
|
||||
<div class="col-12">
|
||||
<label for="notes" class="block text-900 font-medium mb-2">Notes</label>
|
||||
<p:inputTextarea id="notes" rows="4" styleClass="w-full"
|
||||
value="Client régulier depuis 2023. Très satisfait des services proposés." />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="flex justify-content-end mt-4">
|
||||
<p:button value="Annuler" icon="pi pi-times"
|
||||
styleClass="ui-button-secondary" outcome="/pages/clients/list" />
|
||||
<p:commandButton value="Enregistrer" icon="pi pi-check"
|
||||
styleClass="ui-button-success" style="margin-left: 10px;"
|
||||
action="#{clientBean.saveClient}"
|
||||
update="clientForm" />
|
||||
</div>
|
||||
</h:form>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</ui:define>
|
||||
</ui:composition>
|
||||
198
src/main/resources/META-INF/resources/pages/clients/list.xhtml
Normal file
198
src/main/resources/META-INF/resources/pages/clients/list.xhtml
Normal file
@@ -0,0 +1,198 @@
|
||||
<ui:composition xmlns="http://www.w3.org/1999/xhtml"
|
||||
xmlns:h="http://java.sun.com/jsf/html"
|
||||
xmlns:f="http://java.sun.com/jsf/core"
|
||||
xmlns:ui="http://java.sun.com/jsf/facelets"
|
||||
xmlns:p="http://primefaces.org/ui"
|
||||
xmlns:po="http://primefaces.org/freya"
|
||||
template="/WEB-INF/freya-templates/template.xhtml">
|
||||
|
||||
<ui:define name="title">
|
||||
Clients GBCM - Portfolio Management
|
||||
</ui:define>
|
||||
|
||||
|
||||
|
||||
<ui:define name="content">
|
||||
<!-- Header Section -->
|
||||
<div class="grid">
|
||||
<div class="col-12">
|
||||
<div class="card bg-primary text-white">
|
||||
<div class="flex align-items-center justify-content-between">
|
||||
<div>
|
||||
<h2 class="m-0 text-white">Portfolio Clients</h2>
|
||||
<p class="m-0 mt-2 text-white opacity-90">Gestion bi-continentale</p>
|
||||
</div>
|
||||
<div class="flex gap-4">
|
||||
<div class="text-center">
|
||||
<div class="text-2xl font-bold text-white">28</div>
|
||||
<div class="text-sm text-white opacity-90">Actifs</div>
|
||||
</div>
|
||||
<div class="text-center">
|
||||
<div class="text-2xl font-bold text-white">$165K</div>
|
||||
<div class="text-sm text-white opacity-90">ARR</div>
|
||||
</div>
|
||||
<div class="text-center">
|
||||
<div class="text-2xl font-bold text-white">18/10</div>
|
||||
<div class="text-sm text-white opacity-90">US/Afrique</div>
|
||||
</div>
|
||||
<div class="text-center">
|
||||
<div class="text-2xl font-bold text-white">68</div>
|
||||
<div class="text-sm text-white opacity-90">NPS</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Filters and Search -->
|
||||
<div class="grid">
|
||||
<div class="col-12">
|
||||
<div class="card bg-gray-50">
|
||||
<div class="grid align-items-end">
|
||||
<div class="col-12 md:col-4">
|
||||
<label for="searchInput" class="block text-900 font-medium mb-2">Recherche</label>
|
||||
<p:inputText id="searchInput" placeholder="Nom, prénom, email..."
|
||||
styleClass="w-full" />
|
||||
</div>
|
||||
<div class="col-12 md:col-3">
|
||||
<label for="statusFilter" class="block text-900 font-medium mb-2">Statut</label>
|
||||
<p:selectOneMenu id="statusFilter" styleClass="w-full">
|
||||
<f:selectItem itemLabel="Tous les statuts" itemValue="" />
|
||||
<f:selectItem itemLabel="Actif" itemValue="ACTIF" />
|
||||
<f:selectItem itemLabel="Prospect" itemValue="PROSPECT" />
|
||||
<f:selectItem itemLabel="Inactif" itemValue="INACTIF" />
|
||||
</p:selectOneMenu>
|
||||
</div>
|
||||
<div class="col-12 md:col-5">
|
||||
<div class="flex gap-2">
|
||||
<p:commandButton value="Filtrer" icon="pi pi-search"
|
||||
styleClass="ui-button-primary" />
|
||||
<p:commandButton value="Reset" icon="pi pi-refresh"
|
||||
styleClass="ui-button-outlined" />
|
||||
<p:commandButton value="Nouveau Client" icon="pi pi-plus"
|
||||
styleClass="ui-button-success"
|
||||
outcome="/pages/clients/add" />
|
||||
<p:commandButton value="Exporter" icon="pi pi-download"
|
||||
styleClass="ui-button-help" />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- Clients Table -->
|
||||
<div class="grid">
|
||||
<div class="col-12">
|
||||
<div class="card">
|
||||
<div class="flex align-items-center justify-content-between mb-4">
|
||||
<h5 class="m-0">Liste des Clients</h5>
|
||||
<div class="flex gap-2">
|
||||
<p:commandButton value="Exporter" icon="pi pi-download"
|
||||
styleClass="ui-button-outlined" />
|
||||
<p:commandButton value="Importer" icon="pi pi-upload"
|
||||
styleClass="ui-button-outlined" />
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<p:dataTable var="client" value="#{clientBean.clients}"
|
||||
paginator="true" rows="15"
|
||||
paginatorTemplate="{CurrentPageReport} {FirstPageLink} {PreviousPageLink} {PageLinks} {NextPageLink} {LastPageLink} {RowsPerPageDropdown}"
|
||||
currentPageReportTemplate="{startRecord}-{endRecord} de {totalRecords}"
|
||||
rowsPerPageTemplate="10,15,25,50"
|
||||
sortMode="multiple"
|
||||
emptyMessage="Aucun client trouvé"
|
||||
styleClass="p-datatable-gridlines">
|
||||
|
||||
<p:column headerText="ID" sortBy="#{client.id}">
|
||||
<h:outputText value="#{client.id}" />
|
||||
</p:column>
|
||||
|
||||
<p:column headerText="Entreprise" sortBy="#{client.companyName}">
|
||||
<h:outputText value="#{client.companyName}" />
|
||||
</p:column>
|
||||
|
||||
<p:column headerText="Contact" sortBy="#{client.user.email}">
|
||||
<div>
|
||||
<div class="text-900">#{client.user.firstName} #{client.user.lastName}</div>
|
||||
<div class="text-600 text-sm">#{client.user.email}</div>
|
||||
</div>
|
||||
</p:column>
|
||||
|
||||
<p:column headerText="Secteur" sortBy="#{client.industry}">
|
||||
<h:outputText value="#{client.industry}" />
|
||||
</p:column>
|
||||
|
||||
<p:column headerText="Taille" sortBy="#{client.companySize}">
|
||||
<h:outputText value="#{client.companySize} employés" />
|
||||
</p:column>
|
||||
|
||||
<p:column headerText="Statut" sortBy="#{client.status}">
|
||||
<p:tag value="#{client.status}"
|
||||
severity="#{client.status eq 'ACTIVE' ? 'success' : (client.status eq 'PROSPECT' ? 'warning' : 'danger')}" />
|
||||
</p:column>
|
||||
|
||||
<p:column headerText="Actions" exportable="false">
|
||||
<p:button value="Voir" icon="pi pi-eye" styleClass="ui-button-info ui-button-sm"
|
||||
outcome="/pages/clients/view?id=#{client.id}" />
|
||||
<p:button value="Modifier" icon="pi pi-pencil" styleClass="ui-button-warning ui-button-sm"
|
||||
outcome="/pages/clients/edit?id=#{client.id}" style="margin-left: 5px;" />
|
||||
</p:column>
|
||||
|
||||
</p:dataTable>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Quick Actions -->
|
||||
<div class="grid">
|
||||
<div class="col-12 md:col-6">
|
||||
<div class="card">
|
||||
<h6 class="mb-3">Actions Rapides</h6>
|
||||
<div class="flex flex-column gap-2">
|
||||
<p:commandButton value="Nouveau Client" icon="pi pi-plus"
|
||||
styleClass="ui-button-success w-full justify-content-start"
|
||||
outcome="/pages/clients/add" />
|
||||
<p:commandButton value="Importer Prospects" icon="pi pi-upload"
|
||||
styleClass="ui-button-secondary w-full justify-content-start" />
|
||||
<p:commandButton value="Rapport Mensuel" icon="pi pi-chart-bar"
|
||||
styleClass="ui-button-info w-full justify-content-start" />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="col-12 md:col-6">
|
||||
<div class="card">
|
||||
<h6 class="mb-3">Métriques Rapides</h6>
|
||||
<div class="grid">
|
||||
<div class="col-6">
|
||||
<div class="text-center">
|
||||
<div class="text-2xl font-bold text-blue-500">7</div>
|
||||
<div class="text-600 text-sm">TRANSFORM</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-6">
|
||||
<div class="text-center">
|
||||
<div class="text-2xl font-bold text-purple-500">3</div>
|
||||
<div class="text-600 text-sm">ADVISORY</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-6">
|
||||
<div class="text-center">
|
||||
<div class="text-2xl font-bold text-orange-500">1</div>
|
||||
<div class="text-600 text-sm">ACCELERATOR</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-6">
|
||||
<div class="text-center">
|
||||
<div class="text-2xl font-bold text-green-500">17</div>
|
||||
<div class="text-600 text-sm">PLATFORM</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</ui:define>
|
||||
|
||||
</ui:composition>
|
||||
@@ -0,0 +1,30 @@
|
||||
<ui:composition xmlns="http://www.w3.org/1999/xhtml"
|
||||
xmlns:h="http://java.sun.com/jsf/html"
|
||||
xmlns:f="http://java.sun.com/jsf/core"
|
||||
xmlns:ui="http://java.sun.com/jsf/facelets"
|
||||
xmlns:p="http://primefaces.org/ui"
|
||||
template="/WEB-INF/freya-templates/template.xhtml">
|
||||
|
||||
<ui:define name="title">
|
||||
Rechercher des Clients - GBCM
|
||||
</ui:define>
|
||||
|
||||
<ui:define name="content">
|
||||
<div class="grid">
|
||||
<div class="col-12">
|
||||
<div class="card">
|
||||
<h5>Recherche Avancée de Clients</h5>
|
||||
<p class="text-600 line-height-3 m-0">
|
||||
Cette fonctionnalité sera bientôt disponible. Vous pourrez effectuer des recherches avancées dans votre base de clients.
|
||||
</p>
|
||||
|
||||
<div class="mt-4">
|
||||
<p:button value="Retour à la Liste" icon="pi pi-arrow-left" styleClass="ui-button-secondary"
|
||||
outcome="/pages/clients/list" />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</ui:define>
|
||||
|
||||
</ui:composition>
|
||||
124
src/main/resources/META-INF/resources/pages/clients/view.xhtml
Normal file
124
src/main/resources/META-INF/resources/pages/clients/view.xhtml
Normal file
@@ -0,0 +1,124 @@
|
||||
<ui:composition xmlns="http://www.w3.org/1999/xhtml"
|
||||
xmlns:h="http://java.sun.com/jsf/html"
|
||||
xmlns:f="http://java.sun.com/jsf/core"
|
||||
xmlns:ui="http://java.sun.com/jsf/facelets"
|
||||
xmlns:p="http://primefaces.org/ui"
|
||||
template="/WEB-INF/freya-templates/template.xhtml">
|
||||
|
||||
<ui:define name="content">
|
||||
<div class="grid">
|
||||
<div class="col-12">
|
||||
<div class="card">
|
||||
<div class="flex align-items-center justify-content-between mb-4">
|
||||
<h5>Détails du Client</h5>
|
||||
<div>
|
||||
<p:button value="Retour à la liste" icon="pi pi-arrow-left"
|
||||
styleClass="ui-button-secondary" outcome="/pages/clients/list" />
|
||||
<p:button value="Modifier" icon="pi pi-pencil"
|
||||
styleClass="ui-button-warning" style="margin-left: 10px;"
|
||||
outcome="/pages/clients/edit?id=#{param.id}" />
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="grid">
|
||||
<div class="col-12 md:col-6">
|
||||
<div class="card">
|
||||
<h6>Informations Personnelles</h6>
|
||||
<div class="grid">
|
||||
<div class="col-12 md:col-6">
|
||||
<label class="block text-900 font-medium mb-2">ID Client</label>
|
||||
<h:outputText value="#{param.id}" styleClass="text-900 font-bold" />
|
||||
</div>
|
||||
<div class="col-12 md:col-6">
|
||||
<label class="block text-900 font-medium mb-2">Statut</label>
|
||||
<p:tag value="ACTIF" severity="success" />
|
||||
</div>
|
||||
<div class="col-12 md:col-6">
|
||||
<label class="block text-900 font-medium mb-2">Nom</label>
|
||||
<h:outputText value="Dupont" styleClass="text-900" />
|
||||
</div>
|
||||
<div class="col-12 md:col-6">
|
||||
<label class="block text-900 font-medium mb-2">Prénom</label>
|
||||
<h:outputText value="Jean" styleClass="text-900" />
|
||||
</div>
|
||||
<div class="col-12">
|
||||
<label class="block text-900 font-medium mb-2">Email</label>
|
||||
<h:outputText value="jean.dupont@example.com" styleClass="text-900" />
|
||||
</div>
|
||||
<div class="col-12">
|
||||
<label class="block text-900 font-medium mb-2">Téléphone</label>
|
||||
<h:outputText value="01.23.45.67.89" styleClass="text-900" />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="col-12 md:col-6">
|
||||
<div class="card">
|
||||
<h6>Informations Complémentaires</h6>
|
||||
<div class="grid">
|
||||
<div class="col-12">
|
||||
<label class="block text-900 font-medium mb-2">Date de création</label>
|
||||
<h:outputText value="#{clientBean.currentDate}" styleClass="text-900">
|
||||
<f:convertDateTime pattern="dd/MM/yyyy HH:mm" />
|
||||
</h:outputText>
|
||||
</div>
|
||||
<div class="col-12">
|
||||
<label class="block text-900 font-medium mb-2">Dernière modification</label>
|
||||
<h:outputText value="#{clientBean.currentDate}" styleClass="text-900">
|
||||
<f:convertDateTime pattern="dd/MM/yyyy HH:mm" />
|
||||
</h:outputText>
|
||||
</div>
|
||||
<div class="col-12">
|
||||
<label class="block text-900 font-medium mb-2">Notes</label>
|
||||
<p class="text-900 line-height-3">
|
||||
Client régulier depuis 2023. Très satisfait des services proposés.
|
||||
Recommande régulièrement nos services à ses contacts.
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="grid">
|
||||
<div class="col-12">
|
||||
<div class="card">
|
||||
<h6>Historique des Interactions</h6>
|
||||
<p:dataTable var="interaction" value="#{clientBean.clientInteractions}"
|
||||
paginator="true" rows="5" styleClass="p-datatable-sm">
|
||||
<p:column headerText="Date">
|
||||
<h:outputText value="#{interaction.date}">
|
||||
<f:convertDateTime pattern="dd/MM/yyyy" />
|
||||
</h:outputText>
|
||||
</p:column>
|
||||
<p:column headerText="Type">
|
||||
<h:outputText value="#{interaction.type}" />
|
||||
</p:column>
|
||||
<p:column headerText="Description">
|
||||
<h:outputText value="#{interaction.description}" />
|
||||
</p:column>
|
||||
<p:column headerText="Statut">
|
||||
<p:tag value="#{interaction.status}"
|
||||
severity="#{interaction.status eq 'TERMINÉ' ? 'success' : 'info'}" />
|
||||
</p:column>
|
||||
</p:dataTable>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="flex justify-content-end mt-4">
|
||||
<p:button value="Retour à la liste" icon="pi pi-arrow-left"
|
||||
styleClass="ui-button-secondary" outcome="/pages/clients/list" />
|
||||
<p:button value="Modifier" icon="pi pi-pencil"
|
||||
styleClass="ui-button-warning" style="margin-left: 10px;"
|
||||
outcome="/pages/clients/edit?id=#{param.id}" />
|
||||
<p:button value="Supprimer" icon="pi pi-trash"
|
||||
styleClass="ui-button-danger" style="margin-left: 10px;"
|
||||
onclick="return confirm('Êtes-vous sûr de vouloir supprimer ce client ?');" />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</ui:define>
|
||||
</ui:composition>
|
||||
68
src/main/resources/META-INF/resources/pages/coaches.xhtml
Normal file
68
src/main/resources/META-INF/resources/pages/coaches.xhtml
Normal file
@@ -0,0 +1,68 @@
|
||||
<ui:composition xmlns="http://www.w3.org/1999/xhtml" xmlns:h="http://java.sun.com/jsf/html"
|
||||
xmlns:f="http://java.sun.com/jsf/core" xmlns:ui="http://java.sun.com/jsf/facelets"
|
||||
xmlns:p="http://primefaces.org/ui" template="/WEB-INF/freya-templates/template.xhtml">
|
||||
<ui:define name="title">Gestion des Coachs - GBCM</ui:define>
|
||||
|
||||
<ui:define name="content">
|
||||
<div class="grid">
|
||||
<div class="col-12">
|
||||
<div class="card">
|
||||
<div class="flex justify-content-between align-items-center mb-4">
|
||||
<h2 class="text-900 font-semibold text-xl m-0">
|
||||
<i class="pi pi-user mr-2"></i>
|
||||
Gestion des Coachs
|
||||
</h2>
|
||||
<p:commandButton value="Nouveau Coach" icon="pi pi-plus" styleClass="p-button-success"
|
||||
disabled="true" title="Fonctionnalité à venir" />
|
||||
</div>
|
||||
|
||||
<!-- Tableau des coachs (Real Data) -->
|
||||
<p:dataTable value="#{coachBean.coaches}" var="coach" emptyMessage="Aucun coach trouvé"
|
||||
paginator="true" rows="10" paginatorPosition="bottom" styleClass="p-datatable-gridlines">
|
||||
|
||||
<p:column headerText="Photo" width="80">
|
||||
<div
|
||||
style="width: 40px; height: 40px; border-radius: 50%; background: linear-gradient(135deg, #FF6B6B, #556270); display: flex; align-items: center; justify-content: center; font-weight: bold; color: white;">
|
||||
#{coach.user.initials}
|
||||
</div>
|
||||
</p:column>
|
||||
|
||||
<p:column headerText="Coach" sortBy="#{coach.user.firstName}">
|
||||
<div class="font-bold">#{coach.user.fullName}</div>
|
||||
<div class="text-xs text-500">#{coach.specialization}</div>
|
||||
</p:column>
|
||||
|
||||
<p:column headerText="Email" sortBy="#{coach.user.email}">
|
||||
<h:outputText value="#{coach.user.email}" />
|
||||
</p:column>
|
||||
|
||||
<p:column headerText="Taux Horaire" sortBy="#{coach.hourlyRate}">
|
||||
<h:outputText value="#{coach.hourlyRate}">
|
||||
<f:convertNumber type="currency" currencySymbol="$" />
|
||||
</h:outputText>
|
||||
</p:column>
|
||||
|
||||
<p:column headerText="Statut" width="120">
|
||||
<p:badge value="#{coach.status}"
|
||||
severity="#{coach.status == 'ACTIVE' ? 'success' : 'danger'}" />
|
||||
</p:column>
|
||||
|
||||
<p:column headerText="Disponibilité" width="120">
|
||||
<i
|
||||
class="pi #{coach.availableForBooking ? 'pi-check-circle text-green-500' : 'pi-times-circle text-red-500'}"></i>
|
||||
<span class="ml-2">#{coach.availableForBooking ? 'Dispo' : 'Indispo'}</span>
|
||||
</p:column>
|
||||
|
||||
<p:column headerText="Actions" width="150">
|
||||
<p:commandButton icon="pi pi-eye"
|
||||
styleClass="p-button-rounded p-button-text p-button-info mr-1" title="Voir le détail" />
|
||||
<p:commandButton icon="pi pi-pencil"
|
||||
styleClass="p-button-rounded p-button-text p-button-warning mr-1" title="Modifier" />
|
||||
</p:column>
|
||||
</p:dataTable>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</ui:define>
|
||||
|
||||
</ui:composition>
|
||||
@@ -0,0 +1,31 @@
|
||||
<ui:composition xmlns="http://www.w3.org/1999/xhtml"
|
||||
xmlns:h="http://java.sun.com/jsf/html"
|
||||
xmlns:f="http://java.sun.com/jsf/core"
|
||||
xmlns:ui="http://java.sun.com/jsf/facelets"
|
||||
xmlns:p="http://primefaces.org/ui"
|
||||
template="/WEB-INF/freya-templates/template.xhtml">
|
||||
|
||||
<ui:define name="title">
|
||||
Liste des Coaches - GBCM
|
||||
</ui:define>
|
||||
|
||||
<ui:define name="content">
|
||||
<div class="grid">
|
||||
<div class="col-12">
|
||||
<div class="card">
|
||||
<h5>Liste des Coaches</h5>
|
||||
<p class="text-600 line-height-3 m-0">
|
||||
Cette section affichera la liste de tous les coaches disponibles sur la plateforme GBCM.
|
||||
Fonctionnalité en cours de développement.
|
||||
</p>
|
||||
|
||||
<div class="mt-4">
|
||||
<p:button value="Retour au Dashboard" icon="pi pi-arrow-left" styleClass="ui-button-secondary"
|
||||
outcome="/pages/dashboard" />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</ui:define>
|
||||
|
||||
</ui:composition>
|
||||
763
src/main/resources/META-INF/resources/pages/dashboard.xhtml
Normal file
763
src/main/resources/META-INF/resources/pages/dashboard.xhtml
Normal file
@@ -0,0 +1,763 @@
|
||||
<ui:composition xmlns="http://www.w3.org/1999/xhtml"
|
||||
xmlns:h="http://java.sun.com/jsf/html"
|
||||
xmlns:f="http://java.sun.com/jsf/core"
|
||||
xmlns:ui="http://java.sun.com/jsf/facelets"
|
||||
xmlns:p="http://primefaces.org/ui"
|
||||
xmlns:po="http://primefaces.org/freya"
|
||||
template="/WEB-INF/freya-templates/template.xhtml">
|
||||
|
||||
<ui:define name="title">
|
||||
Dashboard GBCM - Business Intelligence
|
||||
</ui:define>
|
||||
|
||||
<ui:define name="head">
|
||||
<h:outputScript name="chartjs/chart.js" library="demo" />
|
||||
<style>
|
||||
/* Dashboard Symmetry Improvements */
|
||||
.dashboard-section {
|
||||
margin-bottom: 2rem;
|
||||
}
|
||||
|
||||
.card {
|
||||
height: 100%;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
overflow: hidden; /* Prevent content overflow */
|
||||
}
|
||||
|
||||
.card-content {
|
||||
flex: 1;
|
||||
padding: 1rem;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
/* Ensure equal heights for symmetric sections */
|
||||
.symmetric-row {
|
||||
display: flex;
|
||||
align-items: stretch;
|
||||
}
|
||||
|
||||
.symmetric-row .card {
|
||||
min-height: 380px;
|
||||
max-height: 450px; /* Prevent excessive height */
|
||||
}
|
||||
|
||||
/* Chart container fixes */
|
||||
.card.chart .card-content {
|
||||
padding: 0.5rem;
|
||||
}
|
||||
|
||||
.card.chart canvas {
|
||||
max-height: 220px !important;
|
||||
width: 100% !important;
|
||||
}
|
||||
|
||||
/* Statistics cards uniform styling */
|
||||
.statistics .statistic-item {
|
||||
padding: 0.75rem;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.statistics .item-title {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
gap: 0.5rem;
|
||||
margin-bottom: 0.5rem;
|
||||
}
|
||||
|
||||
.statistics .item-title span {
|
||||
font-size: 1.5rem;
|
||||
}
|
||||
|
||||
.statistics .item-title h5 {
|
||||
margin: 0;
|
||||
font-size: 1.8rem;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
/* Progress bars styling */
|
||||
.progress {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
margin-bottom: 1rem;
|
||||
padding: 0.75rem;
|
||||
background: rgba(0,0,0,0.02);
|
||||
border-radius: 6px;
|
||||
}
|
||||
|
||||
.progress span:first-child {
|
||||
font-size: 0.75rem;
|
||||
font-weight: 600;
|
||||
color: #6c757d;
|
||||
margin-bottom: 0.5rem;
|
||||
text-transform: uppercase;
|
||||
letter-spacing: 0.5px;
|
||||
}
|
||||
|
||||
.progress .ui-progressbar {
|
||||
width: 100%;
|
||||
height: 6px !important;
|
||||
margin-bottom: 0.5rem;
|
||||
border-radius: 3px;
|
||||
}
|
||||
|
||||
.progress span:last-child {
|
||||
font-size: 0.875rem;
|
||||
font-weight: 700;
|
||||
color: #495057;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
/* Activity feed styling */
|
||||
.card.activity ul {
|
||||
max-height: 280px;
|
||||
overflow-y: auto;
|
||||
padding-right: 0.5rem;
|
||||
}
|
||||
|
||||
.card.activity li {
|
||||
margin-bottom: 0.75rem;
|
||||
padding-bottom: 0.75rem;
|
||||
}
|
||||
|
||||
/* Device status improvements */
|
||||
.card.device-status .content {
|
||||
font-size: 0.875rem;
|
||||
margin-bottom: 1rem;
|
||||
line-height: 1.4;
|
||||
}
|
||||
</style>
|
||||
<script>
|
||||
//<![CDATA[
|
||||
$(function(){
|
||||
// Chart ARR Evolution
|
||||
var ctx1 = document.getElementById("arrChart").getContext('2d');
|
||||
var style = getComputedStyle(document.body);
|
||||
var primCol = style.getPropertyValue('--primary-color') || '#5297FF';
|
||||
var primLighterCol = style.getPropertyValue('--primary-lighter-color') || 'rgba(82, 151, 255, 0.2)';
|
||||
|
||||
new Chart(ctx1, {
|
||||
type: 'line',
|
||||
data: {
|
||||
labels: ['Jan', 'Fév', 'Mar', 'Avr', 'Mai', 'Jun', 'Jul', 'Aoû', 'Sep', 'Oct'],
|
||||
datasets: [{
|
||||
label: 'ARR ($K)',
|
||||
data: [0, 15, 32, 48, 67, 89, 112, 138, 165, 180],
|
||||
borderColor: primCol,
|
||||
borderWidth: 3,
|
||||
fill: true,
|
||||
backgroundColor: primLighterCol,
|
||||
tension: 0.4,
|
||||
pointRadius: 4,
|
||||
pointHoverRadius: 6
|
||||
}]
|
||||
},
|
||||
options: {
|
||||
responsive: true,
|
||||
maintainAspectRatio: false,
|
||||
legend: { display: false },
|
||||
layout: {
|
||||
padding: {
|
||||
top: 10,
|
||||
right: 10,
|
||||
bottom: 10,
|
||||
left: 10
|
||||
}
|
||||
},
|
||||
scales: {
|
||||
xAxes: [{
|
||||
gridLines: { color: 'transparent' },
|
||||
ticks: {
|
||||
fontColor: '#BFC2C6',
|
||||
fontSize: 11
|
||||
}
|
||||
}],
|
||||
yAxes: [{
|
||||
gridLines: {
|
||||
color: 'rgba(191, 194, 198, .45)',
|
||||
borderDash: [5, 10]
|
||||
},
|
||||
ticks: {
|
||||
fontColor: '#BFC2C6',
|
||||
min: 0,
|
||||
fontSize: 11,
|
||||
maxTicksLimit: 6
|
||||
}
|
||||
}]
|
||||
}
|
||||
}
|
||||
});
|
||||
});
|
||||
//]]>
|
||||
</script>
|
||||
</ui:define>
|
||||
|
||||
<ui:define name="content">
|
||||
<div class="grid">
|
||||
<!-- Section 1: North Star Metrics - Tier 1 KPIs (Symétrique 4 colonnes) -->
|
||||
<div class="col-12 dashboard-section">
|
||||
<div class="grid symmetric-row">
|
||||
<div class="col-12 lg:col-3">
|
||||
<div class="card statistics">
|
||||
<div class="card-header">
|
||||
<div class="card-title">
|
||||
<h6>ARR (Annual Recurring Revenue)</h6>
|
||||
<p class="subtitle">Year 1 Target: $180K</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="card-content">
|
||||
<div class="statistic-item">
|
||||
<div class="item-title">
|
||||
<span>💰</span>
|
||||
<h5>$165K</h5>
|
||||
</div>
|
||||
<h6>92% de l'objectif</h6>
|
||||
<div class="text-green-500 font-medium mt-2">
|
||||
<i class="pi pi-arrow-up text-xs"></i>
|
||||
<span class="text-sm">+18% ce mois</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="col-12 lg:col-3">
|
||||
<div class="card statistics">
|
||||
<div class="card-header">
|
||||
<div class="card-title">
|
||||
<h6>Clients Actifs</h6>
|
||||
<p class="subtitle">Year 1 Target: 30</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="card-content">
|
||||
<div class="statistic-item">
|
||||
<div class="item-title">
|
||||
<span>👥</span>
|
||||
<h5>28</h5>
|
||||
</div>
|
||||
<h6>93% de l'objectif</h6>
|
||||
<div class="text-green-500 font-medium mt-2">
|
||||
<i class="pi pi-arrow-up text-xs"></i>
|
||||
<span class="text-sm">+3 ce mois</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="col-12 lg:col-3">
|
||||
<div class="card statistics">
|
||||
<div class="card-header">
|
||||
<div class="card-title">
|
||||
<h6>NPS (Net Promoter Score)</h6>
|
||||
<p class="subtitle">Year 1 Target: 50+</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="card-content">
|
||||
<div class="statistic-item">
|
||||
<div class="item-title">
|
||||
<span>⭐</span>
|
||||
<h5>68</h5>
|
||||
</div>
|
||||
<h6>Excellent (>50)</h6>
|
||||
<div class="text-green-500 font-medium mt-2">
|
||||
<i class="pi pi-arrow-up text-xs"></i>
|
||||
<span class="text-sm">+8 points</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="col-12 lg:col-3">
|
||||
<div class="card statistics">
|
||||
<div class="card-header">
|
||||
<div class="card-title">
|
||||
<h6>Cash Balance</h6>
|
||||
<p class="subtitle">Runway: 8.2 mois</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="card-content">
|
||||
<div class="statistic-item">
|
||||
<div class="item-title">
|
||||
<span>🏦</span>
|
||||
<h5>$42K</h5>
|
||||
</div>
|
||||
<h6>Healthy runway</h6>
|
||||
<div class="text-orange-500 font-medium mt-2">
|
||||
<i class="pi pi-arrow-down text-xs"></i>
|
||||
<span class="text-sm">-$8K ce mois</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Section 2: 4 Piliers GBCM - Service Portfolio (Symétrique 4 colonnes) -->
|
||||
<div class="col-12 dashboard-section">
|
||||
<div class="card">
|
||||
<div class="card-header">
|
||||
<div class="card-title">
|
||||
<h6>4 Piliers de Revenus GBCM</h6>
|
||||
<p class="subtitle">Service Portfolio Performance</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="card-content">
|
||||
<div class="grid symmetric-row">
|
||||
<div class="col-12 md:col-6 lg:col-3">
|
||||
<div class="card border-1 border-blue-200 bg-blue-50 text-center p-3">
|
||||
<i class="pi pi-star text-3xl text-blue-500 mb-2"></i>
|
||||
<div class="text-900 font-semibold mb-1 text-sm">TRANSFORM Programs</div>
|
||||
<div class="text-600 text-xs mb-2">Transformation 12 mois</div>
|
||||
<div class="text-xl font-bold text-blue-500 mb-1">$89K</div>
|
||||
<div class="text-xs text-600 mb-1">54% du revenue total</div>
|
||||
<div class="text-green-500 text-xs">
|
||||
<i class="pi pi-arrow-up"></i> 7 clients actifs
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="col-12 md:col-6 lg:col-3">
|
||||
<div class="card border-1 border-purple-200 bg-purple-50 text-center p-3">
|
||||
<i class="pi pi-briefcase text-3xl text-purple-500 mb-2"></i>
|
||||
<div class="text-900 font-semibold mb-1 text-sm">ADVISORY Retainers</div>
|
||||
<div class="text-600 text-xs mb-2">Consulting stratégique</div>
|
||||
<div class="text-xl font-bold text-purple-500 mb-1">$45K</div>
|
||||
<div class="text-xs text-600 mb-1">27% du revenue total</div>
|
||||
<div class="text-green-500 text-xs">
|
||||
<i class="pi pi-arrow-up"></i> 3 retainers actifs
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="col-12 md:col-6 lg:col-3">
|
||||
<div class="card border-1 border-orange-200 bg-orange-50 text-center p-3">
|
||||
<i class="pi pi-bolt text-3xl text-orange-500 mb-2"></i>
|
||||
<div class="text-900 font-semibold mb-1 text-sm">ACCELERATOR Intensives</div>
|
||||
<div class="text-600 text-xs mb-2">Sprints 90 jours</div>
|
||||
<div class="text-xl font-bold text-orange-500 mb-1">$25K</div>
|
||||
<div class="text-xs text-600 mb-1">15% du revenue total</div>
|
||||
<div class="text-orange-500 text-xs">
|
||||
<i class="pi pi-clock"></i> 1 intensive en cours
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="col-12 md:col-6 lg:col-3">
|
||||
<div class="card border-1 border-teal-200 bg-teal-50 text-center p-3">
|
||||
<i class="pi pi-desktop text-3xl text-teal-500 mb-2"></i>
|
||||
<div class="text-900 font-semibold mb-1 text-sm">PLATFORM Membership</div>
|
||||
<div class="text-600 text-xs mb-2">Self-serve subscription</div>
|
||||
<div class="text-xl font-bold text-teal-500 mb-1">$6K</div>
|
||||
<div class="text-xs text-600 mb-1">4% du revenue total</div>
|
||||
<div class="text-green-500 text-xs">
|
||||
<i class="pi pi-arrow-up"></i> 17 membres actifs
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Section 3: ARR Chart + Business Activity (Symétrique 6+6) -->
|
||||
<div class="col-12 dashboard-section">
|
||||
<div class="grid symmetric-row">
|
||||
<div class="col-12 lg:col-6">
|
||||
<div class="card chart">
|
||||
<div class="card-header">
|
||||
<div class="card-title">
|
||||
<h6>ARR Evolution - Year 1</h6>
|
||||
<p class="subtitle">Objectif: $180K ARR</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="card-content">
|
||||
<div style="height: 220px; position: relative;">
|
||||
<canvas id="arrChart"></canvas>
|
||||
</div>
|
||||
<div class="grid mt-2" style="padding: 0.5rem;">
|
||||
<div class="col-3 text-center">
|
||||
<div class="text-600" style="font-size: 0.75rem;">Q1</div>
|
||||
<div class="text-900 font-bold" style="font-size: 0.9rem;">$48K</div>
|
||||
</div>
|
||||
<div class="col-3 text-center">
|
||||
<div class="text-600" style="font-size: 0.75rem;">Q2</div>
|
||||
<div class="text-900 font-bold" style="font-size: 0.9rem;">$89K</div>
|
||||
</div>
|
||||
<div class="col-3 text-center">
|
||||
<div class="text-600" style="font-size: 0.75rem;">Q3</div>
|
||||
<div class="text-900 font-bold" style="font-size: 0.9rem;">$138K</div>
|
||||
</div>
|
||||
<div class="col-3 text-center">
|
||||
<div class="text-600" style="font-size: 0.75rem;">Q4</div>
|
||||
<div class="text-blue-500 font-bold" style="font-size: 0.9rem;">$180K</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="col-12 lg:col-6">
|
||||
<div class="card activity">
|
||||
<div class="card-header">
|
||||
<div class="card-title">
|
||||
<h6>Activité Business</h6>
|
||||
<p class="subtitle">Dernières 24h</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="card-content">
|
||||
<ul>
|
||||
<li class="green">
|
||||
<i class="pi pi-circle-on"></i>
|
||||
<div class="event-content">
|
||||
<span class="event-title">Nouveau Client</span>
|
||||
<span>TechStartup Inc. a signé un TRANSFORM Scale ($23,997/an)</span>
|
||||
<span class="time">2h30</span>
|
||||
</div>
|
||||
</li>
|
||||
<li class="blue">
|
||||
<i class="pi pi-circle-on"></i>
|
||||
<div class="event-content">
|
||||
<span class="event-title">Session Coaching</span>
|
||||
<span>Session 1:1 avec Marie Dupont (CEO, InnovCorp) - Strategic Planning</span>
|
||||
<span class="time">4h15</span>
|
||||
</div>
|
||||
</li>
|
||||
<li class="orange">
|
||||
<i class="pi pi-circle-on"></i>
|
||||
<div class="event-content">
|
||||
<span class="event-title">Paiement Reçu</span>
|
||||
<span>ADVISORY Retainer - GlobalTech ($10,000/mois)</span>
|
||||
<span class="time">6h20</span>
|
||||
</div>
|
||||
</li>
|
||||
<li class="purple">
|
||||
<i class="pi pi-circle-on"></i>
|
||||
<div class="event-content">
|
||||
<span class="event-title">NPS Survey</span>
|
||||
<span>Score 9/10 reçu de StartupXYZ - "Excellent coaching!"</span>
|
||||
<span class="time">8h45</span>
|
||||
</div>
|
||||
</li>
|
||||
<li class="blue">
|
||||
<i class="pi pi-circle-on"></i>
|
||||
<div class="event-content">
|
||||
<span class="event-title">Platform Member</span>
|
||||
<span>3 nouveaux membres PLATFORM Membership ($297/mois)</span>
|
||||
<span class="time">12h30</span>
|
||||
</div>
|
||||
</li>
|
||||
</ul>
|
||||
<a href="#">Voir toute l'activité</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Section Symétrique 2: Schedule + Performance Metrics (6+6) -->
|
||||
<div class="col-12 lg:col-6">
|
||||
<div class="card schedule">
|
||||
<div class="card-header">
|
||||
<div class="card-title">
|
||||
<h6>Planning Aujourd'hui</h6>
|
||||
<p class="subtitle">Coaching & Business</p>
|
||||
</div>
|
||||
<p class="subtitle">Lundi 13 Oct</p>
|
||||
</div>
|
||||
<p>4 événements, 6h 30m</p>
|
||||
<ul>
|
||||
<li>
|
||||
<div class="schedule-header">
|
||||
<h6>TRANSFORM Session - TechStartup Inc.</h6>
|
||||
<span>9:00 - 10:30</span>
|
||||
</div>
|
||||
<a href="#">Rejoindre sur Zoom</a>
|
||||
<span>Strategic Planning Q4 - CEO + CTO</span>
|
||||
</li>
|
||||
<li>
|
||||
<div class="schedule-header">
|
||||
<h6>ADVISORY Call - GlobalTech</h6>
|
||||
<span>11:00 - 12:00</span>
|
||||
</div>
|
||||
<a href="#">Rejoindre sur Teams</a>
|
||||
<span>Monthly Retainer Review - Leadership Team</span>
|
||||
</li>
|
||||
<li>
|
||||
<div class="schedule-header">
|
||||
<h6>ACCELERATOR Intensive - Day 45</h6>
|
||||
<span>14:00 - 16:00</span>
|
||||
</div>
|
||||
<a href="#">Salle de formation</a>
|
||||
<span>Growth Hacking Workshop - 8 participants</span>
|
||||
</li>
|
||||
<li>
|
||||
<div class="schedule-header">
|
||||
<h6>Prospect Call - InnovCorp</h6>
|
||||
<span>17:00 - 17:30</span>
|
||||
</div>
|
||||
<a href="#">Appel téléphonique</a>
|
||||
<span>Discovery call - Potential TRANSFORM Growth</span>
|
||||
</li>
|
||||
</ul>
|
||||
<a href="#">Voir le planning complet</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="col-12 lg:col-6">
|
||||
<div class="card statistics">
|
||||
<div class="card-header">
|
||||
<div class="card-title">
|
||||
<h6>Performance Mensuelle</h6>
|
||||
<p class="subtitle">Métriques Octobre 2026</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="grid">
|
||||
<div class="col-6">
|
||||
<div class="statistic-item">
|
||||
<div class="item-title">
|
||||
<span>💰</span>
|
||||
<h5>$15.2K</h5>
|
||||
</div>
|
||||
<h6>Revenus mensuel</h6>
|
||||
<div class="text-green-500 text-xs mt-1">
|
||||
<i class="pi pi-arrow-up"></i> +18% vs Sept
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-6">
|
||||
<div class="statistic-item">
|
||||
<div class="item-title">
|
||||
<span>📅</span>
|
||||
<h5>28</h5>
|
||||
</div>
|
||||
<h6>Sessions réalisées</h6>
|
||||
<div class="text-green-500 text-xs mt-1">
|
||||
<i class="pi pi-arrow-up"></i> +8% vs Sept
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-6">
|
||||
<div class="statistic-item">
|
||||
<div class="item-title">
|
||||
<span>🎯</span>
|
||||
<h5>6</h5>
|
||||
</div>
|
||||
<h6>Ateliers planifiés</h6>
|
||||
<div class="text-orange-500 text-xs mt-1">
|
||||
<i class="pi pi-arrow-down"></i> -2% vs Sept
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-6">
|
||||
<div class="statistic-item">
|
||||
<div class="item-title">
|
||||
<span>⭐</span>
|
||||
<h5>4.8/5</h5>
|
||||
</div>
|
||||
<h6>Satisfaction client</h6>
|
||||
<div class="text-green-500 text-xs mt-1">
|
||||
<i class="pi pi-arrow-up"></i> +5% vs Sept
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Monthly Objectives Progress -->
|
||||
<div class="col-12">
|
||||
<div class="card device-status">
|
||||
<div class="grid">
|
||||
<div class="col-12 xl:col-9">
|
||||
<div class="card-header">
|
||||
<div class="card-title">
|
||||
<h6>Objectifs Mensuels - Octobre 2026</h6>
|
||||
<p class="subtitle">Progress vers les targets Year 1</p>
|
||||
</div>
|
||||
</div>
|
||||
<p class="content">Suivi des KPIs critiques pour atteindre les objectifs Year 1: $180K ARR, 30 clients, NPS 50+</p>
|
||||
<div class="progress active">
|
||||
<span>ARR Target</span>
|
||||
<p:progressBar value="92" displayOnly="true"/>
|
||||
<span>$165K / $180K</span>
|
||||
</div>
|
||||
<div class="progress">
|
||||
<span>Clients Target</span>
|
||||
<p:progressBar value="93" displayOnly="true"/>
|
||||
<span>28 / 30</span>
|
||||
</div>
|
||||
<div class="progress">
|
||||
<span>NPS Target</span>
|
||||
<p:progressBar value="100" displayOnly="true"/>
|
||||
<span>68 / 50+</span>
|
||||
</div>
|
||||
<div class="progress">
|
||||
<span>Cash Runway</span>
|
||||
<p:progressBar value="82" displayOnly="true"/>
|
||||
<span>8.2 mois</span>
|
||||
</div>
|
||||
<a href="#">Voir détails OKRs</a>
|
||||
</div>
|
||||
<div class="col-12 xl:col-3">
|
||||
<div class="card-header">
|
||||
<div class="card-title">
|
||||
<h6>Services</h6>
|
||||
<p class="subtitle">Performance</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="grid grid-nogutter">
|
||||
<div class="col-3 xl:col-12">
|
||||
<div class="device">
|
||||
<span><span>1</span> TRANSFORM</span>
|
||||
<span class="status">54%</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-3 xl:col-12">
|
||||
<div class="device">
|
||||
<span><span>2</span> ADVISORY</span>
|
||||
<span class="status">27%</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-3 xl:col-12">
|
||||
<div class="device">
|
||||
<span><span>3</span> ACCELERATOR</span>
|
||||
<span class="status">15%</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-3 xl:col-12">
|
||||
<div class="device">
|
||||
<span><span>4</span> PLATFORM</span>
|
||||
<span class="status">4%</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Section Symétrique 3: Pipeline + Objectifs Mensuels (6+6) -->
|
||||
<div class="col-12 lg:col-6">
|
||||
<div class="card stocks">
|
||||
<div class="card-header">
|
||||
<div class="card-title">
|
||||
<h6>🎯 Pipeline Prospects</h6>
|
||||
<p class="subtitle">Q4 2026</p>
|
||||
</div>
|
||||
<p:commandButton type="button" icon="pi pi-plus" styleClass="ui-button-secondary ui-button-flat rounded-button" />
|
||||
</div>
|
||||
<ul>
|
||||
<li class="up">
|
||||
<div class="stock-name">
|
||||
<h6>InnovCorp</h6>
|
||||
</div>
|
||||
<div class="stock-price">
|
||||
<i class="pi pi-arrow-up"></i>
|
||||
<h6>TRANSFORM Growth</h6>
|
||||
</div>
|
||||
<div class="stock-status">
|
||||
<span>$8,997</span>
|
||||
<span>Discovery</span>
|
||||
</div>
|
||||
</li>
|
||||
<li class="up">
|
||||
<div class="stock-name">
|
||||
<h6>ScaleUp Ltd</h6>
|
||||
</div>
|
||||
<div class="stock-price">
|
||||
<i class="pi pi-arrow-up"></i>
|
||||
<h6>ADVISORY</h6>
|
||||
</div>
|
||||
<div class="stock-status">
|
||||
<span>$7,500/m</span>
|
||||
<span>Proposal</span>
|
||||
</div>
|
||||
</li>
|
||||
<li class="same">
|
||||
<div class="stock-name">
|
||||
<h6>NextGen Co</h6>
|
||||
</div>
|
||||
<div class="stock-price">
|
||||
<i class="pi pi-minus"></i>
|
||||
<h6>PLATFORM</h6>
|
||||
</div>
|
||||
<div class="stock-status">
|
||||
<span>$297/m</span>
|
||||
<span>Nurturing</span>
|
||||
</div>
|
||||
</li>
|
||||
<li class="down">
|
||||
<div class="stock-name">
|
||||
<h6>TechCorp</h6>
|
||||
</div>
|
||||
<div class="stock-price">
|
||||
<i class="pi pi-arrow-down"></i>
|
||||
<h6>ACCELERATOR</h6>
|
||||
</div>
|
||||
<div class="stock-status">
|
||||
<span>$25,000</span>
|
||||
<span>Stalled</span>
|
||||
</div>
|
||||
</li>
|
||||
</ul>
|
||||
<a href="#">Voir tout le pipeline</a>
|
||||
<p:commandButton type="button" value="Ajouter prospect" />
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="col-12 lg:col-6">
|
||||
<div class="card statistics">
|
||||
<div class="card-header">
|
||||
<div class="card-title">
|
||||
<h6>Objectifs Mensuels - Octobre 2026</h6>
|
||||
<p class="subtitle">Progress vers targets Year 1</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="card-content">
|
||||
<p class="content" style="margin-bottom: 1.5rem; font-size: 0.875rem; line-height: 1.4;">
|
||||
Suivi des KPIs critiques pour atteindre les objectifs Year 1: $180K ARR, 30 clients, NPS 50+
|
||||
</p>
|
||||
<div class="grid">
|
||||
<div class="col-6">
|
||||
<div class="progress">
|
||||
<span>Revenus</span>
|
||||
<p:progressBar value="76" displayOnly="true" style="height: 8px;"/>
|
||||
<span>$15.2K / $20K</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-6">
|
||||
<div class="progress">
|
||||
<span>Clients</span>
|
||||
<p:progressBar value="67" displayOnly="true" style="height: 8px;"/>
|
||||
<span>8 / 12</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-6">
|
||||
<div class="progress">
|
||||
<span>Sessions</span>
|
||||
<p:progressBar value="93" displayOnly="true" style="height: 8px;"/>
|
||||
<span>28 / 30</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-6">
|
||||
<div class="progress">
|
||||
<span>NPS</span>
|
||||
<p:progressBar value="96" displayOnly="true" style="height: 8px;"/>
|
||||
<span>4.8 / 5.0</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="mt-3 text-center">
|
||||
<a href="#" style="font-size: 0.875rem;">Voir détails OKRs</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</ui:define>
|
||||
|
||||
</ui:composition>
|
||||
163
src/main/resources/META-INF/resources/pages/profile.xhtml
Normal file
163
src/main/resources/META-INF/resources/pages/profile.xhtml
Normal file
@@ -0,0 +1,163 @@
|
||||
<ui:composition xmlns="http://www.w3.org/1999/xhtml"
|
||||
xmlns:h="http://java.sun.com/jsf/html"
|
||||
xmlns:f="http://java.sun.com/jsf/core"
|
||||
xmlns:ui="http://java.sun.com/jsf/facelets"
|
||||
xmlns:p="http://primefaces.org/ui"
|
||||
template="/WEB-INF/freya-templates/template.xhtml">
|
||||
<ui:define name="title">Profil Utilisateur - GBCM</ui:define>
|
||||
|
||||
<ui:define name="content">
|
||||
<div class="grid">
|
||||
<div class="col-12">
|
||||
<div class="card">
|
||||
<h2 class="text-900 font-semibold text-xl mb-4">
|
||||
<i class="pi pi-user mr-2"></i>
|
||||
Profil Utilisateur
|
||||
</h2>
|
||||
|
||||
<div class="grid">
|
||||
<!-- Photo de profil et informations principales -->
|
||||
<div class="col-12 md:col-4">
|
||||
<div class="text-center mb-4">
|
||||
<div style="width: 120px; height: 120px; border-radius: 50%; background: linear-gradient(135deg, var(--primary-color), var(--primary-color-text)); display: flex; align-items: center; justify-content: center; margin: 0 auto 1rem auto; font-size: 3rem; font-weight: bold; color: white;">
|
||||
#{authBean.authenticated ? authBean.fullName.substring(0,1).toUpperCase() : 'U'}
|
||||
</div>
|
||||
<h3 class="text-900 font-semibold mb-2">#{authBean.fullName}</h3>
|
||||
<p class="text-600 mb-0">#{authBean.email}</p>
|
||||
<p:badge value="Connecté" severity="success" class="mt-2"></p:badge>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Informations détaillées -->
|
||||
<div class="col-12 md:col-8">
|
||||
<div class="grid">
|
||||
<div class="col-12 md:col-6">
|
||||
<h4 class="text-900 font-semibold mb-3">Informations Personnelles</h4>
|
||||
<div class="mb-3">
|
||||
<label class="block text-900 font-medium mb-1">Nom complet</label>
|
||||
<p class="text-700 m-0">#{authBean.fullName}</p>
|
||||
</div>
|
||||
<div class="mb-3">
|
||||
<label class="block text-900 font-medium mb-1">Email</label>
|
||||
<p class="text-700 m-0">#{authBean.email}</p>
|
||||
</div>
|
||||
<div class="mb-3">
|
||||
<label class="block text-900 font-medium mb-1">Nom d'utilisateur</label>
|
||||
<p class="text-700 m-0">#{authBean.username}</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="col-12 md:col-6">
|
||||
<h4 class="text-900 font-semibold mb-3">Rôles et Permissions</h4>
|
||||
<div class="mb-3">
|
||||
<label class="block text-900 font-medium mb-1">Rôles assignés</label>
|
||||
<div class="flex flex-wrap gap-2">
|
||||
<ui:repeat value="#{authBean.roles}" var="role">
|
||||
<p:badge value="#{role}" severity="info"></p:badge>
|
||||
</ui:repeat>
|
||||
</div>
|
||||
</div>
|
||||
<div class="mb-3">
|
||||
<label class="block text-900 font-medium mb-1">Niveau d'accès</label>
|
||||
<p class="text-700 m-0">
|
||||
<h:outputText value="Administrateur" rendered="#{authBean.admin}" />
|
||||
<h:outputText value="Manager" rendered="#{authBean.manager and not authBean.admin}" />
|
||||
<h:outputText value="Coach" rendered="#{authBean.coach and not authBean.manager and not authBean.admin}" />
|
||||
<h:outputText value="Client" rendered="#{authBean.client and not authBean.coach and not authBean.manager and not authBean.admin}" />
|
||||
<h:outputText value="Prospect" rendered="#{authBean.prospect and not authBean.client and not authBean.coach and not authBean.manager and not authBean.admin}" />
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Informations de session OIDC -->
|
||||
<div class="col-12">
|
||||
<div class="card">
|
||||
<h3 class="text-900 font-semibold text-lg mb-4">
|
||||
<i class="pi pi-shield mr-2"></i>
|
||||
Informations de Session OIDC
|
||||
</h3>
|
||||
|
||||
<div class="grid">
|
||||
<div class="col-12 md:col-6">
|
||||
<h4 class="text-900 font-semibold mb-3">Token Information</h4>
|
||||
<div class="mb-3">
|
||||
<label class="block text-900 font-medium mb-1">Issuer</label>
|
||||
<p class="text-700 m-0 text-sm">#{authBean.tokenInfoDetails.issuer}</p>
|
||||
</div>
|
||||
<div class="mb-3">
|
||||
<label class="block text-900 font-medium mb-1">Subject</label>
|
||||
<p class="text-700 m-0 text-sm">#{authBean.tokenInfoDetails.subject}</p>
|
||||
</div>
|
||||
<div class="mb-3">
|
||||
<label class="block text-900 font-medium mb-1">Audience</label>
|
||||
<p class="text-700 m-0 text-sm">#{authBean.tokenInfoDetails.audience}</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="col-12 md:col-6">
|
||||
<h4 class="text-900 font-semibold mb-3">Session Details</h4>
|
||||
<div class="mb-3">
|
||||
<label class="block text-900 font-medium mb-1">Expiration</label>
|
||||
<p class="text-700 m-0 text-sm">
|
||||
<h:outputText value="#{authBean.tokenInfoDetails.expirationTime}">
|
||||
<f:convertDateTime pattern="dd/MM/yyyy HH:mm:ss" timeZone="Europe/Paris" type="both"/>
|
||||
</h:outputText>
|
||||
</p>
|
||||
</div>
|
||||
<div class="mb-3">
|
||||
<label class="block text-900 font-medium mb-1">Émis le</label>
|
||||
<p class="text-700 m-0 text-sm">
|
||||
<h:outputText value="#{authBean.tokenInfoDetails.issuedAt}">
|
||||
<f:convertDateTime pattern="dd/MM/yyyy HH:mm:ss" timeZone="Europe/Paris" type="both"/>
|
||||
</h:outputText>
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Actions -->
|
||||
<div class="col-12">
|
||||
<div class="card">
|
||||
<h3 class="text-900 font-semibold text-lg mb-4">
|
||||
<i class="pi pi-cog mr-2"></i>
|
||||
Actions
|
||||
</h3>
|
||||
|
||||
<div class="flex flex-wrap gap-3">
|
||||
<p:commandButton value="Modifier le profil"
|
||||
icon="pi pi-pencil"
|
||||
styleClass="p-button-outlined"
|
||||
disabled="true"
|
||||
title="Fonctionnalité à venir"/>
|
||||
|
||||
<p:commandButton value="Changer le mot de passe"
|
||||
icon="pi pi-key"
|
||||
styleClass="p-button-outlined"
|
||||
disabled="true"
|
||||
title="Géré par Keycloak"/>
|
||||
|
||||
<p:commandButton value="Paramètres de sécurité"
|
||||
icon="pi pi-shield"
|
||||
styleClass="p-button-outlined"
|
||||
disabled="true"
|
||||
title="Fonctionnalité à venir"/>
|
||||
|
||||
<p:commandButton value="Se déconnecter"
|
||||
icon="pi pi-sign-out"
|
||||
styleClass="p-button-danger"
|
||||
action="#{authBean.logout}"
|
||||
onclick="return confirm('Êtes-vous sûr de vouloir vous déconnecter ?')"/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</ui:define>
|
||||
|
||||
</ui:composition>
|
||||
68
src/main/resources/META-INF/resources/pages/sessions.xhtml
Normal file
68
src/main/resources/META-INF/resources/pages/sessions.xhtml
Normal file
@@ -0,0 +1,68 @@
|
||||
<ui:composition xmlns="http://www.w3.org/1999/xhtml" xmlns:h="http://java.sun.com/jsf/html"
|
||||
xmlns:f="http://java.sun.com/jsf/core" xmlns:ui="http://java.sun.com/jsf/facelets"
|
||||
xmlns:p="http://primefaces.org/ui" template="/WEB-INF/freya-templates/template.xhtml">
|
||||
<ui:define name="title">Gestion des Sessions - GBCM</ui:define>
|
||||
|
||||
<ui:define name="content">
|
||||
<div class="grid">
|
||||
<div class="col-12">
|
||||
<div class="card">
|
||||
<div class="flex justify-content-between align-items-center mb-4">
|
||||
<h2 class="text-900 font-semibold text-xl m-0">
|
||||
<i class="pi pi-calendar mr-2"></i>
|
||||
Gestion des Sessions
|
||||
</h2>
|
||||
<p:commandButton value="Nouvelle Session" icon="pi pi-plus" styleClass="p-button-success"
|
||||
disabled="true" title="Fonctionnalité à venir" />
|
||||
</div>
|
||||
|
||||
<!-- Tableau des sessions (Real Data) -->
|
||||
<p:dataTable value="#{sessionBean.sessions}" var="session" emptyMessage="Aucune session trouvée"
|
||||
paginator="true" rows="10" paginatorPosition="bottom" styleClass="p-datatable-gridlines">
|
||||
|
||||
<p:column headerText="Titre" sortBy="#{session.title}">
|
||||
<h:outputText value="#{session.title}" styleClass="font-bold" />
|
||||
</p:column>
|
||||
|
||||
<p:column headerText="Date & Heure" sortBy="#{session.scheduledDateTime}">
|
||||
<h:outputText value="#{session.scheduledDateTime}">
|
||||
<f:convertDateTime pattern="dd/MM/yyyy HH:mm" type="localDateTime" />
|
||||
</h:outputText>
|
||||
</p:column>
|
||||
|
||||
<p:column headerText="Coach" sortBy="#{session.coach.user.lastName}">
|
||||
<h:outputText value="#{session.coach.user.fullName}" />
|
||||
</p:column>
|
||||
|
||||
<p:column headerText="Client" sortBy="#{session.client.companyName}">
|
||||
<h:outputText value="#{session.client.companyName}" />
|
||||
</p:column>
|
||||
|
||||
<p:column headerText="Type">
|
||||
<h:outputText value="#{session.serviceType}" />
|
||||
</p:column>
|
||||
|
||||
<p:column headerText="Statut" width="120">
|
||||
<p:badge value="#{session.status}"
|
||||
severity="#{session.status == 'COMPLETED' ? 'success' : (session.status == 'CANCELLED' ? 'danger' : 'info')}" />
|
||||
</p:column>
|
||||
|
||||
<p:column headerText="Prix">
|
||||
<h:outputText value="#{session.price}">
|
||||
<f:convertNumber type="currency" currencySymbol="$" />
|
||||
</h:outputText>
|
||||
</p:column>
|
||||
|
||||
<p:column headerText="Actions" width="120">
|
||||
<p:commandButton icon="pi pi-eye"
|
||||
styleClass="p-button-rounded p-button-text p-button-info mr-1" title="Voir" />
|
||||
<p:commandButton icon="pi pi-pencil"
|
||||
styleClass="p-button-rounded p-button-text p-button-warning" title="Modifier" />
|
||||
</p:column>
|
||||
</p:dataTable>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</ui:define>
|
||||
|
||||
</ui:composition>
|
||||
69
src/main/resources/META-INF/resources/pages/workshops.xhtml
Normal file
69
src/main/resources/META-INF/resources/pages/workshops.xhtml
Normal file
@@ -0,0 +1,69 @@
|
||||
<ui:composition xmlns="http://www.w3.org/1999/xhtml" xmlns:h="http://java.sun.com/jsf/html"
|
||||
xmlns:f="http://java.sun.com/jsf/core" xmlns:ui="http://java.sun.com/jsf/facelets"
|
||||
xmlns:p="http://primefaces.org/ui" template="/WEB-INF/freya-templates/template.xhtml">
|
||||
<ui:define name="title">Gestion des Ateliers - GBCM</ui:define>
|
||||
|
||||
<ui:define name="content">
|
||||
<div class="grid">
|
||||
<div class="col-12">
|
||||
<div class="card">
|
||||
<div class="flex justify-content-between align-items-center mb-4">
|
||||
<h2 class="text-900 font-semibold text-xl m-0">
|
||||
<i class="pi pi-comments mr-2"></i>
|
||||
Gestion des Ateliers
|
||||
</h2>
|
||||
<p:commandButton value="Nouvel Atelier" icon="pi pi-plus" styleClass="p-button-success"
|
||||
disabled="true" title="Fonctionnalité à venir" />
|
||||
</div>
|
||||
|
||||
<!-- Tableau des ateliers (Real Data) -->
|
||||
<p:dataTable value="#{workshopBean.workshops}" var="workshop" emptyMessage="Aucun atelier trouvé"
|
||||
paginator="true" rows="10" paginatorPosition="bottom" styleClass="p-datatable-gridlines">
|
||||
|
||||
<p:column headerText="Titre" sortBy="#{workshop.title}">
|
||||
<h:outputText value="#{workshop.title}" styleClass="font-bold" />
|
||||
<div class="text-xs text-500">#{workshop.workshopPackage}</div>
|
||||
</p:column>
|
||||
|
||||
<p:column headerText="Date Début" sortBy="#{workshop.startDateTime}">
|
||||
<h:outputText value="#{workshop.startDateTime}">
|
||||
<f:convertDateTime pattern="dd/MM/yyyy HH:mm" type="localDateTime" />
|
||||
</h:outputText>
|
||||
</p:column>
|
||||
|
||||
<p:column headerText="Coach" sortBy="#{workshop.coach.user.lastName}">
|
||||
<h:outputText value="#{workshop.coach.user.fullName}" />
|
||||
</p:column>
|
||||
|
||||
<p:column headerText="Participants">
|
||||
<div class="flex align-items-center">
|
||||
<span class="mr-2">#{workshop.currentParticipants} / #{workshop.maxParticipants}</span>
|
||||
<p:progressBar value="#{workshop.occupancyPercentage}" displayOnly="true"
|
||||
style="height: 6px; width: 60px;" labelTemplate="" />
|
||||
</div>
|
||||
</p:column>
|
||||
|
||||
<p:column headerText="Prix">
|
||||
<h:outputText value="#{workshop.price}">
|
||||
<f:convertNumber type="currency" currencySymbol="$" />
|
||||
</h:outputText>
|
||||
</p:column>
|
||||
|
||||
<p:column headerText="Statut" width="120">
|
||||
<p:badge value="#{workshop.status}"
|
||||
severity="#{workshop.status == 'COMPLETED' ? 'success' : (workshop.status == 'CANCELLED' ? 'danger' : 'info')}" />
|
||||
</p:column>
|
||||
|
||||
<p:column headerText="Actions" width="120">
|
||||
<p:commandButton icon="pi pi-eye"
|
||||
styleClass="p-button-rounded p-button-text p-button-info mr-1" title="Voir" />
|
||||
<p:commandButton icon="pi pi-pencil"
|
||||
styleClass="p-button-rounded p-button-text p-button-warning" title="Modifier" />
|
||||
</p:column>
|
||||
</p:dataTable>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</ui:define>
|
||||
|
||||
</ui:composition>
|
||||
File diff suppressed because one or more lines are too long
@@ -0,0 +1,13 @@
|
||||
@import '../../sass/mixins/_mixins';
|
||||
@import './pages/_common';
|
||||
@import './pages/_crud';
|
||||
@import './pages/_documentation';
|
||||
@import './pages/_icons';
|
||||
@import './pages/_list';
|
||||
@import './pages/_messages';
|
||||
@import './pages/_misc';
|
||||
@import './pages/_table';
|
||||
@import './pages/_chronoline';
|
||||
@import './pages/_floatlabel';
|
||||
@import './pages/_syntax';
|
||||
@import './pages/_blocks';
|
||||
@@ -0,0 +1,734 @@
|
||||
.order-badge {
|
||||
border-radius: 2px;
|
||||
padding: 0.25em 0.5rem;
|
||||
text-transform: uppercase;
|
||||
font-weight: 700;
|
||||
font-size: 12px;
|
||||
letter-spacing: 0.3px;
|
||||
}
|
||||
.order-badge.order-delivered {
|
||||
background: #ACEBB4;
|
||||
color: #348861;
|
||||
}
|
||||
.order-badge.order-cancelled {
|
||||
background: #FABD9A;
|
||||
color: #AD342B;
|
||||
}
|
||||
.order-badge.order-pending {
|
||||
background: #F8D895;
|
||||
color: #A76927;
|
||||
}
|
||||
.order-badge.order-returned {
|
||||
background: #EFB8E5;
|
||||
color: #833F91;
|
||||
}
|
||||
|
||||
.product-badge {
|
||||
border-radius: 2px;
|
||||
padding: 0.25em 0.5rem;
|
||||
text-transform: uppercase;
|
||||
font-weight: 700;
|
||||
font-size: 12px;
|
||||
letter-spacing: 0.3px;
|
||||
text-align: center;
|
||||
}
|
||||
.product-badge.status-instock {
|
||||
background: #ACEBB4;
|
||||
color: #348861;
|
||||
}
|
||||
.product-badge.status-outofstock {
|
||||
background: #FABD9A;
|
||||
color: #AD342B;
|
||||
}
|
||||
.product-badge.status-lowstock {
|
||||
background: #F8D895;
|
||||
color: #A76927;
|
||||
}
|
||||
|
||||
.customer-badge {
|
||||
border-radius: 2px;
|
||||
padding: 0.25em 0.5rem;
|
||||
text-transform: uppercase;
|
||||
font-weight: 700;
|
||||
font-size: 12px;
|
||||
letter-spacing: 0.3px;
|
||||
}
|
||||
.customer-badge.status-qualified {
|
||||
background: #ACEBB4;
|
||||
color: #348861;
|
||||
}
|
||||
.customer-badge.status-unqualified {
|
||||
background: #FABD9A;
|
||||
color: #AD342B;
|
||||
}
|
||||
.customer-badge.status-negotiation {
|
||||
background: #F8D895;
|
||||
color: #A76927;
|
||||
}
|
||||
.customer-badge.status-new {
|
||||
background: #9BF2F7;
|
||||
color: #2B7AA4;
|
||||
}
|
||||
.customer-badge.status-renewal {
|
||||
background: #EFB8E5;
|
||||
color: #833F91;
|
||||
}
|
||||
.customer-badge.status-proposal {
|
||||
background: #FFD8B2;
|
||||
color: #805B36;
|
||||
}
|
||||
|
||||
.filter-container .ui-inputtext {
|
||||
width: 400px;
|
||||
}
|
||||
|
||||
.ui-selection-column {
|
||||
width: 2rem;
|
||||
}
|
||||
|
||||
@media (max-width: 640px) {
|
||||
.filter-container {
|
||||
width: 100%;
|
||||
margin-top: 0.5rem;
|
||||
}
|
||||
|
||||
.filter-container .ui-inputtext {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.ui-selection-column {
|
||||
width: auto;
|
||||
text-align: center;
|
||||
}
|
||||
.ui-selection-column .ui-column-title {
|
||||
display: none !important;
|
||||
}
|
||||
}
|
||||
.crud-demo .ui-datatable {
|
||||
margin-top: 1rem;
|
||||
}
|
||||
.crud-demo .product-image {
|
||||
width: 100px;
|
||||
box-shadow: 0 3px 6px rgba(0, 0, 0, 0.16), 0 3px 6px rgba(0, 0, 0, 0.23);
|
||||
}
|
||||
.crud-demo .ui-dialog .product-image {
|
||||
width: 250px;
|
||||
margin: 0 auto 2rem auto;
|
||||
display: block;
|
||||
}
|
||||
.crud-demo .ui-dialog-footer .ui-button {
|
||||
min-width: 6rem;
|
||||
}
|
||||
.crud-demo .ui-datatable .ui-column-filter {
|
||||
display: none;
|
||||
}
|
||||
.crud-demo .products-table-header {
|
||||
display: -ms-flexbox;
|
||||
display: flex;
|
||||
-ms-flex-align: center;
|
||||
align-items: center;
|
||||
-ms-flex-pack: justify;
|
||||
justify-content: space-between;
|
||||
-ms-flex-wrap: wrap;
|
||||
flex-wrap: wrap;
|
||||
}
|
||||
.crud-demo .edit-button.ui-button {
|
||||
margin-right: 0.5rem;
|
||||
}
|
||||
.crud-demo .orders-subtable {
|
||||
padding: 1rem;
|
||||
}
|
||||
.crud-demo .products-table > .ui-datatable-tablewrapper > table > thead > tr > th:nth-child(2) {
|
||||
width: 2rem;
|
||||
}
|
||||
.crud-demo .products-table .ui-rating {
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
@media (max-width: 640px) {
|
||||
.products-table > .ui-datatable-tablewrapper > table > thead > tr > th:nth-child(2) .ui-column-title,
|
||||
.products-table > .ui-datatable-tablewrapper > table > tbody > tr > td:nth-child(2) .ui-column-title {
|
||||
display: none !important;
|
||||
}
|
||||
|
||||
.products-buttonbar {
|
||||
-ms-flex-direction: column;
|
||||
flex-direction: column;
|
||||
}
|
||||
.products-buttonbar > div:last-child {
|
||||
margin-top: 0.5rem;
|
||||
}
|
||||
}
|
||||
.docs li {
|
||||
line-height: 1.5;
|
||||
}
|
||||
|
||||
.icons-demo .icons-list {
|
||||
text-align: center;
|
||||
color: #EAEBEC;
|
||||
}
|
||||
.icons-demo .icons-list i {
|
||||
font-size: 1.5rem;
|
||||
margin-bottom: 0.5rem;
|
||||
}
|
||||
|
||||
.list-demo .product-name {
|
||||
font-size: 1.5rem;
|
||||
font-weight: 700;
|
||||
}
|
||||
.list-demo .product-description {
|
||||
margin: 0 0 1rem 0;
|
||||
}
|
||||
.list-demo .product-category-icon {
|
||||
vertical-align: middle;
|
||||
margin-right: 0.5rem;
|
||||
}
|
||||
.list-demo .product-category {
|
||||
font-weight: 600;
|
||||
vertical-align: middle;
|
||||
}
|
||||
.list-demo .product-list-item {
|
||||
display: -ms-flexbox;
|
||||
display: flex;
|
||||
-ms-flex-align: center;
|
||||
align-items: center;
|
||||
padding: 1rem;
|
||||
}
|
||||
.list-demo .product-list-item img {
|
||||
width: 150px;
|
||||
box-shadow: 0 3px 6px rgba(0, 0, 0, 0.16), 0 3px 6px rgba(0, 0, 0, 0.23);
|
||||
margin-right: 2rem;
|
||||
}
|
||||
.list-demo .product-list-item .product-list-detail {
|
||||
flex: 1 1 0;
|
||||
-ms-flex: 1 1 0px;
|
||||
}
|
||||
.list-demo .product-list-item .ui-rating {
|
||||
margin: 0 0 0.5rem 0;
|
||||
}
|
||||
.list-demo .product-list-item .product-price {
|
||||
font-size: 1.5rem;
|
||||
font-weight: 600;
|
||||
margin-bottom: 0.5rem;
|
||||
align-self: flex-end;
|
||||
}
|
||||
.list-demo .product-list-item .product-list-action {
|
||||
display: -ms-flexbox;
|
||||
display: flex;
|
||||
-ms-flex-direction: column;
|
||||
flex-direction: column;
|
||||
}
|
||||
.list-demo .product-list-item .ui-button {
|
||||
margin-bottom: 0.5rem;
|
||||
}
|
||||
.list-demo .product-grid-item {
|
||||
border: 1px solid #383838;
|
||||
box-shadow: none;
|
||||
}
|
||||
.list-demo .product-grid-item .product-grid-item-top,
|
||||
.list-demo .product-grid-item .product-grid-item-bottom {
|
||||
display: -ms-flexbox;
|
||||
display: flex;
|
||||
-ms-flex-align: center;
|
||||
align-items: center;
|
||||
-ms-flex-pack: justify;
|
||||
justify-content: space-between;
|
||||
}
|
||||
.list-demo .product-grid-item img {
|
||||
width: 75%;
|
||||
box-shadow: 0 3px 6px rgba(0, 0, 0, 0.16), 0 3px 6px rgba(0, 0, 0, 0.23);
|
||||
margin: 2rem 0;
|
||||
}
|
||||
.list-demo .product-grid-item .product-grid-item-content {
|
||||
text-align: center;
|
||||
}
|
||||
.list-demo .product-grid-item .product-price {
|
||||
font-size: 1.5rem;
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
@media screen and (max-width: 576px) {
|
||||
.list-demo .product-list-item {
|
||||
-ms-flex-direction: column;
|
||||
flex-direction: column;
|
||||
-ms-flex-align: center;
|
||||
align-items: center;
|
||||
}
|
||||
.list-demo .product-list-item img {
|
||||
width: 75%;
|
||||
margin: 2rem 0;
|
||||
}
|
||||
.list-demo .product-list-item .product-list-detail {
|
||||
text-align: center;
|
||||
}
|
||||
.list-demo .product-list-item .product-price {
|
||||
align-self: center;
|
||||
}
|
||||
.list-demo .product-list-item .product-list-action {
|
||||
display: -ms-flexbox;
|
||||
display: flex;
|
||||
-ms-flex-direction: column;
|
||||
flex-direction: column;
|
||||
}
|
||||
.list-demo .product-list-item .product-list-action {
|
||||
margin-top: 2rem;
|
||||
-ms-flex-direction: row;
|
||||
flex-direction: row;
|
||||
-ms-flex-pack: justify;
|
||||
justify-content: space-between;
|
||||
-ms-flex-align: center;
|
||||
align-items: center;
|
||||
width: 100%;
|
||||
}
|
||||
}
|
||||
.messages-demo .ui-button.ui-widget {
|
||||
min-width: 6rem;
|
||||
}
|
||||
.messages-demo .field > label {
|
||||
width: 125px;
|
||||
}
|
||||
|
||||
.misc-demo .ui-button.ui-widget {
|
||||
min-width: 6rem;
|
||||
}
|
||||
.misc-demo .badges .ui-badge,
|
||||
.misc-demo .badges .ui-tag {
|
||||
margin-right: 0.5rem;
|
||||
}
|
||||
.misc-demo .ui-chip.custom-chip {
|
||||
background: var(--primary-color);
|
||||
color: var(--primary-color-text);
|
||||
}
|
||||
.misc-demo .custom-scrolltop {
|
||||
width: 2rem;
|
||||
height: 2rem;
|
||||
border-radius: 4px;
|
||||
background-color: var(--primary-color);
|
||||
}
|
||||
.misc-demo .custom-scrolltop:hover {
|
||||
background-color: var(--primary-color);
|
||||
}
|
||||
.misc-demo .custom-scrolltop .ui-scrolltop-icon {
|
||||
font-size: 1rem;
|
||||
color: var(--primary-color-text);
|
||||
}
|
||||
.misc-demo .custom-skeleton {
|
||||
border: 1px solid var(--surface-d);
|
||||
border-radius: 4px;
|
||||
}
|
||||
.misc-demo .custom-skeleton ul {
|
||||
list-style: none;
|
||||
}
|
||||
|
||||
.table-demo .ui-datatable .ui-column-filter {
|
||||
display: none;
|
||||
}
|
||||
.table-demo .customers-table-header {
|
||||
display: -ms-flexbox;
|
||||
display: flex;
|
||||
-ms-flex-align: center;
|
||||
align-items: center;
|
||||
-ms-flex-pack: justify;
|
||||
justify-content: space-between;
|
||||
-ms-flex-wrap: wrap;
|
||||
flex-wrap: wrap;
|
||||
}
|
||||
|
||||
@media (max-width: 640px) {
|
||||
.table-demo .ui-progressbar {
|
||||
margin-top: 0.5rem;
|
||||
}
|
||||
}
|
||||
.custom-marker {
|
||||
display: flex;
|
||||
width: 2rem;
|
||||
height: 2rem;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
color: #ffffff;
|
||||
border-radius: 50%;
|
||||
z-index: 1;
|
||||
}
|
||||
|
||||
.ui-chronoline-event-content,
|
||||
.ui-chronoline-event-opposite {
|
||||
line-height: 1;
|
||||
}
|
||||
|
||||
@media screen and (max-width: 960px) {
|
||||
.customized-chronoline .ui-chronoline-event:nth-child(even) {
|
||||
flex-direction: row !important;
|
||||
}
|
||||
|
||||
.customized-chronoline .ui-chronoline-event:nth-child(even) .ui-chronoline-event-content {
|
||||
text-align: left !important;
|
||||
}
|
||||
|
||||
.customized-chronoline .ui-chronoline-event-opposite {
|
||||
flex: 0;
|
||||
}
|
||||
|
||||
.customized-chronoline .ui-card {
|
||||
margin-top: 1rem;
|
||||
}
|
||||
}
|
||||
.floatlabel-demo .field {
|
||||
margin-top: 2rem;
|
||||
}
|
||||
|
||||
/**
|
||||
* prism.js Coy theme for JavaScript, CoffeeScript, CSS and HTML
|
||||
* Based on https://github.com/tshedor/workshop-wp-theme (Example: http://workshop.kansan.com/category/sessions/basics or http://workshop.timshedor.com/category/sessions/basics);
|
||||
* @author Tim Shedor
|
||||
*/
|
||||
code[class*=language-],
|
||||
pre[class*=language-] {
|
||||
color: black;
|
||||
background: none;
|
||||
font-family: Consolas, Monaco, "Andale Mono", "Ubuntu Mono", monospace;
|
||||
text-align: left;
|
||||
white-space: pre;
|
||||
word-spacing: normal;
|
||||
word-break: normal;
|
||||
word-wrap: normal;
|
||||
line-height: 1.5;
|
||||
-moz-tab-size: 4;
|
||||
-o-tab-size: 4;
|
||||
tab-size: 4;
|
||||
-webkit-hyphens: none;
|
||||
-moz-hyphens: none;
|
||||
-ms-hyphens: none;
|
||||
hyphens: none;
|
||||
}
|
||||
|
||||
/* Code blocks */
|
||||
pre[class*=language-] {
|
||||
position: relative;
|
||||
margin: 0.5em 0;
|
||||
overflow: visible;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
pre[class*=language-] > code {
|
||||
position: relative;
|
||||
border-left: 10px solid #358ccb;
|
||||
box-shadow: -1px 0px 0px 0px #358ccb, 0px 0px 0px 1px #dfdfdf;
|
||||
background-color: #fdfdfd;
|
||||
background-image: linear-gradient(transparent 50%, rgba(69, 142, 209, 0.04) 50%);
|
||||
background-size: 3em 3em;
|
||||
background-origin: content-box;
|
||||
background-attachment: local;
|
||||
}
|
||||
|
||||
code[class*=language] {
|
||||
max-height: inherit;
|
||||
padding: 0 1em;
|
||||
display: block;
|
||||
overflow: auto;
|
||||
}
|
||||
|
||||
/* Margin bottom to accomodate shadow */
|
||||
:not(pre) > code[class*=language-],
|
||||
pre[class*=language-] {
|
||||
background-color: #fdfdfd;
|
||||
-webkit-box-sizing: border-box;
|
||||
-moz-box-sizing: border-box;
|
||||
box-sizing: border-box;
|
||||
margin-bottom: 1em;
|
||||
}
|
||||
|
||||
/* Inline code */
|
||||
:not(pre) > code[class*=language-] {
|
||||
position: relative;
|
||||
padding: 0.2em;
|
||||
border-radius: 0.3em;
|
||||
color: #c92c2c;
|
||||
border: 1px solid rgba(0, 0, 0, 0.1);
|
||||
display: inline;
|
||||
white-space: normal;
|
||||
}
|
||||
|
||||
pre[class*=language-]:before,
|
||||
pre[class*=language-]:after {
|
||||
content: "";
|
||||
z-index: -2;
|
||||
display: block;
|
||||
position: absolute;
|
||||
bottom: 0.75em;
|
||||
left: 0.18em;
|
||||
width: 40%;
|
||||
height: 20%;
|
||||
max-height: 13em;
|
||||
box-shadow: 0px 13px 8px #979797;
|
||||
-webkit-transform: rotate(-2deg);
|
||||
-moz-transform: rotate(-2deg);
|
||||
-ms-transform: rotate(-2deg);
|
||||
-o-transform: rotate(-2deg);
|
||||
transform: rotate(-2deg);
|
||||
}
|
||||
|
||||
:not(pre) > code[class*=language-]:after,
|
||||
pre[class*=language-]:after {
|
||||
right: 0.75em;
|
||||
left: auto;
|
||||
-webkit-transform: rotate(2deg);
|
||||
-moz-transform: rotate(2deg);
|
||||
-ms-transform: rotate(2deg);
|
||||
-o-transform: rotate(2deg);
|
||||
transform: rotate(2deg);
|
||||
}
|
||||
|
||||
.token.comment,
|
||||
.token.block-comment,
|
||||
.token.prolog,
|
||||
.token.doctype,
|
||||
.token.cdata {
|
||||
color: #7D8B99;
|
||||
}
|
||||
|
||||
.token.punctuation {
|
||||
color: #5F6364;
|
||||
}
|
||||
|
||||
.token.property,
|
||||
.token.tag,
|
||||
.token.boolean,
|
||||
.token.number,
|
||||
.token.function-name,
|
||||
.token.constant,
|
||||
.token.symbol,
|
||||
.token.deleted {
|
||||
color: #c92c2c;
|
||||
}
|
||||
|
||||
.token.selector,
|
||||
.token.attr-name,
|
||||
.token.string,
|
||||
.token.char,
|
||||
.token.function,
|
||||
.token.builtin,
|
||||
.token.inserted {
|
||||
color: #2f9c0a;
|
||||
}
|
||||
|
||||
.token.operator,
|
||||
.token.entity,
|
||||
.token.url,
|
||||
.token.variable {
|
||||
color: #a67f59;
|
||||
background: rgba(255, 255, 255, 0.5);
|
||||
}
|
||||
|
||||
.token.atrule,
|
||||
.token.attr-value,
|
||||
.token.keyword,
|
||||
.token.class-name {
|
||||
color: #1990b8;
|
||||
}
|
||||
|
||||
.token.regex,
|
||||
.token.important {
|
||||
color: #e90;
|
||||
}
|
||||
|
||||
.language-css .token.string,
|
||||
.style .token.string {
|
||||
color: #a67f59;
|
||||
background: rgba(255, 255, 255, 0.5);
|
||||
}
|
||||
|
||||
.token.important {
|
||||
font-weight: normal;
|
||||
}
|
||||
|
||||
.token.bold {
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.token.italic {
|
||||
font-style: italic;
|
||||
}
|
||||
|
||||
.token.entity {
|
||||
cursor: help;
|
||||
}
|
||||
|
||||
.namespace {
|
||||
opacity: 0.7;
|
||||
}
|
||||
|
||||
@media screen and (max-width: 767px) {
|
||||
pre[class*=language-]:before,
|
||||
pre[class*=language-]:after {
|
||||
bottom: 14px;
|
||||
box-shadow: none;
|
||||
}
|
||||
}
|
||||
/* Plugin styles */
|
||||
.token.tab:not(:empty):before,
|
||||
.token.cr:before,
|
||||
.token.lf:before {
|
||||
color: #e0d7d1;
|
||||
}
|
||||
|
||||
/* Plugin styles: Line Numbers */
|
||||
pre[class*=language-].line-numbers {
|
||||
padding-left: 0;
|
||||
}
|
||||
|
||||
pre[class*=language-].line-numbers code {
|
||||
padding-left: 3.8em;
|
||||
}
|
||||
|
||||
pre[class*=language-].line-numbers .line-numbers-rows {
|
||||
left: 0;
|
||||
}
|
||||
|
||||
/* Plugin styles: Line Highlight */
|
||||
pre[class*=language-][data-line] {
|
||||
padding-top: 0;
|
||||
padding-bottom: 0;
|
||||
padding-left: 0;
|
||||
}
|
||||
|
||||
pre[data-line] code {
|
||||
position: relative;
|
||||
padding-left: 4em;
|
||||
}
|
||||
|
||||
pre .line-highlight {
|
||||
margin-top: 0;
|
||||
}
|
||||
|
||||
/* PrimeFaces styles */
|
||||
pre[class*=language-]:before, pre[class*=language-]:after {
|
||||
display: none !important;
|
||||
}
|
||||
pre[class*=language-] code {
|
||||
border-left: 6px solid var(--surface-border) !important;
|
||||
box-shadow: none !important;
|
||||
background: var(--surface-ground) !important;
|
||||
margin: 1em 0;
|
||||
color: var(--text-color);
|
||||
}
|
||||
|
||||
.language-css .token.string,
|
||||
.style .token.string {
|
||||
background: transparent;
|
||||
}
|
||||
|
||||
.block-section {
|
||||
margin-bottom: 4rem;
|
||||
}
|
||||
|
||||
.block-header {
|
||||
padding: 1rem 2rem;
|
||||
background-color: var(--surface-section);
|
||||
border-top-left-radius: 4px;
|
||||
border-top-right-radius: 4px;
|
||||
border: 1px solid var(--surface-d);
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
}
|
||||
.block-header .block-title {
|
||||
font-size: 1.25rem;
|
||||
font-weight: 600;
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
}
|
||||
.block-header .block-title .badge-free {
|
||||
border-radius: 4px;
|
||||
padding: 0.25rem 0.5rem;
|
||||
background-color: var(--orange-500);
|
||||
color: white;
|
||||
margin-left: 1rem;
|
||||
font-weight: 600;
|
||||
font-size: 0.875rem;
|
||||
}
|
||||
.block-header .block-title .badge-new {
|
||||
border-radius: 4px;
|
||||
padding: 0.25rem 0.5rem;
|
||||
background-color: var(--green-500);
|
||||
color: white;
|
||||
margin-left: 1rem;
|
||||
font-weight: 600;
|
||||
font-size: 0.875rem;
|
||||
}
|
||||
.block-header .block-actions {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
user-select: none;
|
||||
}
|
||||
.block-header .block-actions a {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
margin-right: 0.75rem;
|
||||
padding: 0.5rem 1rem;
|
||||
border-radius: 4px;
|
||||
border: 1px solid transparent;
|
||||
transition: background-color 0.2s;
|
||||
cursor: pointer;
|
||||
color: var(--text-color);
|
||||
}
|
||||
.block-header .block-actions a:last-child {
|
||||
margin-right: 0;
|
||||
}
|
||||
.block-header .block-actions a:not(.block-action-disabled):hover {
|
||||
background-color: var(--surface-c);
|
||||
}
|
||||
.block-header .block-actions a.block-action-active {
|
||||
border-color: var(--primary-color);
|
||||
color: var(--primary-color);
|
||||
}
|
||||
.block-header .block-actions a.block-action-copy i {
|
||||
color: var(--primary-color);
|
||||
font-size: 1.25rem;
|
||||
}
|
||||
.block-header .block-actions a.block-action-disabled {
|
||||
opacity: 0.6;
|
||||
pointer-events: none;
|
||||
cursor: auto !important;
|
||||
}
|
||||
.block-header .block-actions a .pi-lock {
|
||||
margin-right: 0.5rem;
|
||||
}
|
||||
|
||||
.block-content {
|
||||
padding: 0;
|
||||
border: 1px solid var(--surface-d);
|
||||
border-top: 0 none;
|
||||
}
|
||||
.block-content > div {
|
||||
display: none;
|
||||
}
|
||||
.block-content > div.block-content-active {
|
||||
display: block;
|
||||
}
|
||||
|
||||
.block-section pre[class*=language-] {
|
||||
margin: 0 !important;
|
||||
}
|
||||
.block-section pre[class*=language-]:before, .block-section pre[class*=language-]:after {
|
||||
display: none !important;
|
||||
}
|
||||
.block-section pre[class*=language-] code {
|
||||
border-left: 0 none !important;
|
||||
box-shadow: none !important;
|
||||
background: var(--surface-e) !important;
|
||||
margin: 0;
|
||||
color: var(--text-color);
|
||||
font-size: 14px;
|
||||
padding: 1.5rem 2rem !important;
|
||||
}
|
||||
|
||||
@media screen and (max-width: 575px) {
|
||||
.block-header {
|
||||
flex-direction: column;
|
||||
align-items: start;
|
||||
}
|
||||
.block-header .block-actions {
|
||||
margin-top: 1rem;
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,3 @@
|
||||
@import '../../sass/variables/layout/_layout_dark';
|
||||
@import './_demo_common';
|
||||
|
||||
@@ -0,0 +1,4 @@
|
||||
/* Demo CSS for Freya Theme - Non-demo mode */
|
||||
/* This file is loaded when guestPreferences.darkMode is false */
|
||||
|
||||
/* Empty file - no demo-specific styles needed */
|
||||
@@ -0,0 +1,734 @@
|
||||
.order-badge {
|
||||
border-radius: 2px;
|
||||
padding: 0.25em 0.5rem;
|
||||
text-transform: uppercase;
|
||||
font-weight: 700;
|
||||
font-size: 12px;
|
||||
letter-spacing: 0.3px;
|
||||
}
|
||||
.order-badge.order-delivered {
|
||||
background: #ACEBB4;
|
||||
color: #348861;
|
||||
}
|
||||
.order-badge.order-cancelled {
|
||||
background: #FABD9A;
|
||||
color: #AD342B;
|
||||
}
|
||||
.order-badge.order-pending {
|
||||
background: #F8D895;
|
||||
color: #A76927;
|
||||
}
|
||||
.order-badge.order-returned {
|
||||
background: #EFB8E5;
|
||||
color: #833F91;
|
||||
}
|
||||
|
||||
.product-badge {
|
||||
border-radius: 2px;
|
||||
padding: 0.25em 0.5rem;
|
||||
text-transform: uppercase;
|
||||
font-weight: 700;
|
||||
font-size: 12px;
|
||||
letter-spacing: 0.3px;
|
||||
text-align: center;
|
||||
}
|
||||
.product-badge.status-instock {
|
||||
background: #ACEBB4;
|
||||
color: #348861;
|
||||
}
|
||||
.product-badge.status-outofstock {
|
||||
background: #FABD9A;
|
||||
color: #AD342B;
|
||||
}
|
||||
.product-badge.status-lowstock {
|
||||
background: #F8D895;
|
||||
color: #A76927;
|
||||
}
|
||||
|
||||
.customer-badge {
|
||||
border-radius: 2px;
|
||||
padding: 0.25em 0.5rem;
|
||||
text-transform: uppercase;
|
||||
font-weight: 700;
|
||||
font-size: 12px;
|
||||
letter-spacing: 0.3px;
|
||||
}
|
||||
.customer-badge.status-qualified {
|
||||
background: #ACEBB4;
|
||||
color: #348861;
|
||||
}
|
||||
.customer-badge.status-unqualified {
|
||||
background: #FABD9A;
|
||||
color: #AD342B;
|
||||
}
|
||||
.customer-badge.status-negotiation {
|
||||
background: #F8D895;
|
||||
color: #A76927;
|
||||
}
|
||||
.customer-badge.status-new {
|
||||
background: #9BF2F7;
|
||||
color: #2B7AA4;
|
||||
}
|
||||
.customer-badge.status-renewal {
|
||||
background: #EFB8E5;
|
||||
color: #833F91;
|
||||
}
|
||||
.customer-badge.status-proposal {
|
||||
background: #FFD8B2;
|
||||
color: #805B36;
|
||||
}
|
||||
|
||||
.filter-container .ui-inputtext {
|
||||
width: 400px;
|
||||
}
|
||||
|
||||
.ui-selection-column {
|
||||
width: 2rem;
|
||||
}
|
||||
|
||||
@media (max-width: 640px) {
|
||||
.filter-container {
|
||||
width: 100%;
|
||||
margin-top: 0.5rem;
|
||||
}
|
||||
|
||||
.filter-container .ui-inputtext {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.ui-selection-column {
|
||||
width: auto;
|
||||
text-align: center;
|
||||
}
|
||||
.ui-selection-column .ui-column-title {
|
||||
display: none !important;
|
||||
}
|
||||
}
|
||||
.crud-demo .ui-datatable {
|
||||
margin-top: 1rem;
|
||||
}
|
||||
.crud-demo .product-image {
|
||||
width: 100px;
|
||||
box-shadow: 0 3px 6px rgba(0, 0, 0, 0.16), 0 3px 6px rgba(0, 0, 0, 0.23);
|
||||
}
|
||||
.crud-demo .ui-dialog .product-image {
|
||||
width: 250px;
|
||||
margin: 0 auto 2rem auto;
|
||||
display: block;
|
||||
}
|
||||
.crud-demo .ui-dialog-footer .ui-button {
|
||||
min-width: 6rem;
|
||||
}
|
||||
.crud-demo .ui-datatable .ui-column-filter {
|
||||
display: none;
|
||||
}
|
||||
.crud-demo .products-table-header {
|
||||
display: -ms-flexbox;
|
||||
display: flex;
|
||||
-ms-flex-align: center;
|
||||
align-items: center;
|
||||
-ms-flex-pack: justify;
|
||||
justify-content: space-between;
|
||||
-ms-flex-wrap: wrap;
|
||||
flex-wrap: wrap;
|
||||
}
|
||||
.crud-demo .edit-button.ui-button {
|
||||
margin-right: 0.5rem;
|
||||
}
|
||||
.crud-demo .orders-subtable {
|
||||
padding: 1rem;
|
||||
}
|
||||
.crud-demo .products-table > .ui-datatable-tablewrapper > table > thead > tr > th:nth-child(2) {
|
||||
width: 2rem;
|
||||
}
|
||||
.crud-demo .products-table .ui-rating {
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
@media (max-width: 640px) {
|
||||
.products-table > .ui-datatable-tablewrapper > table > thead > tr > th:nth-child(2) .ui-column-title,
|
||||
.products-table > .ui-datatable-tablewrapper > table > tbody > tr > td:nth-child(2) .ui-column-title {
|
||||
display: none !important;
|
||||
}
|
||||
|
||||
.products-buttonbar {
|
||||
-ms-flex-direction: column;
|
||||
flex-direction: column;
|
||||
}
|
||||
.products-buttonbar > div:last-child {
|
||||
margin-top: 0.5rem;
|
||||
}
|
||||
}
|
||||
.docs li {
|
||||
line-height: 1.5;
|
||||
}
|
||||
|
||||
.icons-demo .icons-list {
|
||||
text-align: center;
|
||||
color: rgba(41, 50, 65, 0.8);
|
||||
}
|
||||
.icons-demo .icons-list i {
|
||||
font-size: 1.5rem;
|
||||
margin-bottom: 0.5rem;
|
||||
}
|
||||
|
||||
.list-demo .product-name {
|
||||
font-size: 1.5rem;
|
||||
font-weight: 700;
|
||||
}
|
||||
.list-demo .product-description {
|
||||
margin: 0 0 1rem 0;
|
||||
}
|
||||
.list-demo .product-category-icon {
|
||||
vertical-align: middle;
|
||||
margin-right: 0.5rem;
|
||||
}
|
||||
.list-demo .product-category {
|
||||
font-weight: 600;
|
||||
vertical-align: middle;
|
||||
}
|
||||
.list-demo .product-list-item {
|
||||
display: -ms-flexbox;
|
||||
display: flex;
|
||||
-ms-flex-align: center;
|
||||
align-items: center;
|
||||
padding: 1rem;
|
||||
}
|
||||
.list-demo .product-list-item img {
|
||||
width: 150px;
|
||||
box-shadow: 0 3px 6px rgba(0, 0, 0, 0.16), 0 3px 6px rgba(0, 0, 0, 0.23);
|
||||
margin-right: 2rem;
|
||||
}
|
||||
.list-demo .product-list-item .product-list-detail {
|
||||
flex: 1 1 0;
|
||||
-ms-flex: 1 1 0px;
|
||||
}
|
||||
.list-demo .product-list-item .ui-rating {
|
||||
margin: 0 0 0.5rem 0;
|
||||
}
|
||||
.list-demo .product-list-item .product-price {
|
||||
font-size: 1.5rem;
|
||||
font-weight: 600;
|
||||
margin-bottom: 0.5rem;
|
||||
align-self: flex-end;
|
||||
}
|
||||
.list-demo .product-list-item .product-list-action {
|
||||
display: -ms-flexbox;
|
||||
display: flex;
|
||||
-ms-flex-direction: column;
|
||||
flex-direction: column;
|
||||
}
|
||||
.list-demo .product-list-item .ui-button {
|
||||
margin-bottom: 0.5rem;
|
||||
}
|
||||
.list-demo .product-grid-item {
|
||||
border: 1px solid #dee2e6;
|
||||
box-shadow: none;
|
||||
}
|
||||
.list-demo .product-grid-item .product-grid-item-top,
|
||||
.list-demo .product-grid-item .product-grid-item-bottom {
|
||||
display: -ms-flexbox;
|
||||
display: flex;
|
||||
-ms-flex-align: center;
|
||||
align-items: center;
|
||||
-ms-flex-pack: justify;
|
||||
justify-content: space-between;
|
||||
}
|
||||
.list-demo .product-grid-item img {
|
||||
width: 75%;
|
||||
box-shadow: 0 3px 6px rgba(0, 0, 0, 0.16), 0 3px 6px rgba(0, 0, 0, 0.23);
|
||||
margin: 2rem 0;
|
||||
}
|
||||
.list-demo .product-grid-item .product-grid-item-content {
|
||||
text-align: center;
|
||||
}
|
||||
.list-demo .product-grid-item .product-price {
|
||||
font-size: 1.5rem;
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
@media screen and (max-width: 576px) {
|
||||
.list-demo .product-list-item {
|
||||
-ms-flex-direction: column;
|
||||
flex-direction: column;
|
||||
-ms-flex-align: center;
|
||||
align-items: center;
|
||||
}
|
||||
.list-demo .product-list-item img {
|
||||
width: 75%;
|
||||
margin: 2rem 0;
|
||||
}
|
||||
.list-demo .product-list-item .product-list-detail {
|
||||
text-align: center;
|
||||
}
|
||||
.list-demo .product-list-item .product-price {
|
||||
align-self: center;
|
||||
}
|
||||
.list-demo .product-list-item .product-list-action {
|
||||
display: -ms-flexbox;
|
||||
display: flex;
|
||||
-ms-flex-direction: column;
|
||||
flex-direction: column;
|
||||
}
|
||||
.list-demo .product-list-item .product-list-action {
|
||||
margin-top: 2rem;
|
||||
-ms-flex-direction: row;
|
||||
flex-direction: row;
|
||||
-ms-flex-pack: justify;
|
||||
justify-content: space-between;
|
||||
-ms-flex-align: center;
|
||||
align-items: center;
|
||||
width: 100%;
|
||||
}
|
||||
}
|
||||
.messages-demo .ui-button.ui-widget {
|
||||
min-width: 6rem;
|
||||
}
|
||||
.messages-demo .field > label {
|
||||
width: 125px;
|
||||
}
|
||||
|
||||
.misc-demo .ui-button.ui-widget {
|
||||
min-width: 6rem;
|
||||
}
|
||||
.misc-demo .badges .ui-badge,
|
||||
.misc-demo .badges .ui-tag {
|
||||
margin-right: 0.5rem;
|
||||
}
|
||||
.misc-demo .ui-chip.custom-chip {
|
||||
background: var(--primary-color);
|
||||
color: var(--primary-color-text);
|
||||
}
|
||||
.misc-demo .custom-scrolltop {
|
||||
width: 2rem;
|
||||
height: 2rem;
|
||||
border-radius: 4px;
|
||||
background-color: var(--primary-color);
|
||||
}
|
||||
.misc-demo .custom-scrolltop:hover {
|
||||
background-color: var(--primary-color);
|
||||
}
|
||||
.misc-demo .custom-scrolltop .ui-scrolltop-icon {
|
||||
font-size: 1rem;
|
||||
color: var(--primary-color-text);
|
||||
}
|
||||
.misc-demo .custom-skeleton {
|
||||
border: 1px solid var(--surface-d);
|
||||
border-radius: 4px;
|
||||
}
|
||||
.misc-demo .custom-skeleton ul {
|
||||
list-style: none;
|
||||
}
|
||||
|
||||
.table-demo .ui-datatable .ui-column-filter {
|
||||
display: none;
|
||||
}
|
||||
.table-demo .customers-table-header {
|
||||
display: -ms-flexbox;
|
||||
display: flex;
|
||||
-ms-flex-align: center;
|
||||
align-items: center;
|
||||
-ms-flex-pack: justify;
|
||||
justify-content: space-between;
|
||||
-ms-flex-wrap: wrap;
|
||||
flex-wrap: wrap;
|
||||
}
|
||||
|
||||
@media (max-width: 640px) {
|
||||
.table-demo .ui-progressbar {
|
||||
margin-top: 0.5rem;
|
||||
}
|
||||
}
|
||||
.custom-marker {
|
||||
display: flex;
|
||||
width: 2rem;
|
||||
height: 2rem;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
color: #ffffff;
|
||||
border-radius: 50%;
|
||||
z-index: 1;
|
||||
}
|
||||
|
||||
.ui-chronoline-event-content,
|
||||
.ui-chronoline-event-opposite {
|
||||
line-height: 1;
|
||||
}
|
||||
|
||||
@media screen and (max-width: 960px) {
|
||||
.customized-chronoline .ui-chronoline-event:nth-child(even) {
|
||||
flex-direction: row !important;
|
||||
}
|
||||
|
||||
.customized-chronoline .ui-chronoline-event:nth-child(even) .ui-chronoline-event-content {
|
||||
text-align: left !important;
|
||||
}
|
||||
|
||||
.customized-chronoline .ui-chronoline-event-opposite {
|
||||
flex: 0;
|
||||
}
|
||||
|
||||
.customized-chronoline .ui-card {
|
||||
margin-top: 1rem;
|
||||
}
|
||||
}
|
||||
.floatlabel-demo .field {
|
||||
margin-top: 2rem;
|
||||
}
|
||||
|
||||
/**
|
||||
* prism.js Coy theme for JavaScript, CoffeeScript, CSS and HTML
|
||||
* Based on https://github.com/tshedor/workshop-wp-theme (Example: http://workshop.kansan.com/category/sessions/basics or http://workshop.timshedor.com/category/sessions/basics);
|
||||
* @author Tim Shedor
|
||||
*/
|
||||
code[class*=language-],
|
||||
pre[class*=language-] {
|
||||
color: black;
|
||||
background: none;
|
||||
font-family: Consolas, Monaco, "Andale Mono", "Ubuntu Mono", monospace;
|
||||
text-align: left;
|
||||
white-space: pre;
|
||||
word-spacing: normal;
|
||||
word-break: normal;
|
||||
word-wrap: normal;
|
||||
line-height: 1.5;
|
||||
-moz-tab-size: 4;
|
||||
-o-tab-size: 4;
|
||||
tab-size: 4;
|
||||
-webkit-hyphens: none;
|
||||
-moz-hyphens: none;
|
||||
-ms-hyphens: none;
|
||||
hyphens: none;
|
||||
}
|
||||
|
||||
/* Code blocks */
|
||||
pre[class*=language-] {
|
||||
position: relative;
|
||||
margin: 0.5em 0;
|
||||
overflow: visible;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
pre[class*=language-] > code {
|
||||
position: relative;
|
||||
border-left: 10px solid #358ccb;
|
||||
box-shadow: -1px 0px 0px 0px #358ccb, 0px 0px 0px 1px #dfdfdf;
|
||||
background-color: #fdfdfd;
|
||||
background-image: linear-gradient(transparent 50%, rgba(69, 142, 209, 0.04) 50%);
|
||||
background-size: 3em 3em;
|
||||
background-origin: content-box;
|
||||
background-attachment: local;
|
||||
}
|
||||
|
||||
code[class*=language] {
|
||||
max-height: inherit;
|
||||
padding: 0 1em;
|
||||
display: block;
|
||||
overflow: auto;
|
||||
}
|
||||
|
||||
/* Margin bottom to accomodate shadow */
|
||||
:not(pre) > code[class*=language-],
|
||||
pre[class*=language-] {
|
||||
background-color: #fdfdfd;
|
||||
-webkit-box-sizing: border-box;
|
||||
-moz-box-sizing: border-box;
|
||||
box-sizing: border-box;
|
||||
margin-bottom: 1em;
|
||||
}
|
||||
|
||||
/* Inline code */
|
||||
:not(pre) > code[class*=language-] {
|
||||
position: relative;
|
||||
padding: 0.2em;
|
||||
border-radius: 0.3em;
|
||||
color: #c92c2c;
|
||||
border: 1px solid rgba(0, 0, 0, 0.1);
|
||||
display: inline;
|
||||
white-space: normal;
|
||||
}
|
||||
|
||||
pre[class*=language-]:before,
|
||||
pre[class*=language-]:after {
|
||||
content: "";
|
||||
z-index: -2;
|
||||
display: block;
|
||||
position: absolute;
|
||||
bottom: 0.75em;
|
||||
left: 0.18em;
|
||||
width: 40%;
|
||||
height: 20%;
|
||||
max-height: 13em;
|
||||
box-shadow: 0px 13px 8px #979797;
|
||||
-webkit-transform: rotate(-2deg);
|
||||
-moz-transform: rotate(-2deg);
|
||||
-ms-transform: rotate(-2deg);
|
||||
-o-transform: rotate(-2deg);
|
||||
transform: rotate(-2deg);
|
||||
}
|
||||
|
||||
:not(pre) > code[class*=language-]:after,
|
||||
pre[class*=language-]:after {
|
||||
right: 0.75em;
|
||||
left: auto;
|
||||
-webkit-transform: rotate(2deg);
|
||||
-moz-transform: rotate(2deg);
|
||||
-ms-transform: rotate(2deg);
|
||||
-o-transform: rotate(2deg);
|
||||
transform: rotate(2deg);
|
||||
}
|
||||
|
||||
.token.comment,
|
||||
.token.block-comment,
|
||||
.token.prolog,
|
||||
.token.doctype,
|
||||
.token.cdata {
|
||||
color: #7D8B99;
|
||||
}
|
||||
|
||||
.token.punctuation {
|
||||
color: #5F6364;
|
||||
}
|
||||
|
||||
.token.property,
|
||||
.token.tag,
|
||||
.token.boolean,
|
||||
.token.number,
|
||||
.token.function-name,
|
||||
.token.constant,
|
||||
.token.symbol,
|
||||
.token.deleted {
|
||||
color: #c92c2c;
|
||||
}
|
||||
|
||||
.token.selector,
|
||||
.token.attr-name,
|
||||
.token.string,
|
||||
.token.char,
|
||||
.token.function,
|
||||
.token.builtin,
|
||||
.token.inserted {
|
||||
color: #2f9c0a;
|
||||
}
|
||||
|
||||
.token.operator,
|
||||
.token.entity,
|
||||
.token.url,
|
||||
.token.variable {
|
||||
color: #a67f59;
|
||||
background: rgba(255, 255, 255, 0.5);
|
||||
}
|
||||
|
||||
.token.atrule,
|
||||
.token.attr-value,
|
||||
.token.keyword,
|
||||
.token.class-name {
|
||||
color: #1990b8;
|
||||
}
|
||||
|
||||
.token.regex,
|
||||
.token.important {
|
||||
color: #e90;
|
||||
}
|
||||
|
||||
.language-css .token.string,
|
||||
.style .token.string {
|
||||
color: #a67f59;
|
||||
background: rgba(255, 255, 255, 0.5);
|
||||
}
|
||||
|
||||
.token.important {
|
||||
font-weight: normal;
|
||||
}
|
||||
|
||||
.token.bold {
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.token.italic {
|
||||
font-style: italic;
|
||||
}
|
||||
|
||||
.token.entity {
|
||||
cursor: help;
|
||||
}
|
||||
|
||||
.namespace {
|
||||
opacity: 0.7;
|
||||
}
|
||||
|
||||
@media screen and (max-width: 767px) {
|
||||
pre[class*=language-]:before,
|
||||
pre[class*=language-]:after {
|
||||
bottom: 14px;
|
||||
box-shadow: none;
|
||||
}
|
||||
}
|
||||
/* Plugin styles */
|
||||
.token.tab:not(:empty):before,
|
||||
.token.cr:before,
|
||||
.token.lf:before {
|
||||
color: #e0d7d1;
|
||||
}
|
||||
|
||||
/* Plugin styles: Line Numbers */
|
||||
pre[class*=language-].line-numbers {
|
||||
padding-left: 0;
|
||||
}
|
||||
|
||||
pre[class*=language-].line-numbers code {
|
||||
padding-left: 3.8em;
|
||||
}
|
||||
|
||||
pre[class*=language-].line-numbers .line-numbers-rows {
|
||||
left: 0;
|
||||
}
|
||||
|
||||
/* Plugin styles: Line Highlight */
|
||||
pre[class*=language-][data-line] {
|
||||
padding-top: 0;
|
||||
padding-bottom: 0;
|
||||
padding-left: 0;
|
||||
}
|
||||
|
||||
pre[data-line] code {
|
||||
position: relative;
|
||||
padding-left: 4em;
|
||||
}
|
||||
|
||||
pre .line-highlight {
|
||||
margin-top: 0;
|
||||
}
|
||||
|
||||
/* PrimeFaces styles */
|
||||
pre[class*=language-]:before, pre[class*=language-]:after {
|
||||
display: none !important;
|
||||
}
|
||||
pre[class*=language-] code {
|
||||
border-left: 6px solid var(--surface-border) !important;
|
||||
box-shadow: none !important;
|
||||
background: var(--surface-ground) !important;
|
||||
margin: 1em 0;
|
||||
color: var(--text-color);
|
||||
}
|
||||
|
||||
.language-css .token.string,
|
||||
.style .token.string {
|
||||
background: transparent;
|
||||
}
|
||||
|
||||
.block-section {
|
||||
margin-bottom: 4rem;
|
||||
}
|
||||
|
||||
.block-header {
|
||||
padding: 1rem 2rem;
|
||||
background-color: var(--surface-section);
|
||||
border-top-left-radius: 4px;
|
||||
border-top-right-radius: 4px;
|
||||
border: 1px solid var(--surface-d);
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
}
|
||||
.block-header .block-title {
|
||||
font-size: 1.25rem;
|
||||
font-weight: 600;
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
}
|
||||
.block-header .block-title .badge-free {
|
||||
border-radius: 4px;
|
||||
padding: 0.25rem 0.5rem;
|
||||
background-color: var(--orange-500);
|
||||
color: white;
|
||||
margin-left: 1rem;
|
||||
font-weight: 600;
|
||||
font-size: 0.875rem;
|
||||
}
|
||||
.block-header .block-title .badge-new {
|
||||
border-radius: 4px;
|
||||
padding: 0.25rem 0.5rem;
|
||||
background-color: var(--green-500);
|
||||
color: white;
|
||||
margin-left: 1rem;
|
||||
font-weight: 600;
|
||||
font-size: 0.875rem;
|
||||
}
|
||||
.block-header .block-actions {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
user-select: none;
|
||||
}
|
||||
.block-header .block-actions a {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
margin-right: 0.75rem;
|
||||
padding: 0.5rem 1rem;
|
||||
border-radius: 4px;
|
||||
border: 1px solid transparent;
|
||||
transition: background-color 0.2s;
|
||||
cursor: pointer;
|
||||
color: var(--text-color);
|
||||
}
|
||||
.block-header .block-actions a:last-child {
|
||||
margin-right: 0;
|
||||
}
|
||||
.block-header .block-actions a:not(.block-action-disabled):hover {
|
||||
background-color: var(--surface-c);
|
||||
}
|
||||
.block-header .block-actions a.block-action-active {
|
||||
border-color: var(--primary-color);
|
||||
color: var(--primary-color);
|
||||
}
|
||||
.block-header .block-actions a.block-action-copy i {
|
||||
color: var(--primary-color);
|
||||
font-size: 1.25rem;
|
||||
}
|
||||
.block-header .block-actions a.block-action-disabled {
|
||||
opacity: 0.6;
|
||||
pointer-events: none;
|
||||
cursor: auto !important;
|
||||
}
|
||||
.block-header .block-actions a .pi-lock {
|
||||
margin-right: 0.5rem;
|
||||
}
|
||||
|
||||
.block-content {
|
||||
padding: 0;
|
||||
border: 1px solid var(--surface-d);
|
||||
border-top: 0 none;
|
||||
}
|
||||
.block-content > div {
|
||||
display: none;
|
||||
}
|
||||
.block-content > div.block-content-active {
|
||||
display: block;
|
||||
}
|
||||
|
||||
.block-section pre[class*=language-] {
|
||||
margin: 0 !important;
|
||||
}
|
||||
.block-section pre[class*=language-]:before, .block-section pre[class*=language-]:after {
|
||||
display: none !important;
|
||||
}
|
||||
.block-section pre[class*=language-] code {
|
||||
border-left: 0 none !important;
|
||||
box-shadow: none !important;
|
||||
background: var(--surface-e) !important;
|
||||
margin: 0;
|
||||
color: var(--text-color);
|
||||
font-size: 14px;
|
||||
padding: 1.5rem 2rem !important;
|
||||
}
|
||||
|
||||
@media screen and (max-width: 575px) {
|
||||
.block-header {
|
||||
flex-direction: column;
|
||||
align-items: start;
|
||||
}
|
||||
.block-header .block-actions {
|
||||
margin-top: 1rem;
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,2 @@
|
||||
@import '../../sass/variables/layout/_layout_light';
|
||||
@import './_demo_common';
|
||||
@@ -0,0 +1,4 @@
|
||||
/* Demo CSS for Freya Theme - Demo mode */
|
||||
/* This file is loaded when guestPreferences.darkMode is true */
|
||||
|
||||
/* Empty file - no demo-specific styles needed */
|
||||
File diff suppressed because one or more lines are too long
Binary file not shown.
|
After Width: | Height: | Size: 54 KiB |
@@ -0,0 +1,133 @@
|
||||
.block-section {
|
||||
margin-bottom: 4rem;
|
||||
}
|
||||
|
||||
.block-header {
|
||||
padding: 1rem 2rem;
|
||||
background-color: var(--surface-section);
|
||||
border-top-left-radius: 4px;
|
||||
border-top-right-radius: 4px;
|
||||
border:1px solid var(--surface-d);
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
|
||||
.block-title {
|
||||
font-size: 1.25rem;
|
||||
font-weight: 600;
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
|
||||
.badge-free {
|
||||
border-radius: 4px;
|
||||
padding: .25rem .5rem;
|
||||
background-color: var(--orange-500);
|
||||
color: white;
|
||||
margin-left: 1rem;
|
||||
font-weight: 600;
|
||||
font-size: .875rem;
|
||||
}
|
||||
|
||||
.badge-new {
|
||||
border-radius: 4px;
|
||||
padding: .25rem .5rem;
|
||||
background-color: var(--green-500);
|
||||
color: white;
|
||||
margin-left: 1rem;
|
||||
font-weight: 600;
|
||||
font-size: .875rem;
|
||||
}
|
||||
}
|
||||
|
||||
.block-actions {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
user-select: none;
|
||||
|
||||
a {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
margin-right: .75rem;
|
||||
padding: .5rem 1rem;
|
||||
border-radius: 4px;
|
||||
border: 1px solid transparent;
|
||||
transition: background-color .2s;
|
||||
cursor: pointer;
|
||||
color: var(--text-color);
|
||||
|
||||
&:last-child {
|
||||
margin-right: 0;
|
||||
}
|
||||
|
||||
&:not(.block-action-disabled):hover {
|
||||
background-color: var(--surface-c);
|
||||
}
|
||||
|
||||
&.block-action-active {
|
||||
border-color: var(--primary-color);
|
||||
color: var(--primary-color);
|
||||
}
|
||||
|
||||
&.block-action-copy {
|
||||
i {
|
||||
color: var(--primary-color);
|
||||
font-size: 1.25rem;
|
||||
}
|
||||
}
|
||||
|
||||
&.block-action-disabled {
|
||||
opacity: .6;
|
||||
pointer-events: none;
|
||||
cursor: auto !important;
|
||||
}
|
||||
|
||||
.pi-lock {
|
||||
margin-right: .5rem;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.block-content {
|
||||
padding: 0;
|
||||
border:1px solid var(--surface-d);
|
||||
border-top: 0 none;
|
||||
|
||||
> div {
|
||||
display: none;
|
||||
|
||||
&.block-content-active {
|
||||
display: block;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.block-section pre[class*="language-"] {
|
||||
margin: 0 !important;
|
||||
|
||||
&:before, &:after {
|
||||
display: none !important;
|
||||
}
|
||||
|
||||
code {
|
||||
border-left: 0 none !important;
|
||||
box-shadow: none !important;
|
||||
background: var(--surface-e) !important;
|
||||
margin: 0;
|
||||
color: var(--text-color);
|
||||
font-size: 14px;
|
||||
padding: 1.5rem 2rem !important;
|
||||
}
|
||||
}
|
||||
|
||||
@media screen and (max-width: 575px) {
|
||||
.block-header {
|
||||
flex-direction: column;
|
||||
align-items: start;
|
||||
|
||||
.block-actions {
|
||||
margin-top: 1rem;
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,33 @@
|
||||
.custom-marker {
|
||||
display: flex;
|
||||
width: 2rem;
|
||||
height: 2rem;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
color: #ffffff;
|
||||
border-radius: 50%;
|
||||
z-index: 1;
|
||||
}
|
||||
|
||||
.ui-chronoline-event-content,
|
||||
.ui-chronoline-event-opposite {
|
||||
line-height: 1;
|
||||
}
|
||||
|
||||
@media screen and (max-width: 960px) {
|
||||
.customized-chronoline .ui-chronoline-event:nth-child(even) {
|
||||
flex-direction: row !important;
|
||||
}
|
||||
|
||||
.customized-chronoline .ui-chronoline-event:nth-child(even) .ui-chronoline-event-content {
|
||||
text-align: left !important;
|
||||
}
|
||||
|
||||
.customized-chronoline .ui-chronoline-event-opposite {
|
||||
flex: 0;
|
||||
}
|
||||
|
||||
.customized-chronoline .ui-card {
|
||||
margin-top: 1rem;
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,122 @@
|
||||
.order-badge {
|
||||
border-radius: 2px;
|
||||
padding: .25em .5rem;
|
||||
text-transform: uppercase;
|
||||
font-weight: 700;
|
||||
font-size: 12px;
|
||||
letter-spacing: .3px;
|
||||
|
||||
&.order-delivered {
|
||||
background: #ACEBB4;
|
||||
color: #348861;
|
||||
}
|
||||
|
||||
&.order-cancelled {
|
||||
background: #FABD9A;
|
||||
color:#AD342B;
|
||||
}
|
||||
|
||||
&.order-pending {
|
||||
background: #F8D895;
|
||||
color: #A76927;
|
||||
}
|
||||
|
||||
&.order-returned {
|
||||
background: #EFB8E5;
|
||||
color: #833F91;
|
||||
}
|
||||
}
|
||||
|
||||
.product-badge {
|
||||
border-radius: 2px;
|
||||
padding: .25em .5rem;
|
||||
text-transform: uppercase;
|
||||
font-weight: 700;
|
||||
font-size: 12px;
|
||||
letter-spacing: .3px;
|
||||
text-align: center;
|
||||
|
||||
&.status-instock {
|
||||
background: #ACEBB4;
|
||||
color: #348861;
|
||||
}
|
||||
|
||||
&.status-outofstock {
|
||||
background: #FABD9A;
|
||||
color:#AD342B;
|
||||
}
|
||||
|
||||
&.status-lowstock {
|
||||
background: #F8D895;
|
||||
color: #A76927;
|
||||
}
|
||||
}
|
||||
|
||||
.customer-badge {
|
||||
border-radius: 2px;
|
||||
padding: .25em .5rem;
|
||||
text-transform: uppercase;
|
||||
font-weight: 700;
|
||||
font-size: 12px;
|
||||
letter-spacing: .3px;
|
||||
|
||||
&.status-qualified {
|
||||
background: #ACEBB4;
|
||||
color: #348861;
|
||||
}
|
||||
|
||||
&.status-unqualified {
|
||||
background: #FABD9A;
|
||||
color:#AD342B;
|
||||
}
|
||||
|
||||
&.status-negotiation {
|
||||
background: #F8D895;
|
||||
color: #A76927;
|
||||
}
|
||||
|
||||
&.status-new {
|
||||
background: #9BF2F7;
|
||||
color: #2B7AA4;
|
||||
}
|
||||
|
||||
&.status-renewal {
|
||||
background: #EFB8E5;
|
||||
color: #833F91;
|
||||
}
|
||||
|
||||
&.status-proposal {
|
||||
background: #FFD8B2;
|
||||
color: #805B36;
|
||||
}
|
||||
}
|
||||
|
||||
.filter-container {
|
||||
.ui-inputtext {
|
||||
width: 400px;
|
||||
}
|
||||
}
|
||||
|
||||
.ui-selection-column {
|
||||
width: 2rem;
|
||||
}
|
||||
|
||||
@media (max-width: 640px) {
|
||||
.filter-container {
|
||||
width: 100%;
|
||||
margin-top: .5rem;
|
||||
}
|
||||
|
||||
.filter-container .ui-inputtext {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.ui-selection-column {
|
||||
width: auto;
|
||||
text-align: center;
|
||||
|
||||
.ui-column-title {
|
||||
display: none !important;
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,68 @@
|
||||
.crud-demo {
|
||||
.ui-datatable {
|
||||
margin-top: 1rem;
|
||||
}
|
||||
|
||||
.product-image {
|
||||
width: 100px;
|
||||
box-shadow: 0 3px 6px rgba(0, 0, 0, 0.16), 0 3px 6px rgba(0, 0, 0, 0.23);
|
||||
}
|
||||
|
||||
.ui-dialog .product-image {
|
||||
width: 250px;
|
||||
margin: 0 auto 2rem auto;
|
||||
display: block;
|
||||
}
|
||||
|
||||
.ui-dialog-footer .ui-button {
|
||||
min-width: 6rem;
|
||||
}
|
||||
|
||||
.ui-datatable .ui-column-filter {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.products-table-header {
|
||||
@include flex();
|
||||
@include flex-align-center();
|
||||
@include flex-justify-between();
|
||||
@include flex-wrap(wrap);
|
||||
}
|
||||
|
||||
.edit-button.ui-button {
|
||||
margin-right: .5rem;
|
||||
}
|
||||
|
||||
.orders-subtable {
|
||||
padding: 1rem;
|
||||
}
|
||||
|
||||
.products-table {
|
||||
> .ui-datatable-tablewrapper > table > thead > tr > th:nth-child(2) {
|
||||
width: 2rem;
|
||||
}
|
||||
|
||||
.ui-rating {
|
||||
display: inline-block;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 640px) {
|
||||
.products-table > .ui-datatable-tablewrapper > table > thead > tr > th:nth-child(2),
|
||||
.products-table > .ui-datatable-tablewrapper > table > tbody > tr > td:nth-child(2) {
|
||||
.ui-column-title {
|
||||
display: none !important;
|
||||
}
|
||||
}
|
||||
|
||||
.products-buttonbar {
|
||||
@include flex-direction-column();
|
||||
|
||||
> div {
|
||||
&:last-child {
|
||||
margin-top: .5rem;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,3 @@
|
||||
.docs li {
|
||||
line-height: 1.5;
|
||||
}
|
||||
@@ -0,0 +1,5 @@
|
||||
.floatlabel-demo {
|
||||
.field {
|
||||
margin-top: 2rem;
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,11 @@
|
||||
.icons-demo {
|
||||
.icons-list {
|
||||
text-align: center;
|
||||
color: $textShade200;
|
||||
}
|
||||
|
||||
.icons-list i {
|
||||
font-size: 1.5rem;
|
||||
margin-bottom: .5rem;
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,120 @@
|
||||
.list-demo {
|
||||
.product-name {
|
||||
font-size: 1.5rem;
|
||||
font-weight: 700;
|
||||
}
|
||||
|
||||
.product-description {
|
||||
margin: 0 0 1rem 0;
|
||||
}
|
||||
|
||||
.product-category-icon {
|
||||
vertical-align: middle;
|
||||
margin-right: .5rem;
|
||||
}
|
||||
|
||||
.product-category {
|
||||
font-weight: 600;
|
||||
vertical-align: middle;
|
||||
}
|
||||
|
||||
.product-list-item {
|
||||
@include flex();
|
||||
@include flex-align-center();
|
||||
padding: 1rem;
|
||||
|
||||
img {
|
||||
width: 150px;
|
||||
box-shadow: 0 3px 6px rgba(0, 0, 0, 0.16), 0 3px 6px rgba(0, 0, 0, 0.23);
|
||||
margin-right: 2rem;
|
||||
}
|
||||
|
||||
.product-list-detail {
|
||||
flex: 1 1 0;
|
||||
-ms-flex: 1 1 0px;
|
||||
}
|
||||
|
||||
.ui-rating {
|
||||
margin: 0 0 .5rem 0;
|
||||
}
|
||||
|
||||
.product-price {
|
||||
font-size: 1.5rem;
|
||||
font-weight: 600;
|
||||
margin-bottom: .5rem;
|
||||
align-self: flex-end;
|
||||
}
|
||||
|
||||
.product-list-action {
|
||||
@include flex();
|
||||
@include flex-direction-column();
|
||||
}
|
||||
|
||||
.ui-button {
|
||||
margin-bottom: .5rem;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
.product-grid-item {
|
||||
border: 1px solid $dividerColor;
|
||||
box-shadow: none;
|
||||
|
||||
.product-grid-item-top,
|
||||
.product-grid-item-bottom {
|
||||
@include flex();
|
||||
@include flex-align-center();
|
||||
@include flex-justify-between();
|
||||
}
|
||||
|
||||
img {
|
||||
width: 75%;
|
||||
box-shadow: 0 3px 6px rgba(0, 0, 0, 0.16), 0 3px 6px rgba(0, 0, 0, 0.23);
|
||||
margin: 2rem 0;
|
||||
}
|
||||
|
||||
.product-grid-item-content {
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.product-price {
|
||||
font-size: 1.5rem;
|
||||
font-weight: 600;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@media screen and (max-width: $phoneBreakpoint) {
|
||||
.list-demo {
|
||||
.product-list-item {
|
||||
@include flex-direction-column();
|
||||
@include flex-align-center();
|
||||
|
||||
img {
|
||||
width: 75%;
|
||||
margin: 2rem 0;
|
||||
}
|
||||
|
||||
.product-list-detail {
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.product-price {
|
||||
align-self: center;
|
||||
}
|
||||
|
||||
.product-list-action {
|
||||
@include flex();
|
||||
@include flex-direction-column();
|
||||
}
|
||||
|
||||
.product-list-action {
|
||||
margin-top: 2rem;
|
||||
@include flex-direction-row();
|
||||
@include flex-justify-between();
|
||||
@include flex-align-center();
|
||||
width: 100%;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,9 @@
|
||||
.messages-demo {
|
||||
.ui-button.ui-widget {
|
||||
min-width: 6rem;
|
||||
}
|
||||
|
||||
.field > label {
|
||||
width: 125px;
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,39 @@
|
||||
.misc-demo {
|
||||
.ui-button.ui-widget {
|
||||
min-width: 6rem;
|
||||
}
|
||||
|
||||
.badges .ui-badge,
|
||||
.badges .ui-tag {
|
||||
margin-right: .5rem;
|
||||
}
|
||||
|
||||
.ui-chip.custom-chip {
|
||||
background: var(--primary-color);
|
||||
color: var(--primary-color-text);
|
||||
}
|
||||
|
||||
.custom-scrolltop {
|
||||
width: 2rem;
|
||||
height: 2rem;
|
||||
border-radius: 4px;
|
||||
background-color: var(--primary-color);
|
||||
}
|
||||
.custom-scrolltop:hover {
|
||||
background-color: var(--primary-color);
|
||||
}
|
||||
|
||||
.custom-scrolltop .ui-scrolltop-icon {
|
||||
font-size: 1rem;
|
||||
color: var(--primary-color-text);
|
||||
}
|
||||
|
||||
.custom-skeleton {
|
||||
border: 1px solid var(--surface-d);
|
||||
border-radius: 4px;
|
||||
}
|
||||
|
||||
.custom-skeleton ul {
|
||||
list-style: none;
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,244 @@
|
||||
/**
|
||||
* prism.js Coy theme for JavaScript, CoffeeScript, CSS and HTML
|
||||
* Based on https://github.com/tshedor/workshop-wp-theme (Example: http://workshop.kansan.com/category/sessions/basics or http://workshop.timshedor.com/category/sessions/basics);
|
||||
* @author Tim Shedor
|
||||
*/
|
||||
|
||||
code[class*="language-"],
|
||||
pre[class*="language-"] {
|
||||
color: black;
|
||||
background: none;
|
||||
font-family: Consolas, Monaco, 'Andale Mono', 'Ubuntu Mono', monospace;
|
||||
text-align: left;
|
||||
white-space: pre;
|
||||
word-spacing: normal;
|
||||
word-break: normal;
|
||||
word-wrap: normal;
|
||||
line-height: 1.5;
|
||||
|
||||
-moz-tab-size: 4;
|
||||
-o-tab-size: 4;
|
||||
tab-size: 4;
|
||||
|
||||
-webkit-hyphens: none;
|
||||
-moz-hyphens: none;
|
||||
-ms-hyphens: none;
|
||||
hyphens: none;
|
||||
}
|
||||
|
||||
/* Code blocks */
|
||||
pre[class*="language-"] {
|
||||
position: relative;
|
||||
margin: .5em 0;
|
||||
overflow: visible;
|
||||
padding: 0;
|
||||
}
|
||||
pre[class*="language-"]>code {
|
||||
position: relative;
|
||||
border-left: 10px solid #358ccb;
|
||||
box-shadow: -1px 0px 0px 0px #358ccb, 0px 0px 0px 1px #dfdfdf;
|
||||
background-color: #fdfdfd;
|
||||
background-image: linear-gradient(transparent 50%, rgba(69, 142, 209, 0.04) 50%);
|
||||
background-size: 3em 3em;
|
||||
background-origin: content-box;
|
||||
background-attachment: local;
|
||||
}
|
||||
|
||||
code[class*="language"] {
|
||||
max-height: inherit;
|
||||
padding: 0 1em;
|
||||
display: block;
|
||||
overflow: auto;
|
||||
}
|
||||
|
||||
/* Margin bottom to accomodate shadow */
|
||||
:not(pre) > code[class*="language-"],
|
||||
pre[class*="language-"] {
|
||||
background-color: #fdfdfd;
|
||||
-webkit-box-sizing: border-box;
|
||||
-moz-box-sizing: border-box;
|
||||
box-sizing: border-box;
|
||||
margin-bottom: 1em;
|
||||
}
|
||||
|
||||
/* Inline code */
|
||||
:not(pre) > code[class*="language-"] {
|
||||
position: relative;
|
||||
padding: .2em;
|
||||
border-radius: 0.3em;
|
||||
color: #c92c2c;
|
||||
border: 1px solid rgba(0, 0, 0, 0.1);
|
||||
display: inline;
|
||||
white-space: normal;
|
||||
}
|
||||
|
||||
pre[class*="language-"]:before,
|
||||
pre[class*="language-"]:after {
|
||||
content: '';
|
||||
z-index: -2;
|
||||
display: block;
|
||||
position: absolute;
|
||||
bottom: 0.75em;
|
||||
left: 0.18em;
|
||||
width: 40%;
|
||||
height: 20%;
|
||||
max-height: 13em;
|
||||
box-shadow: 0px 13px 8px #979797;
|
||||
-webkit-transform: rotate(-2deg);
|
||||
-moz-transform: rotate(-2deg);
|
||||
-ms-transform: rotate(-2deg);
|
||||
-o-transform: rotate(-2deg);
|
||||
transform: rotate(-2deg);
|
||||
}
|
||||
|
||||
:not(pre) > code[class*="language-"]:after,
|
||||
pre[class*="language-"]:after {
|
||||
right: 0.75em;
|
||||
left: auto;
|
||||
-webkit-transform: rotate(2deg);
|
||||
-moz-transform: rotate(2deg);
|
||||
-ms-transform: rotate(2deg);
|
||||
-o-transform: rotate(2deg);
|
||||
transform: rotate(2deg);
|
||||
}
|
||||
|
||||
.token.comment,
|
||||
.token.block-comment,
|
||||
.token.prolog,
|
||||
.token.doctype,
|
||||
.token.cdata {
|
||||
color: #7D8B99;
|
||||
}
|
||||
|
||||
.token.punctuation {
|
||||
color: #5F6364;
|
||||
}
|
||||
|
||||
.token.property,
|
||||
.token.tag,
|
||||
.token.boolean,
|
||||
.token.number,
|
||||
.token.function-name,
|
||||
.token.constant,
|
||||
.token.symbol,
|
||||
.token.deleted {
|
||||
color: #c92c2c;
|
||||
}
|
||||
|
||||
.token.selector,
|
||||
.token.attr-name,
|
||||
.token.string,
|
||||
.token.char,
|
||||
.token.function,
|
||||
.token.builtin,
|
||||
.token.inserted {
|
||||
color: #2f9c0a;
|
||||
}
|
||||
|
||||
.token.operator,
|
||||
.token.entity,
|
||||
.token.url,
|
||||
.token.variable {
|
||||
color: #a67f59;
|
||||
background: rgba(255, 255, 255, 0.5);
|
||||
}
|
||||
|
||||
.token.atrule,
|
||||
.token.attr-value,
|
||||
.token.keyword,
|
||||
.token.class-name {
|
||||
color: #1990b8;
|
||||
}
|
||||
|
||||
.token.regex,
|
||||
.token.important {
|
||||
color: #e90;
|
||||
}
|
||||
|
||||
.language-css .token.string,
|
||||
.style .token.string {
|
||||
color: #a67f59;
|
||||
background: rgba(255, 255, 255, 0.5);
|
||||
}
|
||||
|
||||
.token.important {
|
||||
font-weight: normal;
|
||||
}
|
||||
|
||||
.token.bold {
|
||||
font-weight: bold;
|
||||
}
|
||||
.token.italic {
|
||||
font-style: italic;
|
||||
}
|
||||
|
||||
.token.entity {
|
||||
cursor: help;
|
||||
}
|
||||
|
||||
.namespace {
|
||||
opacity: .7;
|
||||
}
|
||||
|
||||
@media screen and (max-width: 767px) {
|
||||
pre[class*="language-"]:before,
|
||||
pre[class*="language-"]:after {
|
||||
bottom: 14px;
|
||||
box-shadow: none;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
/* Plugin styles */
|
||||
.token.tab:not(:empty):before,
|
||||
.token.cr:before,
|
||||
.token.lf:before {
|
||||
color: #e0d7d1;
|
||||
}
|
||||
|
||||
/* Plugin styles: Line Numbers */
|
||||
pre[class*="language-"].line-numbers {
|
||||
padding-left: 0;
|
||||
}
|
||||
|
||||
pre[class*="language-"].line-numbers code {
|
||||
padding-left: 3.8em;
|
||||
}
|
||||
|
||||
pre[class*="language-"].line-numbers .line-numbers-rows {
|
||||
left: 0;
|
||||
}
|
||||
|
||||
/* Plugin styles: Line Highlight */
|
||||
pre[class*="language-"][data-line] {
|
||||
padding-top: 0;
|
||||
padding-bottom: 0;
|
||||
padding-left: 0;
|
||||
}
|
||||
pre[data-line] code {
|
||||
position: relative;
|
||||
padding-left: 4em;
|
||||
}
|
||||
pre .line-highlight {
|
||||
margin-top: 0;
|
||||
}
|
||||
|
||||
/* PrimeFaces styles */
|
||||
pre[class*="language-"] {
|
||||
&:before, &:after {
|
||||
display: none !important;
|
||||
}
|
||||
|
||||
code {
|
||||
border-left: 6px solid var(--surface-border) !important;
|
||||
box-shadow: none !important;
|
||||
background: var(--surface-ground) !important;
|
||||
margin: 1em 0;
|
||||
color: var(--text-color);
|
||||
}
|
||||
}
|
||||
|
||||
.language-css .token.string,
|
||||
.style .token.string {
|
||||
background: transparent;
|
||||
}
|
||||
@@ -0,0 +1,21 @@
|
||||
.table-demo {
|
||||
.ui-datatable .ui-column-filter {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.customers-table-header {
|
||||
@include flex();
|
||||
@include flex-align-center();
|
||||
@include flex-justify-between();
|
||||
@include flex-wrap(wrap);
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
@media (max-width: 640px) {
|
||||
.table-demo {
|
||||
.ui-progressbar {
|
||||
margin-top: .5rem;
|
||||
}
|
||||
}
|
||||
}
|
||||
Binary file not shown.
|
After Width: | Height: | Size: 5.1 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 5.5 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 5.5 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 5.7 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 5.5 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 5.6 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 5.9 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 5.3 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 7.9 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 5.1 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 5.9 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 640 KiB |
@@ -0,0 +1,3 @@
|
||||
<svg width="48" height="50" viewBox="0 0 48 50" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path fill-rule="evenodd" clip-rule="evenodd" d="M33.1548 9.65956L23.9913 4.86169L5.54723 14.5106L0.924465 12.0851L23.9913 0L37.801 7.23403L33.1548 9.65956ZM23.9931 19.3085L42.4255 9.65955L47.0717 12.0851L23.9931 24.1595L10.1952 16.9361L14.8297 14.5106L23.9931 19.3085ZM4.6345 25.8937L0 23.4681V37.9149L23.0669 50V45.1489L4.6345 35.4894V25.8937ZM18.4324 28.2658L0 18.6169V13.7658L23.0669 25.8403V40.2977L18.4324 37.8615V28.2658ZM38.7301 23.468V18.6169L24.9205 25.8403V49.9999L29.555 47.5743V28.2659L38.7301 23.468ZM43.3546 35.4892V16.1914L48.0008 13.7659V37.9148L34.1912 45.1488V40.2977L43.3546 35.4892Z" fill="#616161"/>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 724 B |
Binary file not shown.
|
After Width: | Height: | Size: 6.5 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 8.2 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 9.7 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 8.3 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 4.9 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 13 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 5.9 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 5.6 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 10 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 8.0 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 86 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 50 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 2.2 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 2.0 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 2.5 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 1.5 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 1.4 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 2.3 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 2.2 KiB |
@@ -0,0 +1,10 @@
|
||||
<svg width="40" height="25" viewBox="0 0 40 25" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path opacity="0.24" d="M1.29792 7.19167L1 6V22.5H39V10L31.0058 8.00144C29.7332 7.68329 28.385 7.93926 27.3176 8.70171C26.307 9.42357 24.905 9.20661 24.1598 8.21307L23.3663 7.15513C22.2505 5.66735 19.9745 5.81442 19.0594 7.43342L16.9744 11.1223C15.8341 13.1397 12.9726 13.2599 11.6672 11.3452L9.13511 7.6315C8.13791 6.16893 5.96075 6.23208 5.05 7.75C4.10899 9.31835 1.74152 8.96606 1.29792 7.19167Z" fill="url(#paint0_linear)"/>
|
||||
<path d="M1 5.5L2.30163 7.45245C3.07138 8.60707 4.79369 8.52601 5.45158 7.3042V7.3042C6.29848 5.7314 8.57565 5.79473 9.33383 7.41216L11.7817 12.6344C12.9342 15.0929 16.5016 14.8701 17.3392 12.2874L19.1806 6.60989C19.7963 4.71144 22.4491 4.62269 23.1903 6.47575L23.7857 7.96427C24.3436 9.35899 26.1742 9.67901 27.1722 8.55628V8.55628C28.271 7.32013 30.0227 6.89771 31.5641 7.49717L38 10" stroke="#FF6E49" stroke-width="2" stroke-linecap="round"/>
|
||||
<defs>
|
||||
<linearGradient id="paint0_linear" x1="20" y1="0.916666" x2="20" y2="22.5" gradientUnits="userSpaceOnUse">
|
||||
<stop stop-color="#FF6E49"/>
|
||||
<stop offset="1" stop-color="#FF6E49" stop-opacity="0"/>
|
||||
</linearGradient>
|
||||
</defs>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 1.2 KiB |
@@ -0,0 +1,10 @@
|
||||
<svg width="40" height="25" viewBox="0 0 40 25" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M1.5 17.5L2.61594 16.0935C2.89864 15.7372 3.11605 15.3337 3.25811 14.9016V14.9016C4.62276 10.751 10.4817 10.7159 11.896 14.8499L12.0376 15.2639C12.8063 17.5107 15.8592 17.8152 17.0564 15.7644L17.808 14.4769C18.6475 13.0389 20.7151 13.0096 21.595 14.4232V14.4232C23.12 16.8732 26.8677 16.1197 27.3273 13.2706L27.4426 12.5553C28.0267 8.93415 31.4344 6.47111 35.0561 7.05252L38.9999 7.68568" stroke="#34B56F" stroke-width="2" stroke-linecap="round"/>
|
||||
<path opacity="0.24" d="M1.22063 15.8556H1V24H39V7.79791L36.58 7.57075C32.8978 7.22509 29.3686 9.12608 27.6312 12.391L27.2225 13.1589C26.0647 15.3346 23.2201 15.9323 21.2845 14.4066C20.2445 13.5868 18.7724 13.6075 17.7558 14.4563L16.7423 15.3025C15.3507 16.4644 13.3122 16.4104 11.9841 15.1764L10.5529 13.8466C8.67288 12.0998 5.69554 12.3584 4.14481 14.4032C3.45096 15.3181 2.36889 15.8556 1.22063 15.8556Z" fill="url(#paint0_linear)"/>
|
||||
<defs>
|
||||
<linearGradient id="paint0_linear" x1="20" y1="3" x2="20" y2="24" gradientUnits="userSpaceOnUse">
|
||||
<stop stop-color="#34B56F"/>
|
||||
<stop offset="1" stop-color="#34B56F" stop-opacity="0"/>
|
||||
</linearGradient>
|
||||
</defs>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 1.2 KiB |
@@ -0,0 +1,10 @@
|
||||
<svg width="40" height="25" viewBox="0 0 40 25" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M1 15.5548H1.23597C2.37626 15.5548 3.45256 15.0279 4.15193 14.1273V14.1273C5.71061 12.1201 8.64807 11.8644 10.5301 13.5722L11.77 14.6973C13.1787 15.9756 15.3518 15.8893 16.6547 14.5033L18.1143 12.9507C19.0066 12.0015 20.4515 11.8297 21.5415 12.5432L22.1333 12.9306C24.0689 14.1975 26.6736 13.134 27.1693 10.8744V10.8744C28.0559 6.83281 32.4564 4.65092 36.2101 6.3918L39 7.68568" stroke="#34B56F" stroke-width="2" stroke-linecap="round"/>
|
||||
<path opacity="0.24" d="M1.22063 15.8556H1V24H39V7.79791L36.3382 6.53389C32.5394 4.72988 28.0519 6.94315 27.1709 11.0553C26.6781 13.3557 24.0188 14.4322 22.0646 13.1223L21.5496 12.7772C20.4609 12.0475 19.0025 12.2216 18.1161 13.1871L16.6508 14.7832C15.359 16.1902 13.1688 16.2772 11.7695 14.977L10.5529 13.8466C8.67288 12.0998 5.69554 12.3584 4.14481 14.4032C3.45096 15.3181 2.36889 15.8556 1.22063 15.8556Z" fill="url(#paint0_linear)"/>
|
||||
<defs>
|
||||
<linearGradient id="paint0_linear" x1="20" y1="-1.94118" x2="20" y2="24" gradientUnits="userSpaceOnUse">
|
||||
<stop stop-color="#34B56F"/>
|
||||
<stop offset="1" stop-color="#34B56F" stop-opacity="0"/>
|
||||
</linearGradient>
|
||||
</defs>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 1.2 KiB |
@@ -0,0 +1,10 @@
|
||||
<svg width="40" height="25" viewBox="0 0 40 25" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path opacity="0.24" d="M1.5789 7H1V23.5H39V16.5L31.0118 10.1094C29.8216 9.15729 28.1438 9.11157 26.9035 9.99748C26.1264 10.5525 25.0472 10.3774 24.4855 9.60509L23.2844 7.95357C22.3354 6.64863 20.4592 6.46643 19.2768 7.56437L18.0016 8.74848C16.0093 10.5985 12.9435 10.651 10.889 8.87043L9.88848 8.00335C8.09796 6.45157 5.62163 5.95946 3.37384 6.70872C2.79506 6.90165 2.18897 7 1.5789 7Z" fill="url(#paint0_linear)"/>
|
||||
<path d="M1 6.5L1.99872 6.89949C2.931 7.2724 3.99026 7.1323 4.79354 6.52984V6.52984C6.29049 5.40713 8.41325 5.7049 9.54353 7.19614L11.4476 9.70832C13.2488 12.0847 16.947 11.6203 18.1047 8.87239L18.8423 7.12161C19.6342 5.2418 22.3065 5.26616 23.064 7.16009L24.0208 9.55204C24.4707 10.6767 25.9469 10.9348 26.7516 10.0294V10.0294C27.9714 8.65716 30.0948 8.59476 31.393 9.89304L38 16.5" stroke="#FF6E49" stroke-width="2" stroke-linecap="round"/>
|
||||
<defs>
|
||||
<linearGradient id="paint0_linear" x1="20" y1="2.5" x2="20" y2="23.5" gradientUnits="userSpaceOnUse">
|
||||
<stop stop-color="#FF6E49"/>
|
||||
<stop offset="1" stop-color="#FF6E49" stop-opacity="0"/>
|
||||
</linearGradient>
|
||||
</defs>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 1.2 KiB |
@@ -0,0 +1,10 @@
|
||||
<svg width="40" height="25" viewBox="0 0 40 25" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M1.5 17.5L2.61594 16.0935C2.89864 15.7372 3.11605 15.3337 3.25811 14.9016L3.64455 13.7262C4.88488 9.95375 10.2101 9.92187 11.4955 13.6792V13.6792C12.268 15.9373 15.4878 15.8603 16.1514 13.5678L17.9064 7.50493C18.4835 5.51127 21.1961 5.23809 22.1591 7.07664L23.5714 9.77282C24.1796 10.9338 25.8382 10.9433 26.4595 9.78932V9.78932C27.4765 7.90073 30.0264 7.52648 31.5432 9.04321L38.0548 15.5548" stroke="#FFA928" stroke-width="2" stroke-linecap="round"/>
|
||||
<path opacity="0.24" d="M2.34135 16.4205L1 17.5V24H39V15.8556L32.0945 10.1454C30.5339 8.85496 28.3365 8.66805 26.5804 9.67639C25.6401 10.2163 24.458 10.0829 23.6617 9.34683L22.6111 8.37567C21.0637 6.94535 18.5742 7.41753 17.6579 9.3151L16.1994 12.3359C15.3283 14.1401 13.0085 14.6706 11.4397 13.4243C8.86141 11.376 5.0487 12.1685 3.47541 15.0612C3.1912 15.5838 2.80478 16.0476 2.34135 16.4205Z" fill="url(#paint0_linear)"/>
|
||||
<defs>
|
||||
<linearGradient id="paint0_linear" x1="20" y1="3" x2="20" y2="24" gradientUnits="userSpaceOnUse">
|
||||
<stop stop-color="#FFA928"/>
|
||||
<stop offset="1" stop-color="#FFA928" stop-opacity="0"/>
|
||||
</linearGradient>
|
||||
</defs>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 1.2 KiB |
@@ -0,0 +1,9 @@
|
||||
<svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path fill-rule="evenodd" clip-rule="evenodd" d="M4 0C1.79086 0 0 1.79086 0 4V16C0 18.2091 1.79086 20 4 20H16C18.2091 20 20 18.2091 20 16V4C20 1.79086 18.2091 0 16 0H4ZM5.33337 9.33332C5.33337 8.59694 5.93033 7.99999 6.66671 7.99999C7.40309 7.99999 8.00004 8.59694 8.00004 9.33332V10.6667C8.00004 11.403 7.40309 12 6.66671 12C5.93033 12 5.33337 11.403 5.33337 10.6667V9.33332ZM11.9999 9.33332C11.9999 8.59694 12.5969 7.99999 13.3333 7.99999C14.0697 7.99999 14.6666 8.59694 14.6666 9.33332V10.6667C14.6666 11.403 14.0697 12 13.3333 12C12.5969 12 11.9999 11.403 11.9999 10.6667V9.33332Z" fill="url(#paint0_linear)"/>
|
||||
<defs>
|
||||
<linearGradient id="paint0_linear" x1="10" y1="10" x2="10" y2="20" gradientUnits="userSpaceOnUse">
|
||||
<stop stop-color="#5E3DE4"/>
|
||||
<stop offset="1" stop-color="#169BE6"/>
|
||||
</linearGradient>
|
||||
</defs>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 919 B |
Binary file not shown.
|
After Width: | Height: | Size: 85 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 83 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 2.0 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 63 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 1.6 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 85 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 1.5 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 102 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 2.0 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 122 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 2.0 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 109 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 2.6 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 2.5 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 93 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 1.5 KiB |
Some files were not shown because too many files have changed in this diff Show More
Reference in New Issue
Block a user