📷 update pictures
|
|
@ -1,7 +1,10 @@
|
|||
import React from "react"
|
||||
import PropTypes from "prop-types"
|
||||
import { Link } from "gatsby"
|
||||
|
||||
const CourseItem = ({ title, price, description, image }) => {
|
||||
import * as ROUTES from "../global/routes"
|
||||
|
||||
const CourseItem = ({ title, price, description, image, slug }) => {
|
||||
return (
|
||||
<div className="col-lg-4 col-md-6 d-flex align-items-stretch">
|
||||
<div className="course-item">
|
||||
|
|
@ -13,7 +16,7 @@ const CourseItem = ({ title, price, description, image }) => {
|
|||
</div>
|
||||
|
||||
<h3>
|
||||
<a href="course-details.html">{title}</a>
|
||||
<Link to={`${ROUTES.COURSES}/${slug}`}>{title}</Link>
|
||||
</h3>
|
||||
<p>{description}</p>
|
||||
</div>
|
||||
|
|
@ -26,6 +29,7 @@ export default CourseItem
|
|||
|
||||
CourseItem.propTypes = {
|
||||
title: PropTypes.string.isRequired,
|
||||
slug: PropTypes.string.isRequired,
|
||||
price: PropTypes.number.isRequired,
|
||||
description: PropTypes.string.isRequired,
|
||||
image: PropTypes.node.isRequired,
|
||||
|
|
|
|||
|
|
@ -8,7 +8,8 @@ import img3 from "../static/img/course-3.jpg"
|
|||
|
||||
const data = [
|
||||
{
|
||||
title: "Garderie",
|
||||
title: "Primaire",
|
||||
slug: "primaire",
|
||||
price: 10,
|
||||
description:
|
||||
"Lorem ipsum dolor sit amet consectetur adipisicing elit. Esse necessitatibus sunt, porro animi vel officiis?",
|
||||
|
|
@ -16,6 +17,7 @@ const data = [
|
|||
},
|
||||
{
|
||||
title: "Collège",
|
||||
slug: "college",
|
||||
price: 15,
|
||||
description:
|
||||
"Lorem ipsum dolor sit amet consectetur adipisicing elit. Esse necessitatibus sunt, porro animi vel officiis?",
|
||||
|
|
@ -23,6 +25,7 @@ const data = [
|
|||
},
|
||||
{
|
||||
title: "Lycée",
|
||||
slug: "lycee",
|
||||
price: 18,
|
||||
description:
|
||||
"Lorem ipsum dolor sit amet consectetur adipisicing elit. Esse necessitatibus sunt, porro animi vel officiis?",
|
||||
|
|
|
|||
|
|
@ -48,10 +48,6 @@ const Footer = ({ siteTitle }) => (
|
|||
<div className="col-lg-3 col-md-6 footer-links">
|
||||
<h4>Nos niveaux</h4>
|
||||
<ul>
|
||||
<li>
|
||||
<i className="bx bx-chevron-right"></i>{" "}
|
||||
<Link to={ROUTES.GARDERIE}>Garderie</Link>
|
||||
</li>
|
||||
<li>
|
||||
<i className="bx bx-chevron-right"></i>{" "}
|
||||
<Link to={ROUTES.PRIMAIRE}>Primaire</Link>
|
||||
|
|
@ -64,6 +60,10 @@ const Footer = ({ siteTitle }) => (
|
|||
<i className="bx bx-chevron-right"></i>{" "}
|
||||
<Link to={ROUTES.LYCEE}>Lycée</Link>
|
||||
</li>
|
||||
<li>
|
||||
<i className="bx bx-chevron-right"></i>{" "}
|
||||
<Link to={ROUTES.ATELIER}>Ateliers</Link>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
|
|
|
|||
|
|
@ -4,7 +4,7 @@ export const A_PROPOS = "/a-propos"
|
|||
export const CONTACT = "/contact"
|
||||
export const CALENDAR = "/calendrier"
|
||||
export const LEGAL = "/legal"
|
||||
export const GARDERIE = COURSES + "/garderie"
|
||||
export const ATELIER = COURSES + "/ateliers"
|
||||
export const PRIMAIRE = COURSES + "/primaire"
|
||||
export const COLLEGE = COURSES + "/college"
|
||||
export const LYCEE = COURSES + "/lycee"
|
||||
|
|
|
|||
|
Before Width: | Height: | Size: 90 KiB After Width: | Height: | Size: 114 KiB |
|
|
@ -1,12 +1,5 @@
|
|||
/**
|
||||
* Template Name: Mentor - v2.1.0
|
||||
* Template URL: https://bootstrapmade.com/mentor-free-education-bootstrap-theme/
|
||||
* Author: BootstrapMade.com
|
||||
* License: https://bootstrapmade.com/license/
|
||||
*/
|
||||
|
||||
/*--------------------------------------------------------------
|
||||
# General
|
||||
/*--------------------------------------------------------------
|
||||
# General
|
||||
--------------------------------------------------------------*/
|
||||
body {
|
||||
font-family: "Open Sans", sans-serif;
|
||||
|
|
@ -22,12 +15,17 @@ a:hover {
|
|||
text-decoration: none;
|
||||
}
|
||||
|
||||
h1, h2, h3, h4, h5, h6 {
|
||||
h1,
|
||||
h2,
|
||||
h3,
|
||||
h4,
|
||||
h5,
|
||||
h6 {
|
||||
font-family: "Raleway", sans-serif;
|
||||
}
|
||||
|
||||
/*--------------------------------------------------------------
|
||||
# Back to top button
|
||||
/*--------------------------------------------------------------
|
||||
# Back to top button
|
||||
--------------------------------------------------------------*/
|
||||
.back-to-top {
|
||||
position: fixed;
|
||||
|
|
@ -55,8 +53,8 @@ h1, h2, h3, h4, h5, h6 {
|
|||
color: #fff;
|
||||
}
|
||||
|
||||
/*--------------------------------------------------------------
|
||||
# Preloader
|
||||
/*--------------------------------------------------------------
|
||||
# Preloader
|
||||
--------------------------------------------------------------*/
|
||||
#preloader {
|
||||
position: fixed;
|
||||
|
|
@ -102,8 +100,8 @@ h1, h2, h3, h4, h5, h6 {
|
|||
}
|
||||
}
|
||||
|
||||
/*--------------------------------------------------------------
|
||||
# Disable aos animation delay on mobile devices
|
||||
/*--------------------------------------------------------------
|
||||
# Disable aos animation delay on mobile devices
|
||||
--------------------------------------------------------------*/
|
||||
@media screen and (max-width: 768px) {
|
||||
[data-aos-delay] {
|
||||
|
|
@ -111,8 +109,8 @@ h1, h2, h3, h4, h5, h6 {
|
|||
}
|
||||
}
|
||||
|
||||
/*--------------------------------------------------------------
|
||||
# Header
|
||||
/*--------------------------------------------------------------
|
||||
# Header
|
||||
--------------------------------------------------------------*/
|
||||
#header {
|
||||
background: #fff;
|
||||
|
|
@ -147,8 +145,8 @@ h1, h2, h3, h4, h5, h6 {
|
|||
}
|
||||
}
|
||||
|
||||
/*--------------------------------------------------------------
|
||||
# Navigation Menu
|
||||
/*--------------------------------------------------------------
|
||||
# Navigation Menu
|
||||
--------------------------------------------------------------*/
|
||||
/* Desktop Navigation */
|
||||
.nav-menu ul {
|
||||
|
|
@ -177,7 +175,9 @@ h1, h2, h3, h4, h5, h6 {
|
|||
font-weight: 500;
|
||||
}
|
||||
|
||||
.nav-menu a:hover, .nav-menu .active > a, .nav-menu li:hover > a {
|
||||
.nav-menu a:hover,
|
||||
.nav-menu .active > a,
|
||||
.nav-menu li:hover > a {
|
||||
color: #5fcf80;
|
||||
}
|
||||
|
||||
|
|
@ -215,7 +215,9 @@ h1, h2, h3, h4, h5, h6 {
|
|||
color: #37423b;
|
||||
}
|
||||
|
||||
.nav-menu .drop-down ul a:hover, .nav-menu .drop-down ul .active > a, .nav-menu .drop-down ul li:hover > a {
|
||||
.nav-menu .drop-down ul a:hover,
|
||||
.nav-menu .drop-down ul .active > a,
|
||||
.nav-menu .drop-down ul li:hover > a {
|
||||
color: #5fcf80;
|
||||
}
|
||||
|
||||
|
|
@ -335,7 +337,9 @@ h1, h2, h3, h4, h5, h6 {
|
|||
outline: none;
|
||||
}
|
||||
|
||||
.mobile-nav a:hover, .mobile-nav .active > a, .mobile-nav li:hover > a {
|
||||
.mobile-nav a:hover,
|
||||
.mobile-nav .active > a,
|
||||
.mobile-nav li:hover > a {
|
||||
color: #5fcf80;
|
||||
text-decoration: none;
|
||||
}
|
||||
|
|
@ -391,13 +395,13 @@ h1, h2, h3, h4, h5, h6 {
|
|||
color: #fff;
|
||||
}
|
||||
|
||||
/*--------------------------------------------------------------
|
||||
# Hero Section
|
||||
/*--------------------------------------------------------------
|
||||
# Hero Section
|
||||
--------------------------------------------------------------*/
|
||||
#hero {
|
||||
width: 100%;
|
||||
height: 80vh;
|
||||
background: url("../img/hero-bg.jpg") top center;
|
||||
background: url("../img/hero-bg.jpg") center;
|
||||
background-size: cover;
|
||||
position: relative;
|
||||
}
|
||||
|
|
@ -476,8 +480,8 @@ h1, h2, h3, h4, h5, h6 {
|
|||
}
|
||||
}
|
||||
|
||||
/*--------------------------------------------------------------
|
||||
# Sections General
|
||||
/*--------------------------------------------------------------
|
||||
# Sections General
|
||||
--------------------------------------------------------------*/
|
||||
section {
|
||||
padding: 60px 0;
|
||||
|
|
@ -547,8 +551,8 @@ section {
|
|||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
/*--------------------------------------------------------------
|
||||
# About
|
||||
/*--------------------------------------------------------------
|
||||
# About
|
||||
--------------------------------------------------------------*/
|
||||
.about .content h3 {
|
||||
font-weight: 600;
|
||||
|
|
@ -593,8 +597,8 @@ section {
|
|||
}
|
||||
}
|
||||
|
||||
/*--------------------------------------------------------------
|
||||
# Counts
|
||||
/*--------------------------------------------------------------
|
||||
# Counts
|
||||
--------------------------------------------------------------*/
|
||||
.counts {
|
||||
padding: 30px 0;
|
||||
|
|
@ -616,8 +620,8 @@ section {
|
|||
color: #37423b;
|
||||
}
|
||||
|
||||
/*--------------------------------------------------------------
|
||||
# Why Us
|
||||
/*--------------------------------------------------------------
|
||||
# Why Us
|
||||
--------------------------------------------------------------*/
|
||||
.why-us .content {
|
||||
padding: 30px;
|
||||
|
|
@ -682,8 +686,8 @@ section {
|
|||
color: #848484;
|
||||
}
|
||||
|
||||
/*--------------------------------------------------------------
|
||||
# Features
|
||||
/*--------------------------------------------------------------
|
||||
# Features
|
||||
--------------------------------------------------------------*/
|
||||
.features {
|
||||
padding-top: 0px;
|
||||
|
|
@ -724,8 +728,8 @@ section {
|
|||
color: #5fcf80;
|
||||
}
|
||||
|
||||
/*--------------------------------------------------------------
|
||||
# Courses
|
||||
/*--------------------------------------------------------------
|
||||
# Courses
|
||||
--------------------------------------------------------------*/
|
||||
.courses .course-item {
|
||||
border-radius: 5px;
|
||||
|
|
@ -792,8 +796,8 @@ section {
|
|||
color: #657a6d;
|
||||
}
|
||||
|
||||
/*--------------------------------------------------------------
|
||||
# Trainers
|
||||
/*--------------------------------------------------------------
|
||||
# Trainers
|
||||
--------------------------------------------------------------*/
|
||||
.trainers .member {
|
||||
text-align: center;
|
||||
|
|
@ -847,8 +851,8 @@ section {
|
|||
margin: 0 2px;
|
||||
}
|
||||
|
||||
/*--------------------------------------------------------------
|
||||
# Testimonials
|
||||
/*--------------------------------------------------------------
|
||||
# Testimonials
|
||||
--------------------------------------------------------------*/
|
||||
.testimonials .testimonial-wrap {
|
||||
padding-left: 50px;
|
||||
|
|
@ -885,7 +889,8 @@ section {
|
|||
margin: 0;
|
||||
}
|
||||
|
||||
.testimonials .testimonial-item .quote-icon-left, .testimonials .testimonial-item .quote-icon-right {
|
||||
.testimonials .testimonial-item .quote-icon-left,
|
||||
.testimonials .testimonial-item .quote-icon-right {
|
||||
color: #c1ecce;
|
||||
font-size: 26px;
|
||||
}
|
||||
|
|
@ -908,7 +913,8 @@ section {
|
|||
margin: 15px auto 15px auto;
|
||||
}
|
||||
|
||||
.testimonials .owl-nav, .testimonials .owl-dots {
|
||||
.testimonials .owl-nav,
|
||||
.testimonials .owl-dots {
|
||||
margin-top: 5px;
|
||||
text-align: center;
|
||||
}
|
||||
|
|
@ -940,8 +946,8 @@ section {
|
|||
}
|
||||
}
|
||||
|
||||
/*--------------------------------------------------------------
|
||||
# Cource Details
|
||||
/*--------------------------------------------------------------
|
||||
# Cource Details
|
||||
--------------------------------------------------------------*/
|
||||
.course-details h3 {
|
||||
font-size: 24px;
|
||||
|
|
@ -952,7 +958,7 @@ section {
|
|||
}
|
||||
|
||||
.course-details h3:before {
|
||||
content: '';
|
||||
content: "";
|
||||
position: absolute;
|
||||
display: block;
|
||||
width: 100%;
|
||||
|
|
@ -963,7 +969,7 @@ section {
|
|||
}
|
||||
|
||||
.course-details h3:after {
|
||||
content: '';
|
||||
content: "";
|
||||
position: absolute;
|
||||
display: block;
|
||||
width: 60px;
|
||||
|
|
@ -995,8 +1001,8 @@ section {
|
|||
color: #657a6d;
|
||||
}
|
||||
|
||||
/*--------------------------------------------------------------
|
||||
# Cource Details Tabs
|
||||
/*--------------------------------------------------------------
|
||||
# Cource Details Tabs
|
||||
--------------------------------------------------------------*/
|
||||
.cource-details-tabs {
|
||||
overflow: hidden;
|
||||
|
|
@ -1058,8 +1064,8 @@ section {
|
|||
}
|
||||
}
|
||||
|
||||
/*--------------------------------------------------------------
|
||||
# Events
|
||||
/*--------------------------------------------------------------
|
||||
# Events
|
||||
--------------------------------------------------------------*/
|
||||
.events .card {
|
||||
border: 0;
|
||||
|
|
@ -1130,8 +1136,8 @@ section {
|
|||
color: #5fcf80;
|
||||
}
|
||||
|
||||
/*--------------------------------------------------------------
|
||||
# Pricing
|
||||
/*--------------------------------------------------------------
|
||||
# Pricing
|
||||
--------------------------------------------------------------*/
|
||||
.pricing .box {
|
||||
padding: 20px;
|
||||
|
|
@ -1240,8 +1246,8 @@ section {
|
|||
color: #fff;
|
||||
}
|
||||
|
||||
/*--------------------------------------------------------------
|
||||
# Contact
|
||||
/*--------------------------------------------------------------
|
||||
# Contact
|
||||
--------------------------------------------------------------*/
|
||||
.contact {
|
||||
padding-top: 5px;
|
||||
|
|
@ -1281,11 +1287,14 @@ section {
|
|||
color: #657a6d;
|
||||
}
|
||||
|
||||
.contact .info .email, .contact .info .phone {
|
||||
.contact .info .email,
|
||||
.contact .info .phone {
|
||||
margin-top: 40px;
|
||||
}
|
||||
|
||||
.contact .info .email:hover i, .contact .info .address:hover i, .contact .info .phone:hover i {
|
||||
.contact .info .email:hover i,
|
||||
.contact .info .address:hover i,
|
||||
.contact .info .phone:hover i {
|
||||
background: #5fcf80;
|
||||
color: #fff;
|
||||
}
|
||||
|
|
@ -1349,13 +1358,15 @@ section {
|
|||
animation: animate-loading 1s linear infinite;
|
||||
}
|
||||
|
||||
.contact .php-email-form input, .contact .php-email-form textarea {
|
||||
.contact .php-email-form input,
|
||||
.contact .php-email-form textarea {
|
||||
border-radius: 4px;
|
||||
box-shadow: none;
|
||||
font-size: 14px;
|
||||
}
|
||||
|
||||
.contact .php-email-form input:focus, .contact .php-email-form textarea:focus {
|
||||
.contact .php-email-form input:focus,
|
||||
.contact .php-email-form textarea:focus {
|
||||
border-color: #5fcf80;
|
||||
}
|
||||
|
||||
|
|
@ -1398,8 +1409,8 @@ section {
|
|||
}
|
||||
}
|
||||
|
||||
/*--------------------------------------------------------------
|
||||
# Footer
|
||||
/*--------------------------------------------------------------
|
||||
# Footer
|
||||
--------------------------------------------------------------*/
|
||||
#footer {
|
||||
color: #37423b;
|
||||
|
|
|
|||
|
Before Width: | Height: | Size: 50 KiB After Width: | Height: | Size: 1.5 MiB |
|
Before Width: | Height: | Size: 88 KiB After Width: | Height: | Size: 60 KiB |
|
Before Width: | Height: | Size: 117 KiB After Width: | Height: | Size: 914 KiB |
|
Before Width: | Height: | Size: 216 KiB After Width: | Height: | Size: 4.7 MiB |