restruct: updated scss @import rules to @use; package upgrade

This commit is contained in:
2025-03-04 16:16:28 +01:00
parent 91803d3fef
commit c9459eb8f4
18 changed files with 10669 additions and 2430 deletions
+5 -5
View File
@@ -224,8 +224,8 @@ const randomizeTrainNumber = (randomizeRegions = false) => {
</script>
<style lang="scss" scoped>
@import '../../styles/tab.scss';
@import '../../styles/global.scss';
.category-select {
select {
@@ -264,7 +264,7 @@ const randomizeTrainNumber = (randomizeRegions = false) => {
margin: 0.5em 0;
padding: 0.5em;
background-color: $secondaryColor;
background-color: global.$secondaryColor;
}
.category-rules {
@@ -282,13 +282,13 @@ const randomizeTrainNumber = (randomizeRegions = false) => {
margin: 0.25em 0;
}
@media screen and (max-width: $breakpointMd) {
@media screen and (max-width: global.$breakpointMd) {
.number-generator {
min-height: 100vh;
}
}
@media screen and (max-width: $breakpointSm) {
@media screen and (max-width: global.$breakpointSm) {
.regions-select {
flex-wrap: wrap;
}
+6 -13
View File
@@ -227,16 +227,10 @@ export default defineComponent({
return acc;
},
[] as {
constructionType: string;
carPool: { carWagon: ICarWagon; cargo?: ICargo }[];
}[]
[] as { constructionType: string; carPool: { carWagon: ICarWagon; cargo?: ICargo }[] }[]
);
let bestGeneration: { stockList: IStock[]; value: number } = {
stockList: [],
value: 0,
};
let bestGeneration: { stockList: IStock[]; value: number } = { stockList: [], value: 0 };
for (let i = 0; i < 10; i++) {
this.store.stockList.splice(
@@ -324,8 +318,7 @@ export default defineComponent({
</script>
<style lang="scss" scoped>
@import '../../styles/global.scss';
@import '../../styles/tab.scss';
@use '@/styles/tab';
h2 {
margin-top: 0;
@@ -346,7 +339,7 @@ h2 {
text-transform: uppercase;
font-weight: bold;
background-color: $secondaryColor;
background-color: global.$secondaryColor;
&[data-excluded='true'] {
background-color: gray;
@@ -360,7 +353,7 @@ h2 {
padding: 5px;
transform: translate(-8px, -50%);
background-color: $bgColor;
background-color: global.$bgColor;
color: white;
}
}
@@ -401,7 +394,7 @@ h2 {
}
.generator_warning {
background-color: $accentColor;
background-color: global.$accentColor;
padding: 0.5em;
text-align: justify;
font-weight: bold;
+9 -9
View File
@@ -521,8 +521,8 @@ export default defineComponent({
</script>
<style lang="scss" scoped>
@import '../../styles/global';
@import '../../styles/tab.scss';
@use '@/styles/tab';
.tab_content {
display: flex;
@@ -533,7 +533,7 @@ export default defineComponent({
.warning {
padding: 0.25em;
margin: 0.25em 0;
background: $accentColor;
background: global.$accentColor;
color: black;
font-weight: bold;
@@ -600,7 +600,7 @@ export default defineComponent({
}
.list-empty {
background-color: $secondaryColor;
background-color: global.$secondaryColor;
border-radius: 0.5em;
padding: 0.75em;
font-weight: bold;
@@ -643,14 +643,14 @@ li > .stock-info {
.stock-info-no,
.stock-info-type {
background-color: $secondaryColor;
background-color: global.$secondaryColor;
&[data-team-only='true'] {
color: $teamColor;
color: global.$teamColor;
}
&[data-sponsor-only='true'] {
color: $sponsorColor;
color: global.$sponsorColor;
}
}
@@ -659,7 +659,7 @@ li > .stock-info {
text-align: right;
&[data-selected='true'] {
color: $accentColor;
color: global.$accentColor;
}
}
@@ -694,7 +694,7 @@ li > .stock-info {
}
}
@media screen and (max-width: $breakpointMd) {
@media screen and (max-width: global.$breakpointMd) {
ul {
min-height: auto;
}
+4 -4
View File
@@ -248,7 +248,7 @@ export default defineComponent({
</script>
<style lang="scss" scoped>
@import '../../styles/tab.scss';
@use '@/styles/tab';
.actions {
display: grid;
@@ -322,7 +322,7 @@ export default defineComponent({
}
.sponsor-only {
color: $sponsorColor;
color: global.$sponsorColor;
&::after {
content: '*';
@@ -330,7 +330,7 @@ export default defineComponent({
}
.team-only {
color: $teamColor;
color: global.$teamColor;
&::after {
content: '*';
@@ -347,7 +347,7 @@ export default defineComponent({
background-color: #161c2e;
}
@media screen and (max-width: $breakpointSm) {
@media screen and (max-width: global.$breakpointSm) {
.actions-panel {
align-items: stretch;
flex-direction: column;