mirror of
https://github.com/jambonz/jambonz-webapp.git
synced 2025-12-18 21:27:43 +00:00
fixed deprecated api when migrating to sass 3 (#549)
This commit is contained in:
9
package-lock.json
generated
9
package-lock.json
generated
@@ -10,7 +10,7 @@
|
||||
"hasInstallScript": true,
|
||||
"license": "MIT",
|
||||
"dependencies": {
|
||||
"@jambonz/ui-kit": "^0.0.21",
|
||||
"@jambonz/ui-kit": "^0.0.22",
|
||||
"@stripe/react-stripe-js": "^2.6.2",
|
||||
"@stripe/stripe-js": "^3.2.0",
|
||||
"dayjs": "^1.11.10",
|
||||
@@ -1033,9 +1033,10 @@
|
||||
"dev": true
|
||||
},
|
||||
"node_modules/@jambonz/ui-kit": {
|
||||
"version": "0.0.21",
|
||||
"resolved": "https://registry.npmjs.org/@jambonz/ui-kit/-/ui-kit-0.0.21.tgz",
|
||||
"integrity": "sha512-tv0sPhzxS/ctJbgUxLVNY+7IjJb3OAhqrdYpmeW3lmEHi7+sHxpO2oMjaVTPFCN4vYh+QzyzT4eLQjpEUDd6sA==",
|
||||
"version": "0.0.22",
|
||||
"resolved": "https://registry.npmjs.org/@jambonz/ui-kit/-/ui-kit-0.0.22.tgz",
|
||||
"integrity": "sha512-kaO094hexaBojrfN94Tm4NvuVi2I04hFnjcCYqQNl+y2h/Q64Gg/bHuqFetG+nVf4/fDQHSny6rLggs84fM2nQ==",
|
||||
"license": "MIT",
|
||||
"engines": {
|
||||
"node": ">= 14"
|
||||
},
|
||||
|
||||
@@ -41,7 +41,7 @@
|
||||
"deploy": "npm i && npm run build && npm run pm2"
|
||||
},
|
||||
"dependencies": {
|
||||
"@jambonz/ui-kit": "^0.0.21",
|
||||
"@jambonz/ui-kit": "^0.0.22",
|
||||
"@stripe/react-stripe-js": "^2.6.2",
|
||||
"@stripe/stripe-js": "^3.2.0",
|
||||
"dayjs": "^1.11.10",
|
||||
|
||||
@@ -25,7 +25,6 @@
|
||||
}
|
||||
|
||||
select {
|
||||
@include ui-mixins.m();
|
||||
appearance: none;
|
||||
padding: ui-vars.$px01 ui-vars.$px02;
|
||||
border-radius: ui-vars.$px01;
|
||||
@@ -33,6 +32,7 @@
|
||||
background-color: ui-vars.$white;
|
||||
width: 100%;
|
||||
max-width: vars.$widthinput;
|
||||
@include ui-mixins.m();
|
||||
|
||||
&:focus {
|
||||
border-color: ui-vars.$dark;
|
||||
|
||||
@@ -28,7 +28,6 @@
|
||||
}
|
||||
|
||||
@mixin typeahead-input {
|
||||
@include ui-mixins.m();
|
||||
appearance: none;
|
||||
padding: ui-vars.$px01 ui-vars.$px02;
|
||||
border-radius: ui-vars.$px01;
|
||||
@@ -37,6 +36,7 @@
|
||||
max-width: vars.$widthtypeaheadinput;
|
||||
transition: border-color 0.2s ease;
|
||||
font-family: inherit;
|
||||
@include ui-mixins.m();
|
||||
|
||||
&:focus {
|
||||
border-color: ui-vars.$dark;
|
||||
@@ -84,7 +84,6 @@
|
||||
}
|
||||
|
||||
@mixin typeahead-dropdown {
|
||||
@include ui-mixins.m();
|
||||
position: absolute;
|
||||
top: 100%;
|
||||
left: 0;
|
||||
@@ -93,6 +92,7 @@
|
||||
border: 1px solid ui-vars.$dark;
|
||||
max-height: 200px;
|
||||
overflow-y: auto;
|
||||
@include ui-mixins.m();
|
||||
}
|
||||
|
||||
@mixin typeahead-option {
|
||||
@@ -126,8 +126,8 @@
|
||||
width: 100%;
|
||||
|
||||
input {
|
||||
@include typeahead-input();
|
||||
width: 100%;
|
||||
@include typeahead-input();
|
||||
}
|
||||
|
||||
span {
|
||||
@@ -135,8 +135,8 @@
|
||||
}
|
||||
|
||||
.typeahead-dropdown {
|
||||
@include typeahead-dropdown();
|
||||
z-index: 1000;
|
||||
@include typeahead-dropdown();
|
||||
}
|
||||
|
||||
.typeahead-option {
|
||||
@@ -149,10 +149,10 @@
|
||||
width: auto;
|
||||
|
||||
input {
|
||||
@include typeahead-input();
|
||||
height: 34px;
|
||||
min-width: 370px;
|
||||
font-size: var(--mxs-size);
|
||||
@include typeahead-input();
|
||||
}
|
||||
|
||||
span {
|
||||
@@ -160,13 +160,13 @@
|
||||
}
|
||||
|
||||
.typeahead-dropdown {
|
||||
@include typeahead-dropdown();
|
||||
width: 100%;
|
||||
@include typeahead-dropdown();
|
||||
}
|
||||
|
||||
.typeahead-option {
|
||||
@include typeahead-option();
|
||||
font-size: var(--mxs-size);
|
||||
@include typeahead-option();
|
||||
}
|
||||
|
||||
.pointerevents {
|
||||
|
||||
@@ -4,7 +4,6 @@
|
||||
|
||||
.barGroup {
|
||||
border-radius: ui-vars.$px01;
|
||||
@include mixins.code();
|
||||
text-align: left;
|
||||
padding: ui-vars.$px03;
|
||||
color: ui-vars.$pink;
|
||||
@@ -13,6 +12,7 @@
|
||||
margin-top: ui-vars.$px02;
|
||||
overflow-x: auto;
|
||||
overflow-y: scroll;
|
||||
@include mixins.code();
|
||||
|
||||
@media (max-width: 600px) {
|
||||
padding: 15px;
|
||||
@@ -72,7 +72,6 @@
|
||||
|
||||
.spanDetailsWrapper {
|
||||
border-radius: ui-vars.$px01;
|
||||
@include mixins.code();
|
||||
text-align: left;
|
||||
padding: ui-vars.$px01;
|
||||
background-color: ui-vars.$white;
|
||||
@@ -82,6 +81,7 @@
|
||||
max-width: ui-vars.$width-tablet-2;
|
||||
max-height: 500px;
|
||||
overflow-y: scroll;
|
||||
@include mixins.code();
|
||||
|
||||
&__detailsWrapper {
|
||||
height: 100%;
|
||||
|
||||
@@ -7,12 +7,12 @@ input[type="text"],
|
||||
input[type="email"],
|
||||
input[type="number"],
|
||||
input[type="password"] {
|
||||
@include ui-mixins.m();
|
||||
padding: ui-vars.$px01 ui-vars.$px02;
|
||||
border-radius: ui-vars.$px01;
|
||||
border: 2px solid ui-vars.$grey;
|
||||
background-color: ui-vars.$white;
|
||||
color: inherit;
|
||||
@include ui-mixins.m();
|
||||
|
||||
&:focus {
|
||||
border-color: ui-vars.$dark;
|
||||
@@ -110,11 +110,11 @@ fieldset {
|
||||
}
|
||||
|
||||
label {
|
||||
@include ui-mixins.m();
|
||||
@include ui-mixins.font-medium();
|
||||
display: flex;
|
||||
align-items: center;
|
||||
flex-wrap: wrap;
|
||||
@include ui-mixins.font-medium();
|
||||
@include ui-mixins.m();
|
||||
|
||||
span {
|
||||
color: ui-vars.$jambonz;
|
||||
|
||||
@@ -21,10 +21,10 @@
|
||||
}
|
||||
|
||||
&__row {
|
||||
@include ui-mixins.m();
|
||||
display: grid;
|
||||
padding: ui-vars.$px03;
|
||||
align-items: center;
|
||||
@include ui-mixins.m();
|
||||
|
||||
@include mixins.small() {
|
||||
padding: ui-vars.$px02;
|
||||
|
||||
@@ -30,11 +30,11 @@
|
||||
}
|
||||
|
||||
&__title {
|
||||
@include ui-mixins.p();
|
||||
display: flex;
|
||||
align-items: center;
|
||||
grid-gap: ui-vars.$px02;
|
||||
color: ui-vars.$jambonz;
|
||||
@include ui-mixins.p();
|
||||
|
||||
+ .item__meta {
|
||||
@include mixins.small() {
|
||||
|
||||
@@ -1,3 +1,4 @@
|
||||
@use "sass:color";
|
||||
@use "./forms";
|
||||
// @use "./cards";
|
||||
@use "./lists";
|
||||
@@ -68,7 +69,7 @@ details {
|
||||
&.ok {
|
||||
color: ui-vars.$teal;
|
||||
border: 2px solid ui-vars.$teal;
|
||||
background-color: mix(ui-vars.$white, ui-vars.$teal, 95%);
|
||||
background-color: color.mix(ui-vars.$white, ui-vars.$teal, 95%);
|
||||
}
|
||||
|
||||
&.not-tested {
|
||||
@@ -77,8 +78,8 @@ details {
|
||||
}
|
||||
|
||||
summary {
|
||||
@include ui-mixins.m();
|
||||
cursor: pointer;
|
||||
@include ui-mixins.m();
|
||||
|
||||
+ * {
|
||||
margin-top: ui-vars.$px02;
|
||||
@@ -160,7 +161,6 @@ details {
|
||||
|
||||
/** Used for recent-calls */
|
||||
.pre-grid {
|
||||
@include mixins.code();
|
||||
display: grid;
|
||||
grid-template-columns: auto 1fr;
|
||||
grid-row-gap: ui-vars.$px01;
|
||||
@@ -171,6 +171,7 @@ details {
|
||||
background-color: ui-vars.$dark;
|
||||
border-radius: ui-vars.$px01;
|
||||
margin-top: ui-vars.$px02;
|
||||
@include mixins.code();
|
||||
}
|
||||
|
||||
.pre-grid-white {
|
||||
|
||||
@@ -15,6 +15,15 @@ export default defineConfig(() => {
|
||||
src: path.resolve(__dirname, "src"),
|
||||
},
|
||||
},
|
||||
|
||||
// Configure Sass to use the modern API
|
||||
css: {
|
||||
preprocessorOptions: {
|
||||
scss: {
|
||||
api: "modern-compiler",
|
||||
},
|
||||
},
|
||||
},
|
||||
};
|
||||
|
||||
return config;
|
||||
|
||||
Reference in New Issue
Block a user