style(scss): configure prettier et complète les règles
Parent
5e5283eb8b
révision
ff7c333401
|
@ -0,0 +1,5 @@
|
|||
{
|
||||
"arrowParens": "always",
|
||||
"quoteProps": "consistent",
|
||||
"singleQuote": true
|
||||
}
|
|
@ -1,12 +1,11 @@
|
|||
{
|
||||
"extends": [
|
||||
"stylelint-config-twbs-bootstrap/scss"
|
||||
"stylelint-config-twbs-bootstrap/scss",
|
||||
"stylelint-prettier/recommended"
|
||||
],
|
||||
"rules": {
|
||||
"value-list-comma-newline-after": "always-multi-line",
|
||||
"value-list-comma-newline-before": "never-multi-line",
|
||||
"value-list-comma-space-after": "always-single-line",
|
||||
"scss/at-function-named-arguments": null,
|
||||
"scss/dollar-variable-default": null
|
||||
"scss/at-mixin-argumentless-call-parentheses": "never",
|
||||
"scss/at-rule-conditional-no-parentheses": true
|
||||
}
|
||||
}
|
||||
|
|
|
@ -10,19 +10,16 @@
|
|||
//
|
||||
// @param {Keyword} $size [full] - La taille de la cellule
|
||||
// @param {Boolean} $vertical [false] - Si la cellule est disposée verticalement.
|
||||
@mixin grid-cell($size: full) {
|
||||
@if ($size == "full") {
|
||||
@mixin grid-cell($size: 'full') {
|
||||
@if $size == 'full' {
|
||||
flex: 0 0 auto;
|
||||
min-width: 0px; // stylelint-disable-line length-zero-no-unit
|
||||
min-height: 0px; // stylelint-disable-line length-zero-no-unit
|
||||
}
|
||||
@else if ($size == "auto") {
|
||||
} @else if $size == 'auto' {
|
||||
flex: 1 1 0px; // stylelint-disable-line length-zero-no-unit
|
||||
}
|
||||
@else if ($size == "shrink") {
|
||||
} @else if $size == 'shrink' {
|
||||
flex: 0 0 auto;
|
||||
}
|
||||
@else if ($size == "grow") {
|
||||
} @else if $size == 'grow' {
|
||||
flex: 1 0 auto;
|
||||
}
|
||||
}
|
||||
|
@ -31,10 +28,7 @@
|
|||
//
|
||||
// @param {Boolean} $vertical [false] - Si les cellules sont disposées verticalement.
|
||||
// @param {Boolean} $wrap [true] - Si les cellules peuvent être sur plusieurs lignes.
|
||||
@mixin grid(
|
||||
$vertical: false,
|
||||
$wrap: true
|
||||
) {
|
||||
@mixin grid($vertical: false, $wrap: true) {
|
||||
$direction: if($vertical, column, row);
|
||||
$wrap: if($wrap, wrap, nowrap);
|
||||
|
||||
|
|
|
@ -2,8 +2,8 @@
|
|||
// Variables de l'application et de Bootstrap
|
||||
// -----------------------------------------------------------------------------
|
||||
|
||||
$font-path: "../fonts";
|
||||
$img-path: "../img";
|
||||
$font-path: '../fonts';
|
||||
$img-path: '../img';
|
||||
|
||||
//
|
||||
// Bootstrap
|
||||
|
@ -73,15 +73,15 @@ $link-hover-decoration: none;
|
|||
|
||||
// Components
|
||||
|
||||
$border-color: rgba($black, .15);
|
||||
$border-color: rgba($black, 0.15);
|
||||
|
||||
$border-radius: .2rem;
|
||||
$border-radius-lg: .25rem;
|
||||
$border-radius-sm: .15rem;
|
||||
$border-radius: 0.2rem;
|
||||
$border-radius-lg: 0.25rem;
|
||||
$border-radius-sm: 0.15rem;
|
||||
|
||||
$box-shadow: 0 .25rem .75rem rgba($black, .15);
|
||||
$box-shadow-sm: 0 .1rem .2rem rgba($black, .075);
|
||||
$box-shadow-lg: 0 .5rem 1rem rgba($black, .175);
|
||||
$box-shadow: 0 0.25rem 0.75rem rgba($black, 0.15);
|
||||
$box-shadow-sm: 0 0.1rem 0.2rem rgba($black, 0.075);
|
||||
$box-shadow-lg: 0 0.5rem 1rem rgba($black, 0.175);
|
||||
|
||||
$component-active-color: $white;
|
||||
$component-active-bg: $primary;
|
||||
|
@ -97,17 +97,17 @@ $font-weight-bold: 700;
|
|||
|
||||
$headings-font-weight: $font-weight-medium;
|
||||
|
||||
$small-font-size: .8125em;
|
||||
$small-font-size: 0.8125em;
|
||||
|
||||
$hr-color: rgba($black, .1);
|
||||
$hr-color: rgba($black, 0.1);
|
||||
$hr-opacity: 1;
|
||||
|
||||
// Tables
|
||||
|
||||
$table-cell-padding-y: .75rem;
|
||||
$table-cell-padding-x: .75rem;
|
||||
$table-cell-padding-x-sm: .3rem;
|
||||
$table-cell-padding-y-sm: .3rem;
|
||||
$table-cell-padding-y: 0.75rem;
|
||||
$table-cell-padding-x: 0.75rem;
|
||||
$table-cell-padding-x-sm: 0.3rem;
|
||||
$table-cell-padding-y-sm: 0.3rem;
|
||||
|
||||
$table-bg: $white;
|
||||
|
||||
|
@ -122,12 +122,12 @@ $table-bg-scale: -60%;
|
|||
$input-btn-focus-width: 0;
|
||||
$input-btn-focus-box-shadow: none;
|
||||
|
||||
$input-btn-padding-y-sm: .2rem;
|
||||
$input-btn-padding-x-sm: .4rem;
|
||||
$input-btn-padding-y-sm: 0.2rem;
|
||||
$input-btn-padding-x-sm: 0.4rem;
|
||||
|
||||
// Buttons
|
||||
|
||||
$btn-disabled-opacity: .5;
|
||||
$btn-disabled-opacity: 0.5;
|
||||
$btn-active-box-shadow: none;
|
||||
|
||||
// Forms
|
||||
|
@ -138,7 +138,7 @@ $input-color: $gray-800;
|
|||
$input-focus-color: $gray-900;
|
||||
$input-placeholder-color: $gray-400;
|
||||
|
||||
$input-transition: color .1s ease-in-out, border-color .1s ease-in-out;
|
||||
$input-transition: color 0.1s ease-in-out, border-color 0.1s ease-in-out;
|
||||
|
||||
$form-check-input-width: 1.125em;
|
||||
|
||||
|
@ -146,7 +146,7 @@ $form-check-input-bg: $input-bg;
|
|||
|
||||
// Navbar
|
||||
|
||||
$navbar-dark-color: rgba($white, .75);
|
||||
$navbar-dark-color: rgba($white, 0.75);
|
||||
$navbar-dark-hover-color: $white;
|
||||
$navbar-dark-active-color: $white;
|
||||
|
||||
|
@ -157,13 +157,13 @@ $pagination-border-color: $border-color;
|
|||
// Cards
|
||||
|
||||
$card-border-color: $border-color;
|
||||
$card-cap-padding-y: $spacer * .75;
|
||||
$card-cap-padding-y: $spacer * 0.75;
|
||||
|
||||
// Badges
|
||||
|
||||
$badge-font-weight: $font-weight-medium;
|
||||
$badge-padding-y: .25em;
|
||||
$badge-padding-x: .5em;
|
||||
$badge-padding-y: 0.25em;
|
||||
$badge-padding-x: 0.5em;
|
||||
|
||||
// Modals
|
||||
|
||||
|
@ -192,5 +192,5 @@ $breadcrumb-margin-bottom: 0;
|
|||
|
||||
// Close
|
||||
|
||||
$btn-close-width: .75em;
|
||||
$btn-close-padding-x: .5em;
|
||||
$btn-close-width: 0.75em;
|
||||
$btn-close-padding-x: 0.5em;
|
||||
|
|
|
@ -1,31 +1,31 @@
|
|||
@charset "utf-8";
|
||||
|
||||
// Variables et utilitaires
|
||||
@import "abstracts/variables";
|
||||
@import "abstracts/mixins";
|
||||
@import 'abstracts/variables';
|
||||
@import 'abstracts/mixins';
|
||||
|
||||
// Librairies
|
||||
@import "vendor/fork-awesome";
|
||||
@import "vendor/bootstrap";
|
||||
@import 'vendor/fork-awesome';
|
||||
@import 'vendor/bootstrap';
|
||||
|
||||
// Styles de base
|
||||
@import "base/fonts";
|
||||
@import "base/typography";
|
||||
@import "base/utilities";
|
||||
@import 'base/fonts';
|
||||
@import 'base/typography';
|
||||
@import 'base/utilities';
|
||||
|
||||
// Agencement des sections
|
||||
@import "layout/base";
|
||||
@import "layout/header";
|
||||
@import "layout/content";
|
||||
@import "layout/footer";
|
||||
@import 'layout/base';
|
||||
@import 'layout/header';
|
||||
@import 'layout/content';
|
||||
@import 'layout/footer';
|
||||
|
||||
// Composants
|
||||
@import "components/alert";
|
||||
@import "components/card";
|
||||
@import "components/forms";
|
||||
@import "components/list-group";
|
||||
@import "components/modal";
|
||||
@import "components/tables";
|
||||
@import 'components/alert';
|
||||
@import 'components/card';
|
||||
@import 'components/forms';
|
||||
@import 'components/list-group';
|
||||
@import 'components/modal';
|
||||
@import 'components/tables';
|
||||
|
||||
// Pages spécifiques
|
||||
@import "pages/login";
|
||||
@import 'pages/login';
|
||||
|
|
|
@ -5,58 +5,54 @@
|
|||
/// Montserrat
|
||||
/// OFL - Julieta Ulanovsky
|
||||
|
||||
$montserrat-font-path: "~fonts/montserrat";
|
||||
$montserrat-font-path: '~fonts/montserrat';
|
||||
|
||||
@font-face {
|
||||
font-family: Montserrat;
|
||||
font-style: normal;
|
||||
font-weight: $font-weight-normal;
|
||||
src:
|
||||
url("#{$montserrat-font-path}/montserrat-regular.woff2") format("woff2"),
|
||||
url("#{$montserrat-font-path}/montserrat-regular.woff") format("woff");
|
||||
src: url('#{$montserrat-font-path}/montserrat-regular.woff2') format('woff2'),
|
||||
url('#{$montserrat-font-path}/montserrat-regular.woff') format('woff');
|
||||
}
|
||||
|
||||
@font-face {
|
||||
font-family: Montserrat;
|
||||
font-style: italic;
|
||||
font-weight: $font-weight-normal;
|
||||
src:
|
||||
url("#{$montserrat-font-path}/montserrat-italic.woff2") format("woff2"),
|
||||
url("#{$montserrat-font-path}/montserrat-italic.woff") format("woff");
|
||||
src: url('#{$montserrat-font-path}/montserrat-italic.woff2') format('woff2'),
|
||||
url('#{$montserrat-font-path}/montserrat-italic.woff') format('woff');
|
||||
}
|
||||
|
||||
@font-face {
|
||||
font-family: Montserrat;
|
||||
font-style: normal;
|
||||
font-weight: $font-weight-medium;
|
||||
src:
|
||||
url("#{$montserrat-font-path}/montserrat-medium.woff2") format("woff2"),
|
||||
url("#{$montserrat-font-path}/montserrat-medium.woff") format("woff");
|
||||
src: url('#{$montserrat-font-path}/montserrat-medium.woff2') format('woff2'),
|
||||
url('#{$montserrat-font-path}/montserrat-medium.woff') format('woff');
|
||||
}
|
||||
|
||||
@font-face {
|
||||
font-family: Montserrat;
|
||||
font-style: italic;
|
||||
font-weight: $font-weight-medium;
|
||||
src:
|
||||
url("#{$montserrat-font-path}/montserrat-mediumitalic.woff2") format("woff2"),
|
||||
url("#{$montserrat-font-path}/montserrat-mediumitalic.woff") format("woff");
|
||||
src: url('#{$montserrat-font-path}/montserrat-mediumitalic.woff2')
|
||||
format('woff2'),
|
||||
url('#{$montserrat-font-path}/montserrat-mediumitalic.woff') format('woff');
|
||||
}
|
||||
|
||||
@font-face {
|
||||
font-family: Montserrat;
|
||||
font-style: normal;
|
||||
font-weight: $font-weight-bold;
|
||||
src:
|
||||
url("#{$montserrat-font-path}/montserrat-bold.woff2") format("woff2"),
|
||||
url("#{$montserrat-font-path}/montserrat-bold.woff") format("woff");
|
||||
src: url('#{$montserrat-font-path}/montserrat-bold.woff2') format('woff2'),
|
||||
url('#{$montserrat-font-path}/montserrat-bold.woff') format('woff');
|
||||
}
|
||||
|
||||
@font-face {
|
||||
font-family: Montserrat;
|
||||
font-style: italic;
|
||||
font-weight: $font-weight-bold;
|
||||
src:
|
||||
url("#{$montserrat-font-path}/montserrat-bolditalic.woff2") format("woff2"),
|
||||
url("#{$montserrat-font-path}/montserrat-bolditalic.woff") format("woff");
|
||||
src: url('#{$montserrat-font-path}/montserrat-bolditalic.woff2')
|
||||
format('woff2'),
|
||||
url('#{$montserrat-font-path}/montserrat-bolditalic.woff') format('woff');
|
||||
}
|
||||
|
|
|
@ -1,15 +1,15 @@
|
|||
@charset "utf-8";
|
||||
|
||||
// Variables et utilitaires
|
||||
@import "abstracts/variables";
|
||||
@import 'abstracts/variables';
|
||||
|
||||
// Librairies
|
||||
@import "~bootstrap/scss/functions";
|
||||
@import "~bootstrap/scss/variables";
|
||||
@import "~bootstrap/scss/mixins";
|
||||
@import '~bootstrap/scss/functions';
|
||||
@import '~bootstrap/scss/variables';
|
||||
@import '~bootstrap/scss/mixins';
|
||||
|
||||
// Composants
|
||||
@import "components/calendar";
|
||||
@import 'components/calendar';
|
||||
|
||||
// Pages spécifiques
|
||||
@import "pages/calendar";
|
||||
@import 'pages/calendar';
|
||||
|
|
|
@ -14,7 +14,7 @@
|
|||
.alert {
|
||||
box-shadow: $box-shadow-sm;
|
||||
backdrop-filter: blur(10px);
|
||||
opacity: .9;
|
||||
opacity: 0.9;
|
||||
transition: $transition-fade;
|
||||
|
||||
&:last-child {
|
||||
|
|
|
@ -13,8 +13,8 @@ $event-ref-stripe-color: scale-color($event-ref-bg, $lightness: -20%);
|
|||
--fc-event-bg-color: #{$event-bg};
|
||||
--fc-event-border-color: #{$event-bg};
|
||||
--fc-event-text-color: #{$white};
|
||||
--fc-non-business-color: #{rgba($gray-200, .3)};
|
||||
--fc-today-bg-color: #{rgba($yellow, .15)};
|
||||
--fc-non-business-color: #{rgba($gray-200, 0.3)};
|
||||
--fc-today-bg-color: #{rgba($yellow, 0.15)};
|
||||
--fc-now-indicator-color: #{$red};
|
||||
|
||||
font-size: 14px;
|
||||
|
@ -77,14 +77,13 @@ $event-ref-stripe-color: scale-color($event-ref-bg, $lightness: -20%);
|
|||
--fc-event-border-color: #{$event-ref-bg};
|
||||
|
||||
&.fc-v-event {
|
||||
background:
|
||||
repeating-linear-gradient(
|
||||
45deg,
|
||||
$event-ref-bg,
|
||||
$event-ref-bg 8px,
|
||||
$event-ref-stripe-color 8px,
|
||||
$event-ref-stripe-color 10px
|
||||
);
|
||||
background: repeating-linear-gradient(
|
||||
45deg,
|
||||
$event-ref-bg,
|
||||
$event-ref-bg 8px,
|
||||
$event-ref-stripe-color 8px,
|
||||
$event-ref-stripe-color 10px
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
|
|
|
@ -37,7 +37,7 @@
|
|||
display: block;
|
||||
width: 100%;
|
||||
margin-bottom: $spacer;
|
||||
content: "";
|
||||
content: '';
|
||||
border-top: 2px solid $hr-color;
|
||||
}
|
||||
|
||||
|
|
|
@ -22,9 +22,9 @@ $table-th-bg: $card-cap-bg;
|
|||
}
|
||||
|
||||
&::before {
|
||||
@include fa-icon();
|
||||
margin-right: .4rem;
|
||||
color: rgba($black, .3);
|
||||
@include fa-icon;
|
||||
margin-right: 0.4rem;
|
||||
color: rgba($black, 0.3);
|
||||
}
|
||||
}
|
||||
|
||||
|
@ -42,7 +42,7 @@ $table-th-bg: $card-cap-bg;
|
|||
--bs-table-bg: $table-th-bg;
|
||||
|
||||
width: 1px;
|
||||
padding: 0 .25rem;
|
||||
padding: 0 0.25rem;
|
||||
white-space: nowrap;
|
||||
border-left-width: 1px;
|
||||
|
||||
|
@ -54,7 +54,7 @@ $table-th-bg: $card-cap-bg;
|
|||
height: 28px;
|
||||
|
||||
&:not(:first-child) {
|
||||
margin-left: .25rem;
|
||||
margin-left: 0.25rem;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
@ -26,12 +26,12 @@
|
|||
|
||||
.content-header {
|
||||
@include grid-cell(shrink);
|
||||
padding: .5rem 0;
|
||||
padding: 0.5rem 0;
|
||||
background-color: $primary-light;
|
||||
border-bottom: 1px solid rgba($primary-dark, .1);
|
||||
border-bottom: 1px solid rgba($primary-dark, 0.1);
|
||||
|
||||
.content-breadcrumb + & {
|
||||
border-top: 1px solid rgba($primary-dark, .1);
|
||||
border-top: 1px solid rgba($primary-dark, 0.1);
|
||||
}
|
||||
}
|
||||
|
||||
|
@ -47,8 +47,8 @@
|
|||
}
|
||||
|
||||
.title-buttons {
|
||||
padding-top: .5rem;
|
||||
margin: .25rem 0 0;
|
||||
padding-top: 0.5rem;
|
||||
margin: 0.25rem 0 0;
|
||||
border-top: 1px solid $hr-color;
|
||||
|
||||
@include media-breakpoint-up(sm) {
|
||||
|
@ -59,7 +59,12 @@
|
|||
|
||||
@include media-breakpoint-down(md) {
|
||||
.btn {
|
||||
@include button-size($btn-padding-y-sm, $btn-padding-x-sm, $btn-font-size-sm, $btn-border-radius-sm);
|
||||
@include button-size(
|
||||
$btn-padding-y-sm,
|
||||
$btn-padding-x-sm,
|
||||
$btn-font-size-sm,
|
||||
$btn-border-radius-sm
|
||||
);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
@ -3,12 +3,12 @@
|
|||
// -----------------------------------------------------------------------------
|
||||
|
||||
.app-footer {
|
||||
padding: .5rem 0;
|
||||
padding: 0.5rem 0;
|
||||
border-top: 1px solid $hr-color;
|
||||
}
|
||||
|
||||
.footer-meta {
|
||||
padding: 0 .5rem;
|
||||
padding: 0 0.5rem;
|
||||
margin-bottom: 0;
|
||||
font-size: 80%;
|
||||
color: $dark;
|
||||
|
@ -18,6 +18,6 @@
|
|||
font-size: 90%;
|
||||
|
||||
.nav-link {
|
||||
padding: 0 .5rem;
|
||||
padding: 0 0.5rem;
|
||||
}
|
||||
}
|
||||
|
|
|
@ -27,7 +27,7 @@
|
|||
left: 0;
|
||||
z-index: $zindex-fixed;
|
||||
background-color: $dark;
|
||||
border-top: 1px solid rgba($black, .1);
|
||||
border-top: 1px solid rgba($black, 0.1);
|
||||
box-shadow: $box-shadow-sm;
|
||||
|
||||
.navbar-nav .nav-link {
|
||||
|
|
|
@ -29,10 +29,10 @@
|
|||
justify-content: center;
|
||||
font-size: 14px;
|
||||
color: $dark;
|
||||
content: "Chargement en cours…";
|
||||
background-color: rgba($body-bg, .5);
|
||||
content: 'Chargement en cours…';
|
||||
background-color: rgba($body-bg, 0.5);
|
||||
opacity: 0;
|
||||
transition: all .1s ease-out;
|
||||
transition: all 0.1s ease-out;
|
||||
}
|
||||
|
||||
&.loading {
|
||||
|
|
|
@ -34,7 +34,7 @@
|
|||
}
|
||||
|
||||
.login-logo {
|
||||
padding: 0 .5rem;
|
||||
padding: 0 0.5rem;
|
||||
margin-bottom: 1rem;
|
||||
text-align: center;
|
||||
|
||||
|
|
|
@ -5,7 +5,7 @@
|
|||
|
||||
/// Import all Bootstrap components
|
||||
|
||||
@import "~bootstrap/scss/bootstrap";
|
||||
@import '~bootstrap/scss/bootstrap';
|
||||
|
||||
/// ... or import them individually
|
||||
|
||||
|
|
|
@ -3,25 +3,26 @@
|
|||
// ----------------------------------------------------------------------------
|
||||
// see: https://forkaweso.me/
|
||||
|
||||
$fa-font-path: "~fork-awesome/fonts";
|
||||
$fa-font-path: '~fork-awesome/fonts';
|
||||
|
||||
@import "~fork-awesome/scss/variables";
|
||||
@import "~fork-awesome/scss/mixins";
|
||||
@import "~fork-awesome/scss/functions";
|
||||
@import "~fork-awesome/scss/core";
|
||||
@import "~fork-awesome/scss/larger";
|
||||
@import "~fork-awesome/scss/fixed-width";
|
||||
@import "~fork-awesome/scss/list";
|
||||
@import '~fork-awesome/scss/variables';
|
||||
@import '~fork-awesome/scss/mixins';
|
||||
@import '~fork-awesome/scss/functions';
|
||||
@import '~fork-awesome/scss/core';
|
||||
@import '~fork-awesome/scss/larger';
|
||||
@import '~fork-awesome/scss/fixed-width';
|
||||
@import '~fork-awesome/scss/list';
|
||||
//@import "~fork-awesome/scss/bordered-pulled";
|
||||
//@import "~fork-awesome/scss/animated";
|
||||
//@import "~fork-awesome/scss/rotated-flipped";
|
||||
@import "~fork-awesome/scss/stacked";
|
||||
@import "~fork-awesome/scss/icons";
|
||||
@import "~fork-awesome/scss/screen-reader";
|
||||
@import '~fork-awesome/scss/stacked';
|
||||
@import '~fork-awesome/scss/icons';
|
||||
@import '~fork-awesome/scss/screen-reader';
|
||||
|
||||
@font-face {
|
||||
font-family: "#{$fa-font-family}";
|
||||
src:
|
||||
url("#{$fa-font-path}/forkawesome-webfont.woff?v=#{$fa-version}") format("woff"),
|
||||
url("#{$fa-font-path}/forkawesome-webfont.woff2?v=#{$fa-version}") format("woff2");
|
||||
font-family: '#{$fa-font-family}';
|
||||
src: url('#{$fa-font-path}/forkawesome-webfont.woff?v=#{$fa-version}')
|
||||
format('woff'),
|
||||
url('#{$fa-font-path}/forkawesome-webfont.woff2?v=#{$fa-version}')
|
||||
format('woff2');
|
||||
}
|
||||
|
|
|
@ -40,9 +40,12 @@
|
|||
"npm-run-all": "^4.1.5",
|
||||
"postcss": "^8.2.6",
|
||||
"postcss-loader": "^5.0.0",
|
||||
"prettier": "^2.2.1",
|
||||
"sass-loader": "^11.0.1",
|
||||
"stylelint": "^13.11.0",
|
||||
"stylelint-config-prettier": "^8.0.2",
|
||||
"stylelint-config-twbs-bootstrap": "^2.1.0",
|
||||
"stylelint-prettier": "^1.1.2",
|
||||
"terser-webpack-plugin": "^5.1.1",
|
||||
"webpack": "^5.24.0",
|
||||
"webpack-cli": "^4.5.0",
|
||||
|
|
Chargement…
Référencer dans un nouveau ticket