Walidoux/next-app-boilerplate
Template
1
0
Fork 0
Code Issues Pull Requests Actions Releases Activity

refactor(prettier): add formater prettier code

Browse Source
This commit is contained in:
Walid
2022-03-17 01:11:10 +01:00
parent 5c56b266a6
commit 077845e05c
14 changed files with 261 additions and 251 deletions
Download Patch File Download Diff File Expand all files Collapse all files

6
styles/abstracts/_colors.scss
View File

@ -1,10 +1,10 @@
$colors: (
primary: (
400: #fff,
600: #d9d9d9,
600: #d9d9d9
),
secondary: (
400: #000,
600: #272727,
),
600: #272727
)
);

8
styles/abstracts/_mixins.scss
View File

@ -1,4 +1,4 @@
@import "variables";
@import 'variables';
@mixin display-flex($content: center, $items: center, $direction: row) {
display: flex;
@ -8,7 +8,7 @@
}
@mixin element-invisible($enforce: true) {
$important: if($enforce, "!important", null);
$important: if($enforce, '!important', null);
max-height: 0 #{$important};
opacity: 0 #{$important};
@ -17,7 +17,7 @@
}
@mixin element-invisible-off($value-visibility: 100px, $enforce: true) {
$important: if($enforce, "!important", null);
$important: if($enforce, '!important', null);
max-height: #{$value-visibility} #{$important};
opacity: 1 #{$important};
@ -25,7 +25,7 @@
}
@mixin css-triangle($triangle-size, $triangle-color, $triangle-direction) {
content: "";
content: '';
display: block;
width: 0;
height: 0;

2
styles/abstracts/_variables.scss
View File

@ -2,5 +2,5 @@ $default-transition: 0.3s ease;
$breakpoints: (
small: 320px,
medium: 768px,
large: 1024px,
large: 1024px
) !default;

4
styles/base/_helpers.scss
View File

@ -1,8 +1,8 @@
@import "variables";
@import 'variables';
%content {
position: absolute;
content: "";
content: '';
}
%container {

2
styles/base/_root.scss
View File

@ -1,4 +1,4 @@
@use "../abstracts/colors" as *;
@use '../abstracts/colors' as *;
:root {
@each $color, $shades in $colors {

360
styles/main.scss
View File

@ -1,182 +1,182 @@
@use "base/root" as *;
@use "vendors/normalize" as *;
@use 'base/root' as *;
@use 'vendors/normalize' as *;
@font-face {
font-family: Poppins-Italic;
src: url("/fonts/Poppins-Italic.woff2") format("woff2"),
url("/fonts/Poppins-Italic.woff") format("woff"),
url("/fonts/Poppins-Italic.ttf") format("truetype");
font-weight: normal;
font-style: italic;
font-display: swap;
}
@font-face {
font-family: Poppins-Light-Italic;
src: url("/fonts/Poppins-LightItalic.woff2") format("woff2"),
url("/fonts/Poppins-LightItalic.woff") format("woff"),
url("/fonts/Poppins-LightItalic.ttf") format("truetype");
font-weight: 300;
font-style: italic;
font-display: swap;
}
@font-face {
font-family: Poppins-SemiBold;
src: url("/fonts/Poppins-SemiBold.woff2") format("woff2"),
url("/fonts/Poppins-SemiBold.woff") format("woff"),
url("/fonts/Poppins-SemiBold.ttf") format("truetype");
font-weight: 600;
font-style: normal;
font-display: swap;
}
@font-face {
font-family: Poppins-Thin;
src: url("/fonts/Poppins-Thin.woff2") format("woff2"),
url("/fonts/Poppins-Thin.woff") format("woff"),
url("/fonts/Poppins-Thin.ttf") format("truetype");
font-weight: 100;
font-style: normal;
font-display: swap;
}
@font-face {
font-family: Poppins-Medium-Italic;
src: url("/fonts/Poppins-MediumItalic.woff2") format("woff2"),
url("/fonts/Poppins-MediumItalic.woff") format("woff"),
url("/fonts/Poppins-MediumItalic.ttf") format("truetype");
font-weight: 500;
font-style: italic;
font-display: swap;
}
@font-face {
font-family: Poppins-Regular;
src: url("/fonts/Poppins-Regular.woff2") format("woff2"),
url("/fonts/Poppins-Regular.woff") format("woff"),
url("/fonts/Poppins-Regular.ttf") format("truetype");
font-weight: normal;
font-style: normal;
font-display: swap;
}
@font-face {
font-family: Poppins-Extra-Bold-Italic;
src: url("/fonts/Poppins-ExtraBoldItalic.woff2") format("woff2"),
url("/fonts/Poppins-ExtraBoldItalic.woff") format("woff"),
url("/fonts/Poppins-ExtraBoldItalic.ttf") format("truetype");
font-weight: bold;
font-style: italic;
font-display: swap;
}
@font-face {
font-family: Poppins-Extra-Light-Italic;
src: url("/fonts/Poppins-ExtraLightItalic.woff2") format("woff2"),
url("/fonts/Poppins-ExtraLightItalic.woff") format("woff"),
url("/fonts/Poppins-ExtraLightItalic.ttf") format("truetype");
font-weight: 200;
font-style: italic;
font-display: swap;
}
@font-face {
font-family: Poppins-Light;
src: url("/fonts/Poppins-Light.woff2") format("woff2"),
url("/fonts/Poppins-Light.woff") format("woff"),
url("/fonts/Poppins-Light.ttf") format("truetype");
font-weight: 300;
font-style: normal;
font-display: swap;
}
@font-face {
font-family: Poppins-Medium;
src: url("/fonts/Poppins-Medium.woff2") format("woff2"),
url("/fonts/Poppins-Medium.woff") format("woff"),
url("/fonts/Poppins-Medium.ttf") format("truetype");
font-weight: 500;
font-style: normal;
font-display: swap;
}
@font-face {
font-family: Poppins-Semi-Bold-Italic;
src: url("/fonts/Poppins-SemiBoldItalic.woff2") format("woff2"),
url("/fonts/Poppins-SemiBoldItalic.woff") format("woff"),
url("/fonts/Poppins-SemiBoldItalic.ttf") format("truetype");
font-weight: 600;
font-style: italic;
font-display: swap;
}
@font-face {
font-family: Poppins-Extra-Light;
src: url("/fonts/Poppins-ExtraLight.woff2") format("woff2"),
url("/fonts/Poppins-ExtraLight.woff") format("woff"),
url("/fonts/Poppins-ExtraLight.ttf") format("truetype");
font-weight: 200;
font-style: normal;
font-display: swap;
}
@font-face {
font-family: Poppins-Thin-Italic;
src: url("/fonts/Poppins-ThinItalic.woff2") format("woff2"),
url("/fonts/Poppins-ThinItalic.woff") format("woff"),
url("/fonts/Poppins-ThinItalic.ttf") format("truetype");
font-weight: 100;
font-style: italic;
font-display: swap;
}
@font-face {
font-family: Poppins-Black;
src: url("/fonts/Poppins-Black.woff2") format("woff2"),
url("/fonts/Poppins-Black.woff") format("woff"),
url("/fonts/Poppins-Black.ttf") format("truetype");
font-weight: 900;
font-style: normal;
font-display: swap;
}
@font-face {
font-family: Poppins;
src: url("/fonts/Poppins-BoldItalic.woff2") format("woff2"),
url("/fonts/Poppins-BoldItalic.woff") format("woff"),
url("/fonts/Poppins-BoldItalic.ttf") format("truetype");
font-weight: bold;
font-style: italic;
font-display: swap;
}
@font-face {
font-family: Poppins-Bold;
src: url("/fonts/Poppins-Bold.woff2") format("woff2"),
url("/fonts/Poppins-Bold.woff") format("woff"),
url("/fonts/Poppins-Bold.ttf") format("truetype");
font-weight: bold;
font-style: normal;
font-display: swap;
}
@font-face {
font-family: Poppins-Black-Italic;
src: url("/fonts/Poppins-BlackItalic.woff2") format("woff2"),
url("/fonts/Poppins-BlackItalic.woff") format("woff"),
url("/fonts/Poppins-BlackItalic.ttf") format("truetype");
font-weight: 900;
font-style: italic;
font-display: swap;
}
@font-face {
font-family: Poppins-Extra-Bold;
src: url("/fonts/Poppins-ExtraBold.woff2") format("woff2"),
url("/fonts/Poppins-ExtraBold.woff") format("woff"),
url("/fonts/Poppins-ExtraBold.ttf") format("truetype");
font-weight: bold;
font-style: normal;
font-display: swap;
}
font-family: Poppins-Italic;
src: url('/fonts/Poppins-Italic.woff2') format('woff2'),
url('/fonts/Poppins-Italic.woff') format('woff'),
url('/fonts/Poppins-Italic.ttf') format('truetype');
font-weight: normal;
font-style: italic;
font-display: swap;
}
@font-face {
font-family: Poppins-Light-Italic;
src: url('/fonts/Poppins-LightItalic.woff2') format('woff2'),
url('/fonts/Poppins-LightItalic.woff') format('woff'),
url('/fonts/Poppins-LightItalic.ttf') format('truetype');
font-weight: 300;
font-style: italic;
font-display: swap;
}
@font-face {
font-family: Poppins-SemiBold;
src: url('/fonts/Poppins-SemiBold.woff2') format('woff2'),
url('/fonts/Poppins-SemiBold.woff') format('woff'),
url('/fonts/Poppins-SemiBold.ttf') format('truetype');
font-weight: 600;
font-style: normal;
font-display: swap;
}
@font-face {
font-family: Poppins-Thin;
src: url('/fonts/Poppins-Thin.woff2') format('woff2'),
url('/fonts/Poppins-Thin.woff') format('woff'),
url('/fonts/Poppins-Thin.ttf') format('truetype');
font-weight: 100;
font-style: normal;
font-display: swap;
}
@font-face {
font-family: Poppins-Medium-Italic;
src: url('/fonts/Poppins-MediumItalic.woff2') format('woff2'),
url('/fonts/Poppins-MediumItalic.woff') format('woff'),
url('/fonts/Poppins-MediumItalic.ttf') format('truetype');
font-weight: 500;
font-style: italic;
font-display: swap;
}
@font-face {
font-family: Poppins-Regular;
src: url('/fonts/Poppins-Regular.woff2') format('woff2'),
url('/fonts/Poppins-Regular.woff') format('woff'),
url('/fonts/Poppins-Regular.ttf') format('truetype');
font-weight: normal;
font-style: normal;
font-display: swap;
}
@font-face {
font-family: Poppins-Extra-Bold-Italic;
src: url('/fonts/Poppins-ExtraBoldItalic.woff2') format('woff2'),
url('/fonts/Poppins-ExtraBoldItalic.woff') format('woff'),
url('/fonts/Poppins-ExtraBoldItalic.ttf') format('truetype');
font-weight: bold;
font-style: italic;
font-display: swap;
}
@font-face {
font-family: Poppins-Extra-Light-Italic;
src: url('/fonts/Poppins-ExtraLightItalic.woff2') format('woff2'),
url('/fonts/Poppins-ExtraLightItalic.woff') format('woff'),
url('/fonts/Poppins-ExtraLightItalic.ttf') format('truetype');
font-weight: 200;
font-style: italic;
font-display: swap;
}
@font-face {
font-family: Poppins-Light;
src: url('/fonts/Poppins-Light.woff2') format('woff2'),
url('/fonts/Poppins-Light.woff') format('woff'),
url('/fonts/Poppins-Light.ttf') format('truetype');
font-weight: 300;
font-style: normal;
font-display: swap;
}
@font-face {
font-family: Poppins-Medium;
src: url('/fonts/Poppins-Medium.woff2') format('woff2'),
url('/fonts/Poppins-Medium.woff') format('woff'),
url('/fonts/Poppins-Medium.ttf') format('truetype');
font-weight: 500;
font-style: normal;
font-display: swap;
}
@font-face {
font-family: Poppins-Semi-Bold-Italic;
src: url('/fonts/Poppins-SemiBoldItalic.woff2') format('woff2'),
url('/fonts/Poppins-SemiBoldItalic.woff') format('woff'),
url('/fonts/Poppins-SemiBoldItalic.ttf') format('truetype');
font-weight: 600;
font-style: italic;
font-display: swap;
}
@font-face {
font-family: Poppins-Extra-Light;
src: url('/fonts/Poppins-ExtraLight.woff2') format('woff2'),
url('/fonts/Poppins-ExtraLight.woff') format('woff'),
url('/fonts/Poppins-ExtraLight.ttf') format('truetype');
font-weight: 200;
font-style: normal;
font-display: swap;
}
@font-face {
font-family: Poppins-Thin-Italic;
src: url('/fonts/Poppins-ThinItalic.woff2') format('woff2'),
url('/fonts/Poppins-ThinItalic.woff') format('woff'),
url('/fonts/Poppins-ThinItalic.ttf') format('truetype');
font-weight: 100;
font-style: italic;
font-display: swap;
}
@font-face {
font-family: Poppins-Black;
src: url('/fonts/Poppins-Black.woff2') format('woff2'),
url('/fonts/Poppins-Black.woff') format('woff'),
url('/fonts/Poppins-Black.ttf') format('truetype');
font-weight: 900;
font-style: normal;
font-display: swap;
}
@font-face {
font-family: Poppins;
src: url('/fonts/Poppins-BoldItalic.woff2') format('woff2'),
url('/fonts/Poppins-BoldItalic.woff') format('woff'),
url('/fonts/Poppins-BoldItalic.ttf') format('truetype');
font-weight: bold;
font-style: italic;
font-display: swap;
}
@font-face {
font-family: Poppins-Bold;
src: url('/fonts/Poppins-Bold.woff2') format('woff2'),
url('/fonts/Poppins-Bold.woff') format('woff'),
url('/fonts/Poppins-Bold.ttf') format('truetype');
font-weight: bold;
font-style: normal;
font-display: swap;
}
@font-face {
font-family: Poppins-Black-Italic;
src: url('/fonts/Poppins-BlackItalic.woff2') format('woff2'),
url('/fonts/Poppins-BlackItalic.woff') format('woff'),
url('/fonts/Poppins-BlackItalic.ttf') format('truetype');
font-weight: 900;
font-style: italic;
font-display: swap;
}
@font-face {
font-family: Poppins-Extra-Bold;
src: url('/fonts/Poppins-ExtraBold.woff2') format('woff2'),
url('/fonts/Poppins-ExtraBold.woff') format('woff'),
url('/fonts/Poppins-ExtraBold.ttf') format('truetype');
font-weight: bold;
font-style: normal;
font-display: swap;
}

40
styles/vendors/_normalize.scss vendored
View File

@ -149,18 +149,18 @@ select {
// Correct the inability to style clickable types in iOS and Safari.
button,
[type="button"],
[type="reset"],
[type="submit"] {
[type='button'],
[type='reset'],
[type='submit'] {
-webkit-appearance: button;
}
// Remove the inner border and padding in Firefox.
button::-moz-focus-inner,
[type="button"]::-moz-focus-inner,
[type="reset"]::-moz-focus-inner,
[type="submit"]::-moz-focus-inner {
[type='button']::-moz-focus-inner,
[type='reset']::-moz-focus-inner,
[type='submit']::-moz-focus-inner {
border-style: none;
padding: 0;
}
@ -168,9 +168,9 @@ button::-moz-focus-inner,
// Restore the focus styles unset by the previous rule.
button:-moz-focusring,
[type="button"]:-moz-focusring,
[type="reset"]:-moz-focusring,
[type="submit"]:-moz-focusring {
[type='button']:-moz-focusring,
[type='reset']:-moz-focusring,
[type='submit']:-moz-focusring {
outline: 1px dotted ButtonText;
}
@ -209,30 +209,30 @@ textarea {
// 1. Add the correct box sizing in IE 10.
// 2. Remove the padding in IE 10.
[type="checkbox"],
[type="radio"] {
[type='checkbox'],
[type='radio'] {
box-sizing: border-box; // 1
padding: 0; // 2
}
// Correct the cursor style of increment and decrement buttons in Chrome.
[type="number"]::-webkit-inner-spin-button,
[type="number"]::-webkit-outer-spin-button {
[type='number']::-webkit-inner-spin-button,
[type='number']::-webkit-outer-spin-button {
height: auto;
}
// 1. Correct the odd appearance in Chrome and Safari.
// 2. Correct the outline style in Safari.
[type="search"] {
[type='search'] {
-webkit-appearance: textfield; // 1
outline-offset: -2px; // 2
}
// Remove the inner padding in Chrome and Safari on macOS.
[type="search"]::-webkit-search-decoration {
[type='search']::-webkit-search-decoration {
-webkit-appearance: none;
}
@ -275,10 +275,10 @@ template {
}
// Disable outline when intent is clearly mouse and touch
[data-whatintent="mouse"],
[data-whatintent="touch"],
[data-whatinput="mouse"],
[data-whatinput="touch"] {
[data-whatintent='mouse'],
[data-whatintent='touch'],
[data-whatinput='mouse'],
[data-whatinput='touch'] {
*,
*:focus {
outline: none;
@ -286,7 +286,7 @@ template {
}
// Disable iOS callouts when draggable is false
[draggable="false"] {
[draggable='false'] {
-webkit-touch-callout: none;
-webkit-user-select: none;
}