forked/shlink-web-client
1
0
Fork 0
mirror of https://github.com/shlinkio/shlink-web-client.git synced 2026-03-16 12:33:48 +00:00
Code Issues Packages Projects Releases Wiki Activity

Replace sass imports with sass use

Browse Source
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
Download Patch File Download Diff File Expand all files Collapse all files

14
src/app/App.scss
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 { .app-container {
height: 100%; height: 100%;
} }
.app { .app {
padding-top: $headerHeight; padding-top: base.$headerHeight;
height: 100%; height: 100%;
} }
.shlink-wrapper { .shlink-wrapper {
min-height: 100%; min-height: 100%;
padding-bottom: $footer-height + $footer-margin; padding-bottom: base.$footer-height + base.$footer-margin;
margin-bottom: -($footer-height + $footer-margin); margin-bottom: -(base.$footer-height + base.$footer-margin);
} }
.shlink-footer { .shlink-footer {
height: $footer-height; height: base.$footer-height;
margin-top: $footer-margin; margin-top: base.$footer-margin;
padding: 0; padding: 0;
@media (min-width: $mdMin) { @media (min-width: base.$mdMin) {
padding: 0 15px; padding: 0 15px;
} }
} }

8
src/common/AppUpdateBanner.scss
View File

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

6
src/common/Home.scss
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 { .home__title {
font-size: 1.75rem; font-size: 1.75rem;
@media (min-width: $mdMin) { @media (min-width: base.$mdMin) {
font-size: 2.2rem; font-size: 2.2rem;
} }
} }
.home__servers-container { .home__servers-container {
@media (min-width: $mdMin) { @media (min-width: base.$mdMin) {
border-left: 1px solid var(--border-color); border-left: 1px solid var(--border-color);
} }
} }

2
src/common/MainHeader.scss
View File

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

4
src/common/NoMenuLayout.scss
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 { .no-menu-wrapper {
padding: 15px 0 0; padding: 15px 0 0;
@media (min-width: $mdMin) { @media (min-width: base.$mdMin) {
padding: 30px 20px 20px; padding: 30px 20px 20px;
} }
} }

6
src/common/ShlinkVersionsContainer.scss
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 { .shlink-versions-container--with-sidebar {
margin-left: 0; margin-left: 0;
@media (min-width: $mdMin) { @media (min-width: base.$mdMin) {
margin-left: $asideMenuWidth; margin-left: base.$asideMenuWidth;
} }
} }

10
src/index.scss
View File

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

14
src/servers/ServersListGroup.scss
View File

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

4
src/servers/helpers/ServerError.scss
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 { .server-error__container {
text-align: center; text-align: center;
@@ -8,7 +8,7 @@
} }
.server-error__delete-btn { .server-error__delete-btn {
color: $dangerColor; color: base.$dangerColor;
font-weight: inherit; font-weight: inherit;
} }