jason/DigitalConsumer.FixMyGlass
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

csr-116 css file and code organization.

Browse source 
Renamed files and moved code for clarity.
This commit is contained in:
Bryan 2021-11-03 09:10:33 -04:00
parent 06f3f00370
commit 45a75e11e2
5 changed files with 73 additions and 71 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

62
src/assets/scss/_GlobalStyles.scss
View file

@ -1,62 +0,0 @@
body {
font-size: 16px;
background-color: #fff;
padding: .5rem;
.container-fluid {
max-width: 576px;
&.container-shadow {
box-shadow: 0px 0px 6px 0px rgba(0,0,0,0.15);//Use instead of Bootstrap's helper
}
}
a {
color: $blue-600;
text-decoration: none;
border-bottom: 1px solid $blue-600;
&:hover {
color: $blue-400;
}
}
.pointer {
cursor: pointer;
}
}
//Typogrophy
p {
line-height: 1.625;
font-weight: 400;
small,.small {
font-size: .875rem;
}
}
//Headings
//font-size defined in _CustomVariables.scss
//add helper fw-bold to any element to get bold style (500)
//add helper fw-light to any element to get light style (300)
h1,.h1 {
line-height: 1.325;
font-weight: 300;
}
h2,.h2 {
line-height: 1.325;
font-weight: 300;
}
h3,.h3 {
line-height: 1.375;
font-weight: 300;
}
h4,.h4 {
line-height: 1.6;
font-weight: 300;
}
h5,.h5 {
line-height: 1.325;
font-weight: 400;
}
h6,.h6 {
line-height: 1.7;
letter-spacing: .75px;
text-transform: uppercase;
}

7
src/assets/scss/_CustomVariables.scss → src/assets/scss/_custom-variables.scss
View file

@ -1,4 +1,4 @@
// Color system
//Colors
// White/black
$white: #FFFFFF;
@ -67,8 +67,6 @@ $orange: #fd7e14;
$teal: #20c997;
$cyan: #0dcaf0;
// scss-docs-end color-variables
// scss-docs-start colors-map
$colors: (
"blue": $blue,
@ -85,7 +83,6 @@ $colors: (
"gray": $gray,
"gray-dark": $gray-500
);
// scss-docs-end colors-map
// scss-docs-start theme-color-variables
$primary: $blue;
@ -96,7 +93,6 @@ $warning: $yellow;
$danger: $red;
$light: $gray-100;
$dark: $gray-500;
// scss-docs-end theme-color-variables
// scss-docs-start theme-colors-map
$theme-colors: (
@ -109,7 +105,6 @@ $theme-colors: (
"light": $light,
"dark": $dark
);
// scss-docs-end theme-colors-map
//Fonts
$font-family-sans-serif: Roboto, Arial, Helvetica, sans-serif;

22
src/assets/scss/_global-styles.scss Normal file
View file

@ -0,0 +1,22 @@
body {
font-size: 16px;
background-color: #fff;
padding: .5rem;
.container-fluid {
max-width: 576px;//Remove once desktop app is complete
&.container-shadow {
box-shadow: 0px 0px 6px 0px rgba(0,0,0,0.15);//Use instead of Bootstrap's helper
}
}
a {
color: $blue-600;
text-decoration: none;
border-bottom: 1px solid $blue-600;
&:hover {
color: $blue-400;
}
}
.pointer {
cursor: pointer;
}
}

46
src/assets/scss/components/_typogrophy.scss Normal file
View file

@ -0,0 +1,46 @@
//Typogrophy
p {
font-size: 16px;
line-height: 1.625;
font-weight: 400;
}
//Headings
//font-size defined in _custom-variables.scss
//add helper fw-bold to any element to get bold style (500)
h1,.h1 {
line-height: 1.325;
font-weight: 300;
}
h2,.h2 {
line-height: 1.325;
font-weight: 300;
}
h3,.h3 {
line-height: 1.375;
font-weight: 300;
}
h4,.h4 {
line-height: 1.6;
font-weight: 300;
}
h5,.h5 {
line-height: 1.325;
font-weight: 400;
}
h6,.h6 {
line-height: 1.7;
letter-spacing: .75px;
text-transform: uppercase;
}
label {
line-height: 1.625;
font-weight: 400;
}
caption {
font-size: .75rem;
line-height: 1.7;
font-weight: 400;
}

7
src/assets/scss/custom.scss
View file

@ -4,7 +4,7 @@
@import "./node_modules/bootstrap/scss/functions";
//Variable Overrides
@import "_CustomVariables";
@import "_custom-variables";
//Bootstrap Default Variables and Mixins
@import "./node_modules/bootstrap/scss/variables";
@ -14,11 +14,12 @@
@import "./node_modules/bootstrap/scss/bootstrap";
//Custom Global CSS
@import "_GlobalStyles";
@import "_global-styles";
//Custom Components CSS
@import "./components/_typogrophy";
@import "./components/_navbar";
@import "./components/_SelectCar";
@import "./components/_SelectCar";
@import "./components/_buttons";
@import "./components/_vehicle-image";
@import "./components/_radio-card";