first commit
Cette révision appartient à :
@@ -0,0 +1,98 @@
|
||||
/*-------------------------
|
||||
background images
|
||||
-------------------------*/
|
||||
|
||||
.bg-img {
|
||||
background-repeat: no-repeat;
|
||||
background-position: center bottom;
|
||||
background-size: cover;
|
||||
}
|
||||
|
||||
|
||||
|
||||
// .bg-img4 {
|
||||
// background-image: url("../img/slider/slide4.jpg");
|
||||
// }
|
||||
|
||||
// .bg-img5 {
|
||||
// background-image: url("../img/slider/slide5.jpg");
|
||||
// }
|
||||
|
||||
// .bg-img6 {
|
||||
// background-image: url("../img/slider/slide6.jpg");
|
||||
// }
|
||||
|
||||
// .bg-img7 {
|
||||
// background-image: url("../img/slider/slide7.jpg");
|
||||
// }
|
||||
|
||||
// .bg-img8 {
|
||||
// background-image: url("../img/slider/slide8.jpg");
|
||||
// }
|
||||
|
||||
@media (max-width: 991px) {
|
||||
.bg-img {
|
||||
background-position: 15% bottom;
|
||||
}
|
||||
.bg-img.bg-img4 {
|
||||
background-position: 45% bottom;
|
||||
}
|
||||
.wraped .bg-img {
|
||||
background-position: 40% bottom;
|
||||
}
|
||||
}
|
||||
|
||||
/*------------------------
|
||||
background colors
|
||||
------------------------*/
|
||||
|
||||
.theme-bg {
|
||||
background-color: $theme-color !important;
|
||||
}
|
||||
.theme-bg2 {
|
||||
background-color: $theme-color2 !important;
|
||||
}
|
||||
.theme-bg3 {
|
||||
background-color: $theme-color3 !important;
|
||||
}
|
||||
|
||||
.bg-light {
|
||||
background-color: $color-grey-dark !important;
|
||||
}
|
||||
|
||||
.bg-lighten {
|
||||
background-color: $color-grey !important;
|
||||
}
|
||||
.bg-lighten2 {
|
||||
background-color: $color-grey-light;
|
||||
}
|
||||
|
||||
.bg-dark {
|
||||
background-color: $color-dark !important;
|
||||
}
|
||||
|
||||
/*-------------------
|
||||
text-color
|
||||
-------------------*/
|
||||
|
||||
.theme-color {
|
||||
color: $theme-color;
|
||||
}
|
||||
.theme-color2 {
|
||||
color: $theme-color2;
|
||||
}
|
||||
.theme-color3 {
|
||||
color: $theme-color3;
|
||||
}
|
||||
|
||||
.text-warning {
|
||||
color: $color-warning !important;
|
||||
}
|
||||
|
||||
.text-dark {
|
||||
color: $color-dark !important;
|
||||
}
|
||||
|
||||
.text-muted {
|
||||
color: $body-color !important;
|
||||
}
|
||||
@@ -0,0 +1,147 @@
|
||||
/* Google Fonts */
|
||||
@import url('https://fonts.googleapis.com/css2?family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&family=Raleway:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap');
|
||||
|
||||
/*---------------------------*
|
||||
#Template default CSS
|
||||
*----------------------------*/
|
||||
|
||||
body {
|
||||
background: $color-white;
|
||||
font-family: $poppins;
|
||||
font-weight: fontweight(regular);
|
||||
font-size: 14px;
|
||||
line-height: $base-line-height;
|
||||
color: #565656;
|
||||
overflow-x: hidden;
|
||||
|
||||
}
|
||||
.container{
|
||||
@include max-screen(1199){
|
||||
max-width: 100%;
|
||||
}
|
||||
}
|
||||
h1,
|
||||
h2,
|
||||
h3,
|
||||
h4,
|
||||
h5,
|
||||
h6 {
|
||||
font-family: $raleway;
|
||||
margin: 0;
|
||||
line-height: 1.25;
|
||||
color: $color-dark;
|
||||
}
|
||||
|
||||
p {
|
||||
margin: $paragraph-spacing;
|
||||
line-height: 1.715;
|
||||
}
|
||||
|
||||
a,
|
||||
button {
|
||||
text-decoration: none;
|
||||
color: inherit;
|
||||
}
|
||||
|
||||
button {
|
||||
background: transparent;
|
||||
border: 0;
|
||||
padding: 0;
|
||||
outline: 0;
|
||||
}
|
||||
|
||||
a,
|
||||
button,
|
||||
img,
|
||||
input {
|
||||
@include transition(0.3s);
|
||||
}
|
||||
|
||||
a {
|
||||
&:focus {
|
||||
text-decoration: none;
|
||||
outline: 0;
|
||||
}
|
||||
&:hover {
|
||||
text-decoration: none;
|
||||
color: $theme-color;
|
||||
}
|
||||
}
|
||||
|
||||
button,
|
||||
input[type="submit"] {
|
||||
cursor: pointer;
|
||||
outline: 0 !important;
|
||||
}
|
||||
|
||||
img {
|
||||
max-width: 100%;
|
||||
}
|
||||
|
||||
:focus {
|
||||
outline: 0;
|
||||
}
|
||||
|
||||
ul {
|
||||
padding: 0;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
li {
|
||||
list-style: none;
|
||||
}
|
||||
|
||||
span {
|
||||
display: inline-block;
|
||||
}
|
||||
span {
|
||||
&.separator {
|
||||
color: $separator-color;
|
||||
margin: 0 8px;
|
||||
line-height: 1;
|
||||
font-size: 14px;
|
||||
}
|
||||
}
|
||||
.zoom-in img {
|
||||
@include transition(0.3s linear);
|
||||
}
|
||||
|
||||
.zoom-in:hover img {
|
||||
@include transform(scale(1.045) rotate(0.05deg));
|
||||
}
|
||||
|
||||
.theme-border {
|
||||
border: 2px solid $theme-color !important;
|
||||
}
|
||||
.theme-border2 {
|
||||
border: 2px solid $theme-color2 !important;
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
hr.hr {
|
||||
background-color: $border-color;
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
span.required {
|
||||
color: $theme-color;
|
||||
}
|
||||
|
||||
.theme1 {
|
||||
.hover-color {
|
||||
&:hover {
|
||||
color: $theme-color !important;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.w-md-50 {
|
||||
width: 100%;
|
||||
max-width: 100%;
|
||||
@include min-screen(768) {
|
||||
max-width: 50%;
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,3 @@
|
||||
@function fontweight($fontweight-name) {
|
||||
@return (map-get($fontWeights, $fontweight-name));
|
||||
}
|
||||
@@ -0,0 +1,38 @@
|
||||
@mixin transition($time) {
|
||||
transition: all $time;
|
||||
}
|
||||
|
||||
@mixin transform($value) {
|
||||
transform: $value;
|
||||
}
|
||||
@mixin border-radius($value) {
|
||||
border-radius: $value;
|
||||
}
|
||||
|
||||
// Placeholder Mixins
|
||||
@mixin placeholder {
|
||||
&::placeholder {
|
||||
@content;
|
||||
}
|
||||
}
|
||||
|
||||
// media queries
|
||||
$units: 1px !default;
|
||||
|
||||
@mixin max-screen($res-first, $res-last: $res-first) {
|
||||
@if $res-first == $res-last {
|
||||
@media screen and (max-width: if(unitless($res-first), $res-first*$units, $res-first)) {
|
||||
@content;
|
||||
}
|
||||
} @else if $res-first < $res-last {
|
||||
@media screen and (min-width: if(unitless($res-first), $res-first*$units, $res-first)) and (max-width: if(unitless($res-last), $res-last*$units, $res-last)) {
|
||||
@content;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@mixin min-screen($res) {
|
||||
@media screen and (min-width: if(unitless($res), $res*$units, $res)) {
|
||||
@content;
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,76 @@
|
||||
// /*--
|
||||
// - Overlay
|
||||
// ------------------------------------------*/
|
||||
// [data-overlay] {
|
||||
// position: relative;
|
||||
// background-size: cover;
|
||||
// background-repeat: no-repeat;
|
||||
// background-position: center center;
|
||||
// &::before {
|
||||
// position: absolute;
|
||||
// left: 0;
|
||||
// top: 0;
|
||||
// right: 0;
|
||||
// bottom: 0;
|
||||
// content: "";
|
||||
// }
|
||||
// }
|
||||
|
||||
// /*-- Overlay Color --*/
|
||||
// [data-overlay="light"] {
|
||||
// &::before {
|
||||
// // background-color: $white;
|
||||
// }
|
||||
// }
|
||||
// [data-overlay="dark"] {
|
||||
// &::before {
|
||||
// // background-color: $black;
|
||||
// }
|
||||
// }
|
||||
|
||||
// /*-- Overlay Opacity --*/
|
||||
// [data-opacity="1"] {
|
||||
// &::before {
|
||||
// opacity: 0.1;
|
||||
// }
|
||||
// }
|
||||
// [data-opacity="2"] {
|
||||
// &::before {
|
||||
// opacity: 0.2;
|
||||
// }
|
||||
// }
|
||||
// [data-opacity="3"] {
|
||||
// &::before {
|
||||
// opacity: 0.3;
|
||||
// }
|
||||
// }
|
||||
// [data-opacity="4"] {
|
||||
// &::before {
|
||||
// opacity: 0.4;
|
||||
// }
|
||||
// }
|
||||
// [data-opacity="5"] {
|
||||
// &::before {
|
||||
// opacity: 0.5;
|
||||
// }
|
||||
// }
|
||||
// [data-opacity="6"] {
|
||||
// &::before {
|
||||
// opacity: 0.6;
|
||||
// }
|
||||
// }
|
||||
// [data-opacity="7"] {
|
||||
// &::before {
|
||||
// opacity: 0.7;
|
||||
// }
|
||||
// }
|
||||
// [data-opacity="8"] {
|
||||
// &::before {
|
||||
// opacity: 0.8;
|
||||
// }
|
||||
// }
|
||||
// [data-opacity="9"] {
|
||||
// &::before {
|
||||
// opacity: 0.9;
|
||||
// }
|
||||
// }
|
||||
@@ -0,0 +1,83 @@
|
||||
/*-----------------------
|
||||
# selection colors
|
||||
-------------------------*/
|
||||
|
||||
*::-moz-selection {
|
||||
background: $theme-color;
|
||||
color: $color-white;
|
||||
text-shadow: none;
|
||||
}
|
||||
|
||||
::selection {
|
||||
background: $theme-color;
|
||||
color: $color-white;
|
||||
text-shadow: none;
|
||||
}
|
||||
|
||||
/*-----------------------
|
||||
# Input Placeholder
|
||||
-------------------------*/
|
||||
|
||||
input::-webkit-input-placeholder,
|
||||
textarea::-webkit-input-placeholder {
|
||||
color: $placeholder-color !important;
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
input::-moz-placeholder,
|
||||
textarea::-moz-placeholder {
|
||||
color: $placeholder-color !important;
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
input:-ms-input-placeholder,
|
||||
textarea:-ms-input-placeholder {
|
||||
color: $placeholder-color !important;
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
input::-ms-input-placeholder,
|
||||
textarea::-ms-input-placeholder {
|
||||
color: $placeholder-color !important;
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
input::placeholder,
|
||||
textarea::placeholder {
|
||||
color: $placeholder-color !important;
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
/*--------------------------
|
||||
input active placeholder
|
||||
--------------------------*/
|
||||
|
||||
input:active::-webkit-input-placeholder,
|
||||
textarea:active::-webkit-input-placeholder {
|
||||
color: $placeholder-color !important;
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
input:active::-moz-placeholder,
|
||||
textarea:active::-moz-placeholder {
|
||||
color: $placeholder-color !important;
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
input:active:-ms-input-placeholder,
|
||||
textarea:active:-ms-input-placeholder {
|
||||
color: $placeholder-color !important;
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
input:active::-ms-input-placeholder,
|
||||
textarea:active::-ms-input-placeholder {
|
||||
color: $placeholder-color !important;
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
input:active::placeholder,
|
||||
textarea:active::placeholder {
|
||||
color: $placeholder-color !important;
|
||||
opacity: 1;
|
||||
}
|
||||
@@ -0,0 +1,112 @@
|
||||
/*-----------------------
|
||||
# Margin & Padding
|
||||
-------------------------*/
|
||||
|
||||
// padding x and y
|
||||
@for $i from 1 through 16 {
|
||||
.py-#{5 * $i} {
|
||||
padding-top: 5px * $i;
|
||||
padding-bottom: 5px * $i;
|
||||
}
|
||||
}
|
||||
|
||||
@for $i from 1 through 10 {
|
||||
.px-#{5 * $i} {
|
||||
padding-left: 5px * $i;
|
||||
padding-right: 5px * $i;
|
||||
}
|
||||
}
|
||||
|
||||
/*------------------
|
||||
# Margin Top
|
||||
------------------*/
|
||||
|
||||
@for $i from 1 through 26 {
|
||||
.mt-#{5 * $i} {
|
||||
margin-top: 5px * $i;
|
||||
}
|
||||
}
|
||||
|
||||
/*------------------
|
||||
# Margin Bottom
|
||||
------------------*/
|
||||
|
||||
@for $i from 1 through 26 {
|
||||
.mb-#{5 * $i} {
|
||||
margin-bottom: 5px * $i;
|
||||
}
|
||||
}
|
||||
|
||||
/*------------------
|
||||
# Margin Left
|
||||
------------------*/
|
||||
|
||||
@for $i from 1 through 10 {
|
||||
.ml-#{5 * $i} {
|
||||
margin-left: 5px * $i;
|
||||
}
|
||||
}
|
||||
|
||||
/*------------------
|
||||
# Margin Right
|
||||
------------------*/
|
||||
|
||||
@for $i from 1 through 10 {
|
||||
.mr-#{5 * $i} {
|
||||
margin-right: 5px * $i;
|
||||
}
|
||||
}
|
||||
|
||||
/*------------------
|
||||
# Padding Top
|
||||
------------------*/
|
||||
|
||||
@for $i from 1 through 26 {
|
||||
.pt-#{5 * $i} {
|
||||
padding-top: 5px * $i;
|
||||
}
|
||||
}
|
||||
|
||||
/*------------------
|
||||
# Padding Bottom
|
||||
------------------*/
|
||||
|
||||
@for $i from 1 through 26 {
|
||||
.pb-#{5 * $i} {
|
||||
padding-bottom: 5px * $i;
|
||||
}
|
||||
}
|
||||
|
||||
/*---------------
|
||||
# Padding Left
|
||||
---------------*/
|
||||
|
||||
@for $i from 1 through 10 {
|
||||
.pl-#{5 * $i} {
|
||||
padding-left: 5px * $i;
|
||||
}
|
||||
}
|
||||
|
||||
/*---------------
|
||||
# Padding Right
|
||||
---------------*/
|
||||
|
||||
@for $i from 1 through 10 {
|
||||
.pr-#{5 * $i} {
|
||||
padding-right: 5px * $i;
|
||||
}
|
||||
}
|
||||
|
||||
.px-xl-90 {
|
||||
@include min-screen(1920) {
|
||||
padding-left: 90px;
|
||||
padding-right: 90px;
|
||||
}
|
||||
}
|
||||
|
||||
.mr-pe-0 {
|
||||
@include max-screen(991) {
|
||||
margin-right: 0px;
|
||||
padding-right: 0px;
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,59 @@
|
||||
// Variables
|
||||
|
||||
//# Base font family
|
||||
|
||||
$poppins: "Poppins";
|
||||
$raleway: "Raleway";
|
||||
|
||||
// font-weght
|
||||
|
||||
$fontWeights: (
|
||||
"light": 300,
|
||||
"regular": 400,
|
||||
"medium": 500,
|
||||
"semi-bold": 600,
|
||||
"bold": 700,
|
||||
"black": 800,
|
||||
"heavy": 900,
|
||||
);
|
||||
|
||||
// # Paragraph spacing
|
||||
$paragraph-spacing: 0px;
|
||||
//# Base line height
|
||||
$base-line-height: 1.75;
|
||||
// theme colors
|
||||
$theme-color: #5a5ac9;
|
||||
$theme-color2: #8a72e0;
|
||||
$theme-color3: #10a341;
|
||||
// text colors
|
||||
$black: #000;
|
||||
$color-white: #ffffff;
|
||||
$color-dark: #111111;
|
||||
$color-dark2: #292929;
|
||||
$color-grey: #f5f5f5;
|
||||
$color-grey-dark: #efefef;
|
||||
$color-grey-light: #f6f6f6;
|
||||
$color-grey-light2: #f9f9f9;
|
||||
$body-color: #707070;
|
||||
$color-warning: #fdd835;
|
||||
$star-deselect: #d0d0d0;
|
||||
$del: #9b9b9b;
|
||||
$focus-color: #253237;
|
||||
$placeholder-color: #565656;
|
||||
$instock: #777;
|
||||
$feature: #f1f1f1;
|
||||
$camel: #c19a6b;
|
||||
// Soft color
|
||||
$black-soft: #7e7e7e;
|
||||
$grey-soft: #9d9d9d;
|
||||
$overlay-color: rgba(0, 0, 0, 0.5);
|
||||
$progress-color: rgba(49, 56, 72, 0.298);
|
||||
// separator color
|
||||
$separator-color: #bfbfbf;
|
||||
$deselect: #e0e0e0;
|
||||
$border-color: #ebebeb;
|
||||
$border-color2: #eee;
|
||||
$tab-menu-color: #666;
|
||||
// theme dots color
|
||||
$themedot2: #d6d6d6;
|
||||
$grayCardBg: #f7f7f7;
|
||||
Référencer dans un nouveau ticket
Bloquer un utilisateur