Skip to content

Commit

Permalink
fix: stop using deprecated scss @import
Browse files Browse the repository at this point in the history
  • Loading branch information
limonte committed Jan 2, 2025
1 parent ee654f1 commit 27aa9d0
Show file tree
Hide file tree
Showing 20 changed files with 68 additions and 52 deletions.
2 changes: 1 addition & 1 deletion README.md
Original file line number Diff line number Diff line change
Expand Up @@ -57,7 +57,7 @@ import Swal from 'sweetalert2/dist/sweetalert2.js';
`your-app.scss`:

```scss
@import '@sweetalert2/themes/dark/dark.scss';
@use '@sweetalert2/themes/dark/dark.scss';
```

## Contributing
Expand Down
2 changes: 1 addition & 1 deletion bootstrap-4/README.md
Original file line number Diff line number Diff line change
Expand Up @@ -32,5 +32,5 @@ import Swal from 'sweetalert2/dist/sweetalert2.js';

`your-app.scss`:
```scss
@import '@sweetalert2/theme-bootstrap-4/bootstrap-4.scss';
@use '@sweetalert2/theme-bootstrap-4/bootstrap-4.scss';
```
4 changes: 1 addition & 3 deletions bootstrap-4/bootstrap-4.scss
Original file line number Diff line number Diff line change
@@ -1,7 +1,5 @@
@use 'sass:math';

@import 'sweetalert2/src/variables';

