CBSNexora/cbsnexora
4
0
Fork 0
Code Issues Pull Requests Actions 1 Packages Projects Releases Wiki Activity

build: Upgrade stylelint to version 16 and fix issues

Browse Source 
Migrate upgrade stylelint from version 10 to 16 and fix all the
stylelint and prettier issues in scss files.

The following deprecated stylistic rules are no longer supported in
stylelint, and the checks are taken over by prettier:

- string-quotes
- max-empty-lines
- max-line-length
This commit is contained in:
Ralph Hopman
2024-11-28 13:46:48 +01:00
committed by Adam Saghy
parent 756ce9e0c7
commit 31f1890051
345 changed files with 2308 additions and 4783 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/theme/_content.scss
+52 -39
View File
@@ -1,7 +1,8 @@
@use "@angular/material" as mat;
@use '@angular/material' as mat;
@use 'sass:map';
@mixin account-view-component-theme($theme) {
$primary: map-get($theme, primary);
$primary: map.get($theme, primary);
mifosx-view-bulk-import {
.cover {
@@ -27,69 +28,81 @@
max-width: 80rem;
width: 90%;
padding: 0;
i,
img:hover {
cursor: pointer;
}
.header {
background-color: mat.get-color-from-palette($primary, 500);
padding: 1%;
.header-title-group {
.account-card-title {
color: white;
width: 90%;
p {
color: white;
}
}
.account-overview {
border: none;
max-width: 240px;
font-size: 14px;
.header-title-group {
.account-card-title {
color: white;
width: 90%;
}
tr:nth-child(even) {
background-color: transparent;
}
}
}
p {
color: white;
}
.profile-image-container {
margin: 1%;
.profile-image {
object-fit: cover;
border-radius: 20px;
}
.signature {
background-color: mat.get-color-from-palette($primary, 500);
}
}
.account-actions {
align-self: flex-end;
margin: 0 1%;
i {
margin-bottom: 2px;
margin-right: 4px;
.account-overview {
border: none;
max-width: 240px;
font-size: 14px;
tr:nth-child(even) {
background-color: transparent;
}
}
}
.profile-image-container {
margin: 1%;
.profile-image {
object-fit: cover;
border-radius: 20px;
}
.signature {
background-color: mat.get-color-from-palette($primary, 500);
}
}
.account-actions {
align-self: flex-end;
margin: 0 1%;
i {
margin-bottom: 2px;
margin-right: 4px;
}
}
.navigation-tabs {
background-color: #f2f2f2;
overflow: auto;
}
.content {
.savings-account-tables {
padding: 1%;
margin: 1%;
.table-headers {
margin: 0;
padding: 6px;
}
td {
padding: 3px;
}
}
}
i,
img:hover {
cursor: pointer;
}
}
}
}
src/theme/_dark_content.scss
+56 -58
View File
@@ -1,8 +1,8 @@
@use "@angular/material" as mat;
@use '@angular/material' as mat;
@use 'sass:map';
@mixin account-view-component-dark-theme($theme) {
$primary: map-get($theme, primary);
$primary: map.get($theme, primary);
mifosx-login {
.login-container {
@@ -13,18 +13,18 @@
.cover {
.cover-content {
color: white;
.cover-description {
.cover-link {
color: white !important;
&:hover {
color: #d3d3d3;
}
}
}
}
}
}
}
mifosx-login-form {
@@ -56,56 +56,60 @@
width: 90%;
padding: 0;
i,
img:hover {
cursor: pointer;
}
.header {
background-color: mat.get-color-from-palette($primary, 500);
padding: 1%;
}
.header-title-group {
.account-card-title {
color: white;
width: 90%;
p {
color: white;
}
.account-overview {
border: none;
max-width: 240px;
font-size: 14px;
tr:nth-child(even) {
background-color: transparent !important;
}
}
}
.header-title-group {
.account-card-title {
color: white;
width: 90%;
}
.profile-image-container {
margin: 1%;
.profile-image {
object-fit: cover;
border-radius: 20px;
}
.signature {
background-color: mat.get-color-from-palette($primary, 500);
}
p {
color: white;
}
.account-actions {
align-self: flex-end;
margin: 0 1%;
.account-overview {
border: none;
max-width: 240px;
font-size: 14px;
i {
margin-bottom: 2px;
margin-right: 4px;
tr:nth-child(even) {
background-color: transparent !important;
}
}
}
.profile-image-container {
margin: 1%;
.profile-image {
object-fit: cover;
border-radius: 20px;
}
.signature {
background-color: mat.get-color-from-palette($primary, 500);
}
}
.account-actions {
align-self: flex-end;
margin: 0 1%;
i {
margin-bottom: 2px;
margin-right: 4px;
}
}
.navigation-tabs {
background-color: #303135;
color: white;
@@ -127,11 +131,6 @@
}
}
}
i,
img:hover {
cursor: pointer;
}
}
}
@@ -140,7 +139,6 @@
mat-checkbox {
color: white;
}
}
body.dark-theme {
@@ -193,16 +191,16 @@ body.dark-theme {
filter: invert(100%);
}
a:any-link {
color: #0098ff !important;
}
span.breadcrumb-link {
a {
color: #0098ff !important;
}
}
a:-webkit-any-link {
color: #0098ff !important;
}
div.alert {
color: #303135;
}
@@ -215,9 +213,10 @@ body.dark-theme {
.cdk-drag-preview {
box-sizing: border-box;
border-radius: 4px;
box-shadow: 0 5px 5px -3px rgba(0, 0, 0, 0.2),
0 8px 10px 1px rgba(0, 0, 0, 0.14),
0 3px 14px 2px rgba(0, 0, 0, 0.12);
box-shadow:
0 5px 5px -3px rgb(0 0 0 / 20%),
0 8px 10px 1px rgb(0 0 0 / 14%),
0 3px 14px 2px rgb(0 0 0 / 12%);
display: table;
background-color: white;
color: #303135;
@@ -233,7 +232,7 @@ body.dark-theme {
.versions {
color: white !important;
}
.business-date {
color: #0098ff;
}
@@ -242,5 +241,4 @@ body.dark-theme {
.external-asset-owner-status {
color: white;
}
}
src/theme/_material-palette.scss
+8 -9
View File
@@ -1,12 +1,11 @@
/* ############ Light mode palettes ################*/
/* ############ Light mode palettes ################ */
$primary-palette: (
100: #5ba2ec,
500: #1074b9,
700: #004989,
contrast: (
100: rgba(black, 0.87),
100: rgb(0 0 0 / 87%),
500: white,
700: white
)
@@ -17,13 +16,13 @@ $accent-palette: (
500: #b4d575,
700: #83a447,
contrast: (
100: rgba(black, 0.87),
500: rgba(black, 0.87),
700: rgba(black, 0.87)
100: rgb(0 0 0 / 87%),
500: rgb(0 0 0 / 87%),
700: rgb(0 0 0 / 87%)
)
);
/* ############ Dark mode palettes ################*/
/* ############ Dark mode palettes ################ */
$dark-primary-palette: (
100: #5ba2ec,
@@ -31,8 +30,8 @@ $dark-primary-palette: (
700: #004989,
contrast: (
100: white,
500: rgba(white, 0.87),
700: rgba(white, 0.87)
500: rgb(255 255 255 / 87%),
700: rgb(255 255 255 / 87%)
)
);
src/theme/mifosx-theme.scss
+13 -17
View File
@@ -1,25 +1,23 @@
@use '@angular/material' as mat;
// Custom material palette
@import 'material-palette';
@use 'material-palette' as *;
// Plus imports for other components in your app.
@import '../app/groups/groups-view/groups-view.component-theme.scss';
@import '../app/centers/centers-view/centers-view.component-theme.scss';
@import '../app/home/dashboard/dashboard.component-theme.scss';
@import '../app/shares/shares-account-view/shares-account-view.component-theme.scss';
@import 'content';
@import 'dark_content';
@use '../app/groups/groups-view/groups-view.component-theme.scss' as *;
@use '../app/centers/centers-view/centers-view.component-theme.scss' as *;
@use '../app/home/dashboard/dashboard.component-theme.scss' as *;
@use '../app/shares/shares-account-view/shares-account-view.component-theme.scss' as *;
@use 'content' as *;
@use 'dark_content' as *;
// Include the common styles for Angular Material. We include this here so that you only
// have to load a single css file for Angular Material in your app.
// Be sure that you only ever include this mixin once!
@include mat.core();
/* ################################## Light theme ################################### */
// Define the palettes for your theme using the Material Design palettes available in palette.scss
// (imported above). For each palette, you can optionally specify a default, lighter, and darker
// hue. Available color palettes: https://material.io/design/color/
@@ -42,10 +40,8 @@ $mifosx-app-theme: mat.define-light-theme($mifosx-app-primary, $mifosx-app-accen
@include shares-account-view-component-theme($mifosx-app-theme);
@include account-view-component-theme($mifosx-app-theme);
/* ################################## Dark theme ################################### */
// Define the palettes for your theme using the Material Design palettes available in palette.scss
$mifosx-app-dark-primary: mat.define-palette($dark-primary-palette);
$mifosx-app-dark-accent: mat.define-palette($dark-accent-palette);
@@ -56,10 +52,10 @@ $mifosx-app-dark-theme: mat.define-dark-theme($mifosx-app-dark-primary, $mifosx-
// Include theme styles for core and each component used in your app.
.dark-theme {
@include mat.all-component-themes($mifosx-app-dark-theme);
@include groups-view-component-theme($mifosx-app-dark-theme);
@include centers-view-component-theme($mifosx-app-dark-theme);
@include dashboard-component-theme($mifosx-app-dark-theme);
@include shares-account-view-component-theme($mifosx-app-dark-theme);
@include account-view-component-dark-theme($mifosx-app-dark-theme);
@include mat.all-component-themes($mifosx-app-dark-theme);
@include groups-view-component-theme($mifosx-app-dark-theme);
@include centers-view-component-theme($mifosx-app-dark-theme);
@include dashboard-component-theme($mifosx-app-dark-theme);
@include shares-account-view-component-theme($mifosx-app-dark-theme);
@include account-view-component-dark-theme($mifosx-app-dark-theme);
}