Replace sass imports with sass use

This commit is contained in:
Alejandro Celaya
2025-02-11 09:15:20 +01:00
parent c85917e378
commit 2e9db77b00
9 changed files with 34 additions and 34 deletions

View File

@@ -1,26 +1,26 @@
@import '../../node_modules/@shlinkio/shlink-frontend-kit/dist/base';
@use '../../node_modules/@shlinkio/shlink-frontend-kit/dist/base';
.app-container {
height: 100%;
}
.app {
padding-top: $headerHeight;
padding-top: base.$headerHeight;
height: 100%;
}
.shlink-wrapper {
min-height: 100%;
padding-bottom: $footer-height + $footer-margin;
margin-bottom: -($footer-height + $footer-margin);
padding-bottom: base.$footer-height + base.$footer-margin;
margin-bottom: -(base.$footer-height + base.$footer-margin);
}
.shlink-footer {
height: $footer-height;
margin-top: $footer-margin;
height: base.$footer-height;
margin-top: base.$footer-margin;
padding: 0;
@media (min-width: $mdMin) {
@media (min-width: base.$mdMin) {
padding: 0 15px;
}
}

View File

@@ -1,11 +1,11 @@
@import '../../node_modules/@shlinkio/shlink-frontend-kit/dist/base';
@import '../utils/mixins/horizontal-align';
@use '../../node_modules/@shlinkio/shlink-frontend-kit/dist/base';
@use '../utils/mixins/horizontal-align';
.app-update-banner.app-update-banner {
@include horizontal-align();
@include horizontal-align.horizontal-align();
position: fixed;
top: $headerHeight - 25px;
top: base.$headerHeight - 25px;
padding: 0 4rem 0 0;
z-index: 1040;
margin: 0;

View File

@@ -1,15 +1,15 @@
@import '../../node_modules/@shlinkio/shlink-frontend-kit/dist/base';
@use '../../node_modules/@shlinkio/shlink-frontend-kit/dist/base';
.home__title {
font-size: 1.75rem;
@media (min-width: $mdMin) {
@media (min-width: base.$mdMin) {
font-size: 2.2rem;
}
}
.home__servers-container {
@media (min-width: $mdMin) {
@media (min-width: base.$mdMin) {
border-left: 1px solid var(--border-color);
}
}

View File

@@ -1,5 +1,3 @@
@import '../../node_modules/@shlinkio/shlink-frontend-kit/dist/base';
.main-header.main-header {
color: white;
background-color: var(--brand-color) !important;

View File

@@ -1,9 +1,9 @@
@import '../../node_modules/@shlinkio/shlink-frontend-kit/dist/base';
@use '../../node_modules/@shlinkio/shlink-frontend-kit/dist/base';
.no-menu-wrapper {
padding: 15px 0 0;
@media (min-width: $mdMin) {
@media (min-width: base.$mdMin) {
padding: 30px 20px 20px;
}
}

View File

@@ -1,9 +1,9 @@
@import '../../node_modules/@shlinkio/shlink-frontend-kit/dist/base';
@use '../../node_modules/@shlinkio/shlink-frontend-kit/dist/base';
.shlink-versions-container--with-sidebar {
margin-left: 0;
@media (min-width: $mdMin) {
margin-left: $asideMenuWidth;
@media (min-width: base.$mdMin) {
margin-left: base.$asideMenuWidth;
}
}

View File

@@ -1,4 +1,6 @@
@import '../node_modules/@shlinkio/shlink-frontend-kit/dist/base'; // Before bootstrap stylesheet. Includes SASS var overrides
@import '../node_modules/bootstrap/scss/bootstrap.scss';
@import '../node_modules/@shlinkio/shlink-frontend-kit/dist/index'; // After bootstrap. Includes CSS overwrites
@import '../node_modules/@shlinkio/shlink-web-component/dist/index';
@use '../node_modules/@shlinkio/shlink-frontend-kit/dist/base'; // Before bootstrap stylesheet
@use '../node_modules/bootstrap/scss/bootstrap.scss' with (
$primary: base.$mainColor // Override bootstrap's primary color
);
@use '../node_modules/@shlinkio/shlink-frontend-kit/dist/index'; // After bootstrap. Includes CSS overrides
@use '../node_modules/@shlinkio/shlink-web-component/dist/index' as c-index;

View File

@@ -1,6 +1,6 @@
@import '../../node_modules/@shlinkio/shlink-frontend-kit/dist/base';
@import '../utils/mixins/vertical-align';
@import '../utils/mixins/thin-scroll';
@use '../../node_modules/@shlinkio/shlink-frontend-kit/dist/base';
@use '../utils/mixins/vertical-align';
@use '../utils/mixins/thin-scroll';
.servers-list__list-group.servers-list__list-group {
width: 100%;
@@ -18,7 +18,7 @@
}
.servers-list__server-item:not(:hover) {
color: $mainColor;
color: base.$mainColor;
}
.servers-list__server-item:hover {
@@ -26,7 +26,7 @@
}
.servers-list__server-item-icon {
@include vertical-align();
@include vertical-align.vertical-align();
right: 1rem;
}
@@ -35,11 +35,11 @@
border-radius: 0;
border-top: 1px solid var(--border-color);
@media (min-width: $mdMin) {
@media (min-width: base.$mdMin) {
max-height: 220px;
overflow-x: auto;
@include thin-scroll();
@include thin-scroll.thin-scroll();
}
.servers-list__server-item {

View File

@@ -1,4 +1,4 @@
@import '../../../node_modules/@shlinkio/shlink-frontend-kit/dist/base';
@use '../../../node_modules/@shlinkio/shlink-frontend-kit/dist/base';
.server-error__container {
text-align: center;
@@ -8,7 +8,7 @@
}
.server-error__delete-btn {
color: $dangerColor;
color: base.$dangerColor;
font-weight: inherit;
}