// Function
@function str-replace($string, $search, $replace: '') {
$index: str-index($string, $search);
Expand Down Expand Up @@ -220,7 +218,7 @@ $swal2-toast-input-font-size: $bootstrap-toast-font-size;
$swal2-toast-validation-font-size: $bootstrap-toast-font-size;
$swal2-toast-buttons-font-size: $bootstrap-toast-font-size;

@import 'sweetalert2/src/sweetalert2';
@use 'sweetalert2/src/sweetalert2';

.swal2-confirm,
.swal2-deny,
Expand Down
2 changes: 1 addition & 1 deletion borderless/README.md
Original file line number Diff line number Diff line change
Expand Up @@ -32,5 +32,5 @@ import Swal from 'sweetalert2/dist/sweetalert2.js';

`your-app.scss`:
```scss
@import '@sweetalert2/theme-borderless/borderless.scss';
@use '@sweetalert2/theme-borderless/borderless.scss';
```
4 changes: 1 addition & 3 deletions borderless/borderless.scss
Original file line number Diff line number Diff line change
@@ -1,5 +1,3 @@
@import 'sweetalert2/src/variables';

$borderless-theme-color: rgba(54, 70, 93, .99);
$borderless-outline-color: lighten($borderless-theme-color, 30%);

Expand Down Expand Up @@ -58,4 +56,4 @@ $swal2-button-focus-box-shadow: 0 0 0 1px $borderless-theme-color, 0 0 0 3px $bo
$swal2-toast-background: $borderless-theme-color;
$swal2-toast-button-focus-box-shadow: 0 0 0 1px $borderless-theme-color, 0 0 0 3px $borderless-outline-color;

@import 'sweetalert2/src/sweetalert2';
@use 'sweetalert2/src/sweetalert2';
2 changes: 1 addition & 1 deletion bulma/README.md
Original file line number Diff line number Diff line change
Expand Up @@ -32,5 +32,5 @@ import Swal from 'sweetalert2/dist/sweetalert2.js';

`your-app.scss`:
```scss
@import '@sweetalert2/theme-bulma/bulma.scss';
@use '@sweetalert2/theme-bulma/bulma.scss';
```
6 changes: 1 addition & 5 deletions bulma/bulma.scss
Original file line number Diff line number Diff line change
@@ -1,7 +1,3 @@
@import "sweetalert2/src/variables.scss";

// override SASS variables here

//
// -- BULMA COPY VARIABLES

Expand Down Expand Up @@ -192,7 +188,7 @@ $swal2-progress-step-color: $white;
$swal2-active-step-background: $blue;
$swal2-active-step-color: $white;

@import "sweetalert2/src/sweetalert2.scss";
@use "sweetalert2/src/sweetalert2.scss";

.swal2-styled {
&.swal2-cancel {
Expand Down
2 changes: 1 addition & 1 deletion dark/README.md
Original file line number Diff line number Diff line change
Expand Up @@ -32,5 +32,5 @@ import Swal from 'sweetalert2/dist/sweetalert2.js';

`your-app.scss`:
```scss
@import '@sweetalert2/theme-dark/dark.scss';
@use '@sweetalert2/theme-dark/dark.scss';
```
4 changes: 1 addition & 3 deletions dark/dark.scss
Original file line number Diff line number Diff line change
@@ -1,5 +1,3 @@
@import 'sweetalert2/src/variables';

$swal2-dark-theme-black: #19191a;
$swal2-dark-theme-white: #e1e1e1;
$swal2-outline-color: lighten($swal2-outline-color, 10%);
Expand Down Expand Up @@ -34,4 +32,4 @@ $swal2-button-focus-box-shadow: 0 0 0 1px $swal2-background, 0 0 0 3px $swal2-ou
$swal2-toast-background: $swal2-dark-theme-black;
$swal2-toast-button-focus-box-shadow: 0 0 0 1px $swal2-background, 0 0 0 3px $swal2-outline-color;

@import 'sweetalert2/src/sweetalert2';
@use 'sweetalert2/src/sweetalert2';
2 changes: 1 addition & 1 deletion default/README.md
Original file line number Diff line number Diff line change
Expand Up @@ -32,5 +32,5 @@ import Swal from 'sweetalert2/dist/sweetalert2.js';

`your-app.scss`:
```scss
@import '@sweetalert2/theme-default/default.scss';
@use '@sweetalert2/theme-default/default.scss';
```
3 changes: 1 addition & 2 deletions default/default.scss
Original file line number Diff line number Diff line change
@@ -1,2 +1 @@
@import 'sweetalert2/src/variables';
@import 'sweetalert2/src/sweetalert2';
@use 'sweetalert2/src/sweetalert2';
2 changes: 1 addition & 1 deletion material-ui/README.md
Original file line number Diff line number Diff line change
Expand Up @@ -32,5 +32,5 @@ import Swal from 'sweetalert2/dist/sweetalert2.js';

`your-app.scss`:
```scss
@import '@sweetalert2/theme-material-ui/material-ui.scss';
@use '@sweetalert2/theme-material-ui/material-ui.scss';
```
4 changes: 1 addition & 3 deletions material-ui/material-ui.scss
Original file line number Diff line number Diff line change
@@ -1,7 +1,5 @@
@use 'sass:math';

@import 'sweetalert2/src/variables';

// Theme variables
$material-ui-blue: #2196f3;
$material-ui-disabled: #808080;
Expand Down Expand Up @@ -52,7 +50,7 @@ $swal2-close-button-hover-color: $swal2-close-button-color;
$checkbox-size-px: 18;
$checkbox-left-px: -2;

@import 'sweetalert2/src/sweetalert2';
@use 'sweetalert2/src/sweetalert2';

// Temporary / Permanent workarounds
// Input validation error
Expand Down
2 changes: 1 addition & 1 deletion minimal/README.md
Original file line number Diff line number Diff line change
Expand Up @@ -32,5 +32,5 @@ import Swal from 'sweetalert2/dist/sweetalert2.js';

`your-app.scss`:
```scss
@import '@sweetalert2/theme-minimal/minimal.scss';
@use '@sweetalert2/theme-minimal/minimal.scss';
```
4 changes: 1 addition & 3 deletions minimal/minimal.scss
Original file line number Diff line number Diff line change
@@ -1,5 +1,3 @@
@import 'sweetalert2/src/variables';

// BOX MODEL
$swal2-border-radius: 0;
$swal2-box-shadow: none;
Expand Down Expand Up @@ -35,4 +33,4 @@ $swal2-toast-success-line-long-animation: none;
$swal2-toast-border: 1px solid lighten($swal2-black, 85);
$swal2-toast-box-shadow: none;

@import 'sweetalert2/src/sweetalert2';
@use 'sweetalert2/src/sweetalert2';
2 changes: 1 addition & 1 deletion package.json
Original file line number Diff line number Diff line change
Expand Up @@ -10,7 +10,7 @@
"devDependencies": {
"@sweetalert2/stylelint-config": "^3.0.0",
"replace-in-file": "^8.0.0",
"sass": "~1.79.0",
"sass": "^1.83.0",
"stylelint": "^16.0.0",
"sweetalert2": "^11.5.2",
"vite": "^6.0.0",
Expand Down
5 changes: 2 additions & 3 deletions tools/create-new-theme.mjs
Original file line number Diff line number Diff line change
Expand Up @@ -50,9 +50,8 @@ await replaceInFile({
// Create ${themeName}.scss
fs.writeFileSync(
path.join(themeName, `${themeName}.scss`),
`@import 'sweetalert2/src/variables';\n\n` +
`// override SASS variables here\n\n` +
`@import 'sweetalert2/src/sweetalert2';\n`
`// override SCSS variables here\n\n` +
`@use 'sweetalert2/src/sweetalert2';\n`
)

echo`OK!`
2 changes: 1 addition & 1 deletion wordpress-admin/README.md
Original file line number Diff line number Diff line change
Expand Up @@ -32,7 +32,7 @@ import Swal from 'sweetalert2/dist/sweetalert2.js'

`your-app.scss`:
```scss
@import '@sweetalert2/theme-wordpress-admin/wordpress-admin.scss';
@use '@sweetalert2/theme-wordpress-admin/wordpress-admin.scss';
```

Integration
Expand Down
39 changes: 35 additions & 4 deletions wordpress-admin/wordpress-admin.scss
Original file line number Diff line number Diff line change
@@ -1,6 +1,3 @@
@import 'sweetalert2/src/variables';
@import './animations';

$wordpress-blue: rgb(0, 124, 186);
$wordpress-red: #ca4a1f;
$wordpress-green: #46b450;
Expand Down Expand Up @@ -116,7 +113,7 @@ $swal2-toast-footer-font-size: 13px;
$swal2-timer-progress-bar-height: .25em;
$swal2-timer-progress-bar-background: $wordpress-blue;

@import 'sweetalert2/src/sweetalert2';
@use 'sweetalert2/src/sweetalert2';

.swal2-success-ring {
display: none;
Expand Down Expand Up @@ -171,3 +168,37 @@ $swal2-timer-progress-bar-background: $wordpress-blue;
.swal2-toast .swal2-icon.swal2-success {
transform: scale(0.7) translateY(-5px);
}

@keyframes fadeInUpBig {
from {
transform: translate3d(0, 100%, 0);
opacity: 0;
}

to {
transform: translate3d(0, 0, 0);
opacity: 1;
}
}

@keyframes fadeInUpTiny {
from {
transform: translate3d(0, 5px, 0);
opacity: 0.7;
}

to {
transform: translate3d(0, 0, 0);
opacity: 1;
}
}

@keyframes fadeOut {
from {
opacity: 1;
}

to {
opacity: 0;
}
}
27 changes: 14 additions & 13 deletions yarn.lock
Original file line number Diff line number Diff line change
Expand Up @@ -814,10 +814,10 @@ ignore@^6.0.2:
resolved "https://registry.yarnpkg.com/ignore/-/ignore-6.0.2.tgz#77cccb72a55796af1b6d2f9eb14fa326d24f4283"
integrity sha512-InwqeHHN2XpumIkMvpl/DCJVrAHgCsG5+cn1XlnLWGwtZBm8QJfSusItfrwx81CTp5agNZqpKU2J/ccC5nGT4A==

immutable@^4.0.0:
version "4.3.7"
resolved "https://registry.yarnpkg.com/immutable/-/immutable-4.3.7.tgz#c70145fc90d89fb02021e65c84eb0226e4e5a381"
integrity sha512-1hqclzwYwjRDFLjcFxOM5AYkkG0rpFPpr1RLPMEuGczoS7YA8gLhy8SWXYRAA/XwfEHpfo3cw5JGioS32fnMRw==
immutable@^5.0.2:
version "5.0.3"
resolved "https://registry.yarnpkg.com/immutable/-/immutable-5.0.3.tgz#aa037e2313ea7b5d400cd9298fa14e404c933db1"
integrity sha512-P8IdPQHq3lA1xVeBRi5VPqUm5HDgKnx0Ru51wZz5mjxHr5n3RWhjIpOFU7ybkUxfB+5IToy+OLaHYDBIWsv+uw==

import-fresh@^3.3.0:
version "3.3.0"
Expand Down Expand Up @@ -1183,15 +1183,16 @@ run-parallel@^1.1.9:
dependencies:
queue-microtask "^1.2.2"

sass@~1.79.0:
version "1.79.6"
resolved "https://registry.yarnpkg.com/sass/-/sass-1.79.6.tgz#35a53c3dbaf66a25f132979f47346521e4ef77cb"
integrity sha512-PVVjeeiUGx6Nj4PtEE/ecwu8ltwfPKzHxbbVmmLj4l1FYHhOyfA0scuVF8sVaa+b+VY4z7BVKjKq0cPUQdUU3g==
sass@^1.83.0:
version "1.83.0"
resolved "https://registry.yarnpkg.com/sass/-/sass-1.83.0.tgz#e36842c0b88a94ed336fd16249b878a0541d536f"
integrity sha512-qsSxlayzoOjdvXMVLkzF84DJFc2HZEL/rFyGIKbbilYtAvlCxyuzUeff9LawTn4btVnLKg75Z8MMr1lxU1lfGw==
dependencies:
"@parcel/watcher" "^2.4.1"
chokidar "^4.0.0"
immutable "^4.0.0"
immutable "^5.0.2"
source-map-js ">=0.6.2 <2.0.0"
optionalDependencies:
"@parcel/watcher" "^2.4.1"

shebang-command@^2.0.0:
version "2.0.0"
Expand Down Expand Up @@ -1384,9 +1385,9 @@ svg-tags@^1.0.0:
integrity sha512-ovssysQTa+luh7A5Weu3Rta6FJlFBBbInjOh722LIt6klpU2/HtdUbszju/G4devcvk8PGt7FCLv5wftu3THUA==

sweetalert2@^11.5.2:
version "11.15.5"
resolved "https://registry.yarnpkg.com/sweetalert2/-/sweetalert2-11.15.5.tgz#608fa28491b2b874923200732f553c4f69dd4e0f"
integrity sha512-bVfmz1M1EZdbSagMSjfrLMzsWD0RKkHBRn73xZBCLzk8lXAJ6gfh63SmRGOzKfUynvg33cjxk5dTnFZozqsEvg==
version "11.15.6"
resolved "https://registry.yarnpkg.com/sweetalert2/-/sweetalert2-11.15.6.tgz#5380ce7a74c9684793a8d3e86b94f4ebb51df348"
integrity sha512-OyJQsMlIZPfKHXXPkChQMqoaskPOgF8OnxjShHmyOP8T7KQjrjwXu3qD2pwExrUkVhXFVhoxZovOXG0G+7TCag==

table@^6.9.0:
version "6.9.0"
Expand Down

0 comments on commit 27aa9d0

Please sign in to comment.