first commit
This commit is contained in:
2
public/scss/abstracts/_index.scss
Normal file
2
public/scss/abstracts/_index.scss
Normal file
@ -0,0 +1,2 @@
|
||||
@forward "./variable";
|
||||
@forward "./mixin";
|
||||
75
public/scss/abstracts/_mixin.scss
Normal file
75
public/scss/abstracts/_mixin.scss
Normal file
@ -0,0 +1,75 @@
|
||||
@mixin flex($alignItem, $justifyContent) {
|
||||
display: -webkit-box;
|
||||
display: -moz-box;
|
||||
display: -ms-flexbox;
|
||||
display: -webkit-flex;
|
||||
display: flex;
|
||||
align-items: $alignItem;
|
||||
justify-content: $justifyContent;
|
||||
}
|
||||
@mixin grid($loop, $num, $row-gap, $col-gap) {
|
||||
display: grid;
|
||||
grid-template-columns: repeat($loop, $num);
|
||||
gap: $row-gap $col-gap;
|
||||
}
|
||||
@mixin d-flex() {
|
||||
display: -webkit-box;
|
||||
display: -moz-box;
|
||||
display: -ms-flexbox;
|
||||
display: -webkit-flex;
|
||||
display: flex;
|
||||
}
|
||||
@mixin centered() {
|
||||
top: 50%;
|
||||
left: 50%;
|
||||
-webkit-transform: translate(-50%, -50%);
|
||||
-moz-transform: translate(-50%, -50%);
|
||||
-ms-transform: translate(-50%, -50%);
|
||||
-o-transform: translate(-50%, -50%);
|
||||
transform: translate(-50%, -50%);
|
||||
}
|
||||
@mixin center($x, $y) {
|
||||
-webkit-transform: translate($x,$y);
|
||||
-moz-transform: translate($x,$y);
|
||||
-ms-transform: translate($x,$y);
|
||||
-o-transform: translate($x,$y);
|
||||
transform: translate($x,$y);
|
||||
}
|
||||
|
||||
// --------------------------
|
||||
|
||||
@mixin transition1 (){
|
||||
-webkit-transition: all 0.1s ease;
|
||||
-moz-transition : all 0.1s ease;
|
||||
-ms-transition : all 0.1s ease;
|
||||
-o-transition : all 0.1s ease;
|
||||
transition : all 0.1s ease;
|
||||
}
|
||||
@mixin transition2 (){
|
||||
-webkit-transition: all 0.2s ease;
|
||||
-moz-transition : all 0.2s ease;
|
||||
-ms-transition : all 0.2s ease;
|
||||
-o-transition : all 0.2s ease;
|
||||
transition : all 0.2s ease;
|
||||
}
|
||||
@mixin transition3 (){
|
||||
-webkit-transition: all 0.3s ease;
|
||||
-moz-transition : all 0.3s ease;
|
||||
-ms-transition : all 0.3s ease;
|
||||
-o-transition : all 0.3s ease;
|
||||
transition : all 0.3s ease;
|
||||
}
|
||||
@mixin transition4 (){
|
||||
-webkit-transition: all 0.4s ease;
|
||||
-moz-transition : all 0.4s ease;
|
||||
-ms-transition : all 0.4s ease;
|
||||
-o-transition : all 0.4s ease;
|
||||
transition : all 0.4s ease;
|
||||
}
|
||||
@mixin transition5 (){
|
||||
-webkit-transition: all 0.5s ease;
|
||||
-moz-transition : all 0.5s ease;
|
||||
-ms-transition : all 0.5s ease;
|
||||
-o-transition : all 0.5s ease;
|
||||
transition : all 0.5s ease;
|
||||
}
|
||||
70
public/scss/abstracts/_variable.scss
Normal file
70
public/scss/abstracts/_variable.scss
Normal file
@ -0,0 +1,70 @@
|
||||
$font-main: "Inter Tight", serif;
|
||||
$font-main2: "DM Sans", serif;
|
||||
$font-main3: "Inter", serif;
|
||||
$fontIcon: "icomoon";
|
||||
|
||||
:root {
|
||||
--Black: #000000;
|
||||
--White: #ffffff;
|
||||
--Mono-gray-1: #f5f6f7;
|
||||
--Mono-gray-2: #e0e3e6;
|
||||
--Mono-gray-3: #bec5cb;
|
||||
--Mono-gray-4: #9fa9b2;
|
||||
--Mono-gray-5: #7e8995;
|
||||
--Mono-gray-6: #636e78;
|
||||
--Mono-gray-7: #49525a;
|
||||
--Mono-gray-8: #7e8695;
|
||||
--Mono-dark-8: #2e3338;
|
||||
--Mono-dark-9: #121416;
|
||||
--Mono-dark-10: #383838;
|
||||
--Mono-dark-11: #121212;
|
||||
--Color-dark: #3f3d2e;
|
||||
--Sub-color-1: #f2f6ff;
|
||||
--Sub-color-2: #e0eae8;
|
||||
--Sub-color-3: #458182;
|
||||
--Color-text-1: #6ef193;
|
||||
--Color-text-2: #9da5b4;
|
||||
--Color-text-3: #9da5b4;
|
||||
--Border: #dee3ee;
|
||||
--Error: #ec3232;
|
||||
--Bg-color-1: #f9f5f1;
|
||||
--Bg-color-2: #c9d2f4;
|
||||
--Bg-color-3: #f5f2f0;
|
||||
// Insurance Consulting
|
||||
--Primary-ic-blue: #8fa8fb;
|
||||
--Primary-ic-red: #ff8283;
|
||||
--Primary-ic-green: #a7decf;
|
||||
--Primary-ic-yellow: #fedc6e;
|
||||
// Business Consulting
|
||||
--Primary: #0075ff;
|
||||
--Primary-1: #e2ecf9;
|
||||
--Primary-2: #cfe6ff;
|
||||
--Primary-3: #bfd8fe;
|
||||
// Finance Consulting
|
||||
--Primary-fc-green-100: #1c3f3a;
|
||||
|
||||
// Finance Advisor
|
||||
|
||||
--Primary-fa-blue-10: #def5ff;
|
||||
--Primary-fa-orange-10: #ffead3;
|
||||
--Primary-fa-green-10: #eef9f1;
|
||||
--Primary-fa-purple-10: #dfdeff;
|
||||
--Primary-fa-orange-30: #f3af7c;
|
||||
--Primary-fa-yellow-10: #fbfaf2;
|
||||
--Primary-fa-green: #1c5551;
|
||||
// Marketing Consulting
|
||||
}
|
||||
|
||||
.primary-1 {
|
||||
--Primary: #1c3f3a;
|
||||
}
|
||||
.primary-2 {
|
||||
--Primary: #604cc3;
|
||||
--Sub-color-2: #f5f5ff;
|
||||
}
|
||||
.primary-3 {
|
||||
--Primary: #28285b;
|
||||
}
|
||||
.primary-4 {
|
||||
--Primary: #fc6a2b;
|
||||
}
|
||||
Reference in New Issue
Block a user