Spythere/pojazdownik
1
0
Fork 0
mirror of https://github.com/Spythere/pojazdownik.git synced 2026-05-03 11:45:34 +00:00
Code Issues Packages Projects Releases Wiki Activity

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

Browse Source
This commit is contained in:
Spythere
2025-03-04 16:16:28 +01:00
parent 91803d3fef
commit c9459eb8f4
18 changed files with 10669 additions and 2430 deletions
Download Patch File Download Diff File Expand all files Collapse all files
package-lock.json
Generated
+8435
View File
File diff suppressed because it is too large Load Diff
package.json
+1
View File
@@ -21,6 +21,7 @@
}, },
"devDependencies": { "devDependencies": {
"@rushstack/eslint-patch": "^1.3.3", "@rushstack/eslint-patch": "^1.3.3",
"@types/node": "^22.13.9",
"@vite-pwa/assets-generator": "^0.2.3", "@vite-pwa/assets-generator": "^0.2.3",
"@vitejs/plugin-vue": "^5.0.3", "@vitejs/plugin-vue": "^5.0.3",
"@vue/eslint-config-prettier": "^9.0.0", "@vue/eslint-config-prettier": "^9.0.0",
src/App.vue
+4 -8
View File
@@ -15,9 +15,7 @@ import AppModals from './components/app/AppModals.vue';
export default defineComponent({ export default defineComponent({
components: { ImageFullscreenPreview, AppContainerView, AppModals }, components: { ImageFullscreenPreview, AppContainerView, AppModals },
data() { data() {
return { return { store: useStore() };
store: useStore(),
};
}, },
async created() { async created() {
@@ -28,21 +26,19 @@ export default defineComponent({
</script> </script>
<style lang="scss"> <style lang="scss">
@import './styles/global.scss';
/* APP */ /* APP */
#app { #app {
margin: 0 auto; margin: 0 auto;
color: $textColor; color: global.$textColor;
font-size: 1em; font-size: 1em;
padding: 0; padding: 0;
@media screen and (max-width: $breakpointMd) { @media screen and (max-width: global.$breakpointMd) {
font-size: calc(0.7rem + 0.75vw); font-size: calc(0.7rem + 0.75vw);
} }
@media screen and (orientation: landscape) and (max-width: $breakpointMd) { @media screen and (orientation: landscape) and (max-width: global.$breakpointMd) {
font-size: calc(0.75rem + 0.4vw); font-size: calc(0.75rem + 0.4vw);
} }
} }
src/components/app/MainContainer.vue
+2 -4
View File
@@ -20,8 +20,6 @@ export default defineComponent({
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
@import '../../styles/global.scss';
main { main {
display: grid; display: grid;
gap: 1em; gap: 1em;
@@ -32,7 +30,7 @@ main {
grid-template-columns: 1fr 2fr; grid-template-columns: 1fr 2fr;
grid-template-rows: auto 360px minmax(300px, 1fr); grid-template-rows: auto 360px minmax(300px, 1fr);
background-color: darken($color: $bgColor, $amount: 5); background-color: global.$bgColorDarker;
border-radius: 1em; border-radius: 1em;
min-height: 950px; min-height: 950px;
@@ -40,7 +38,7 @@ main {
padding: 1em; padding: 1em;
} }
@media screen and (max-width: $breakpointMd) { @media screen and (max-width: global.$breakpointMd) {
main { main {
display: flex; display: flex;
flex-direction: column; flex-direction: column;
src/components/cards/RealStockCard.vue
+4 -6
View File
@@ -220,8 +220,6 @@ export default defineComponent({
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
@import '../../styles/global.scss';
.action-exit { .action-exit {
display: flex; display: flex;
background-color: #333; background-color: #333;
@@ -249,7 +247,7 @@ export default defineComponent({
z-index: 100; z-index: 100;
@media screen and (max-width: $breakpointSm) { @media screen and (max-width: global.$breakpointSm) {
height: 80vh; height: 80vh;
} }
} }
@@ -281,7 +279,7 @@ export default defineComponent({
width: 35%; width: 35%;
} }
@media screen and (max-width: $breakpointSm) { @media screen and (max-width: global.$breakpointSm) {
flex-wrap: wrap; flex-wrap: wrap;
input { input {
@@ -309,7 +307,7 @@ ul {
padding: 0.1em; padding: 0.1em;
&[data-last-selected='true'] .stock-title { &[data-last-selected='true'] .stock-title {
border: 1px solid $accentColor; border: 1px solid global.$accentColor;
} }
.stock-title { .stock-title {
@@ -325,7 +323,7 @@ ul {
background: #222; background: #222;
} }
@media screen and (max-width: $breakpointSm) { @media screen and (max-width: global.$breakpointSm) {
grid-template-columns: 1fr; grid-template-columns: 1fr;
// grid-template-rows: 1fr 1fr; // grid-template-rows: 1fr 1fr;
} }
src/components/sections/InputsSection.vue
+10 -30
View File
@@ -134,33 +134,15 @@ export default defineComponent({
data: () => ({ data: () => ({
store: useStore(), store: useStore(),
locomotiveTypeList: [ locomotiveTypeList: [
{ { id: 'loco-electric', desc: 'ELEKTRYCZNE' },
id: 'loco-electric', { id: 'loco-diesel', desc: 'SPALINOWE' },
desc: 'ELEKTRYCZNE', { id: 'unit-electric', desc: 'ELEKTR. ZESPOŁY TRAKCYJNE' },
}, { id: 'unit-diesel', desc: 'SPAL. ZESPOŁY TRAKCYJNE' },
{
id: 'loco-diesel',
desc: 'SPALINOWE',
},
{
id: 'unit-electric',
desc: 'ELEKTR. ZESPOŁY TRAKCYJNE',
},
{
id: 'unit-diesel',
desc: 'SPAL. ZESPOŁY TRAKCYJNE',
},
] as { id: LocoGroupType; desc: string }[], ] as { id: LocoGroupType; desc: string }[],
carTypeList: [ carTypeList: [
{ { id: 'wagon-passenger', desc: 'PASAŻERSKIE' },
id: 'wagon-passenger', { id: 'wagon-freight', desc: 'TOWAROWE' },
desc: 'PASAŻERSKIE',
},
{
id: 'wagon-freight',
desc: 'TOWAROWE',
},
] as { id: WagonGroupType; desc: string }[], ] as { id: WagonGroupType; desc: string }[],
}), }),
@@ -240,8 +222,6 @@ export default defineComponent({
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
@import '../../styles/global';
.inputs-section { .inputs-section {
display: flex; display: flex;
justify-content: center; justify-content: center;
@@ -264,7 +244,7 @@ button.btn--choice {
padding: 0.3em 0.6em; padding: 0.3em 0.6em;
&[data-selected='true'] { &[data-selected='true'] {
background-color: $accentColor; background-color: global.$accentColor;
color: black; color: black;
} }
@@ -282,12 +262,12 @@ button.btn--choice {
display: block; display: block;
font-weight: bold; font-weight: bold;
color: $accentColor; color: global.$accentColor;
margin-bottom: 0.3em; margin-bottom: 0.3em;
} }
select:focus { select:focus {
border-color: $accentColor; border-color: global.$accentColor;
} }
} }
@@ -308,7 +288,7 @@ button.btn--choice {
margin-bottom: 0.5em; margin-bottom: 0.5em;
} }
@media screen and (max-width: $breakpointMd) { @media screen and (max-width: global.$breakpointMd) {
.inputs-section { .inputs-section {
justify-content: center; justify-content: center;
text-align: center; text-align: center;
src/components/sections/LogoSection.vue
+3 -11
View File
@@ -21,14 +21,8 @@ export default {
data() { data() {
return { return {
localeActions: [ localeActions: [
{ { name: 'POLSKI', locale: 'pl' },
name: 'POLSKI', { name: 'ENGLISH', locale: 'en' },
locale: 'pl',
},
{
name: 'ENGLISH',
locale: 'en',
},
], ],
}; };
}, },
@@ -46,8 +40,6 @@ export default {
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
@import '../../styles/global.scss';
.logo-section { .logo-section {
grid-row: 1; grid-row: 1;
grid-column: 1; grid-column: 1;
@@ -66,7 +58,7 @@ export default {
button[data-selected='true'] { button[data-selected='true'] {
font-weight: bold; font-weight: bold;
color: $accentColor; color: global.$accentColor;
text-decoration: underline; text-decoration: underline;
} }
} }
src/components/sections/StockSection.vue
+1 -1
View File
@@ -57,7 +57,7 @@ onMounted(() => {
</script> </script>
<style lang="scss"> <style lang="scss">
@import '../../styles/global.scss';
// Tab change animation // Tab change animation
.tab-change { .tab-change {
src/components/sections/TrainImageSection.vue
+8 -8
View File
@@ -152,7 +152,7 @@ export default defineComponent({
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
@import '../../styles/global';
.train-image-section { .train-image-section {
display: flex; display: flex;
@@ -178,11 +178,11 @@ img {
} }
&[data-sponsor-only='true'] { &[data-sponsor-only='true'] {
border: 1px solid $sponsorColor; border: 1px solid global.$sponsorColor;
} }
&[data-team-only='true'] { &[data-team-only='true'] {
border: 1px solid $teamColor; border: 1px solid global.$teamColor;
} }
} }
@@ -216,25 +216,25 @@ img {
width: 100%; width: 100%;
max-width: 380px; max-width: 380px;
background-color: $secondaryColor; background-color: global.$secondaryColor;
font-weight: bold; font-weight: bold;
} }
.placeholder { .placeholder {
height: 250px; height: 250px;
background-color: $bgColor; background-color: global.$bgColor;
} }
.sponsor-only { .sponsor-only {
color: $sponsorColor; color: global.$sponsorColor;
} }
.team-only { .team-only {
color: $teamColor; color: global.$teamColor;
} }
@media screen and (max-width: $breakpointMd) { @media screen and (max-width: global.$breakpointMd) {
.train-image-section { .train-image-section {
justify-content: center; justify-content: center;
} }
src/components/tabs/NumberGeneratorTab.vue
+5 -5
View File
@@ -224,8 +224,8 @@ const randomizeTrainNumber = (randomizeRegions = false) => {
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
@import '../../styles/tab.scss';
@import '../../styles/global.scss';
.category-select { .category-select {
select { select {
@@ -264,7 +264,7 @@ const randomizeTrainNumber = (randomizeRegions = false) => {
margin: 0.5em 0; margin: 0.5em 0;
padding: 0.5em; padding: 0.5em;
background-color: $secondaryColor; background-color: global.$secondaryColor;
} }
.category-rules { .category-rules {
@@ -282,13 +282,13 @@ const randomizeTrainNumber = (randomizeRegions = false) => {
margin: 0.25em 0; margin: 0.25em 0;
} }
@media screen and (max-width: $breakpointMd) { @media screen and (max-width: global.$breakpointMd) {
.number-generator { .number-generator {
min-height: 100vh; min-height: 100vh;
} }
} }
@media screen and (max-width: $breakpointSm) { @media screen and (max-width: global.$breakpointSm) {
.regions-select { .regions-select {
flex-wrap: wrap; flex-wrap: wrap;
} }
src/components/tabs/StockGeneratorTab.vue
+6 -13
View File
@@ -227,16 +227,10 @@ export default defineComponent({
return acc; return acc;
}, },
[] as { [] as { constructionType: string; carPool: { carWagon: ICarWagon; cargo?: ICargo }[] }[]
constructionType: string;
carPool: { carWagon: ICarWagon; cargo?: ICargo }[];
}[]
); );
let bestGeneration: { stockList: IStock[]; value: number } = { let bestGeneration: { stockList: IStock[]; value: number } = { stockList: [], value: 0 };
stockList: [],
value: 0,
};
for (let i = 0; i < 10; i++) { for (let i = 0; i < 10; i++) {
this.store.stockList.splice( this.store.stockList.splice(
@@ -324,8 +318,7 @@ export default defineComponent({
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
@import '../../styles/global.scss'; @use '@/styles/tab';
@import '../../styles/tab.scss';
h2 { h2 {
margin-top: 0; margin-top: 0;
@@ -346,7 +339,7 @@ h2 {
text-transform: uppercase; text-transform: uppercase;
font-weight: bold; font-weight: bold;
background-color: $secondaryColor; background-color: global.$secondaryColor;
&[data-excluded='true'] { &[data-excluded='true'] {
background-color: gray; background-color: gray;
@@ -360,7 +353,7 @@ h2 {
padding: 5px; padding: 5px;
transform: translate(-8px, -50%); transform: translate(-8px, -50%);
background-color: $bgColor; background-color: global.$bgColor;
color: white; color: white;
} }
} }
@@ -401,7 +394,7 @@ h2 {
} }
.generator_warning { .generator_warning {
background-color: $accentColor; background-color: global.$accentColor;
padding: 0.5em; padding: 0.5em;
text-align: justify; text-align: justify;
font-weight: bold; font-weight: bold;
src/components/tabs/StockListTab.vue
+9 -9
View File
@@ -521,8 +521,8 @@ export default defineComponent({
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
@import '../../styles/global';
@import '../../styles/tab.scss'; @use '@/styles/tab';
.tab_content { .tab_content {
display: flex; display: flex;
@@ -533,7 +533,7 @@ export default defineComponent({
.warning { .warning {
padding: 0.25em; padding: 0.25em;
margin: 0.25em 0; margin: 0.25em 0;
background: $accentColor; background: global.$accentColor;
color: black; color: black;
font-weight: bold; font-weight: bold;
@@ -600,7 +600,7 @@ export default defineComponent({
} }
.list-empty { .list-empty {
background-color: $secondaryColor; background-color: global.$secondaryColor;
border-radius: 0.5em; border-radius: 0.5em;
padding: 0.75em; padding: 0.75em;
font-weight: bold; font-weight: bold;
@@ -643,14 +643,14 @@ li > .stock-info {
.stock-info-no, .stock-info-no,
.stock-info-type { .stock-info-type {
background-color: $secondaryColor; background-color: global.$secondaryColor;
&[data-team-only='true'] { &[data-team-only='true'] {
color: $teamColor; color: global.$teamColor;
} }
&[data-sponsor-only='true'] { &[data-sponsor-only='true'] {
color: $sponsorColor; color: global.$sponsorColor;
} }
} }
@@ -659,7 +659,7 @@ li > .stock-info {
text-align: right; text-align: right;
&[data-selected='true'] { &[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 { ul {
min-height: auto; min-height: auto;
} }
src/components/tabs/WikiListTab.vue
+4 -4
View File
@@ -248,7 +248,7 @@ export default defineComponent({
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
@import '../../styles/tab.scss'; @use '@/styles/tab';
.actions { .actions {
display: grid; display: grid;
@@ -322,7 +322,7 @@ export default defineComponent({
} }
.sponsor-only { .sponsor-only {
color: $sponsorColor; color: global.$sponsorColor;
&::after { &::after {
content: '*'; content: '*';
@@ -330,7 +330,7 @@ export default defineComponent({
} }
.team-only { .team-only {
color: $teamColor; color: global.$teamColor;
&::after { &::after {
content: '*'; content: '*';
@@ -347,7 +347,7 @@ export default defineComponent({
background-color: #161c2e; background-color: #161c2e;
} }
@media screen and (max-width: $breakpointSm) { @media screen and (max-width: global.$breakpointSm) {
.actions-panel { .actions-panel {
align-items: stretch; align-items: stretch;
flex-direction: column; flex-direction: column;
src/components/utils/StockThumbnails.vue
+3 -3
View File
@@ -173,7 +173,7 @@ const getVehicleThumbnails = (vehicleString: string) => {
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
@import '../../styles/global.scss';
.stock-thumbnails { .stock-thumbnails {
overflow: auto; overflow: auto;
@@ -201,11 +201,11 @@ ul {
} }
&[data-sponsor-only='true'] > b { &[data-sponsor-only='true'] > b {
color: $sponsorColor; color: global.$sponsorColor;
} }
&[data-team-only='true'] > b { &[data-team-only='true'] > b {
color: $teamColor; color: global.$teamColor;
} }
img { img {
src/styles/global.scss → src/styles/_global.scss
+1
View File
@@ -2,6 +2,7 @@ $breakpointMd: 960px;
$breakpointSm: 550px; $breakpointSm: 550px;
$bgColor: #2b3552; $bgColor: #2b3552;
$bgColorDarker: #1f263b;
$textColor: #fff; $textColor: #fff;
$secondaryColor: #1b1b1b; $secondaryColor: #1b1b1b;
$accentColor: #e4c428; $accentColor: #e4c428;
src/styles/tab.scss → src/styles/_tab.scss
+2 -2
View File
@@ -1,4 +1,4 @@
@import './global.scss'; @use 'global';
.tab { .tab {
height: 100%; height: 100%;
@@ -7,7 +7,7 @@
&_header { &_header {
padding: 0.5em 1em; padding: 0.5em 1em;
background-color: $secondaryColor; background-color: global.$secondaryColor;
text-align: center; text-align: center;
h2 { h2 {
vite.config.ts
+13 -11
View File
@@ -2,14 +2,21 @@ import { defineConfig } from 'vite';
import vue from '@vitejs/plugin-vue'; import vue from '@vitejs/plugin-vue';
import { VitePWA } from 'vite-plugin-pwa'; import { VitePWA } from 'vite-plugin-pwa';
import path from 'path';
// https://vitejs.dev/config/ // https://vitejs.dev/config/
export default defineConfig({ export default defineConfig({
server: { server: { port: 2138 },
port: 2138, preview: { port: 4138 },
css: {
preprocessorOptions: {
scss: { additionalData: `@use '@/styles/global';`, silenceDeprecations: ['legacy-js-api'] },
},
}, },
preview: { resolve: {
port: 4138, alias: {
'@': path.resolve(__dirname, 'src'),
},
}, },
plugins: [ plugins: [
vue(), vue(),
@@ -18,10 +25,7 @@ export default defineConfig({
includeAssets: ['/images/*.{png,svg,jpg}', '/fonts/*.{woff,woff2,ttf}'], includeAssets: ['/images/*.{png,svg,jpg}', '/fonts/*.{woff,woff2,ttf}'],
devOptions: { devOptions: { suppressWarnings: true, enabled: true },
suppressWarnings: true,
enabled: true,
},
workbox: { workbox: {
cleanupOutdatedCaches: true, cleanupOutdatedCaches: true,
@@ -31,9 +35,7 @@ export default defineConfig({
{ {
urlPattern: /^https:\/\/.*\.spythere\.eu\/.*/i, urlPattern: /^https:\/\/.*\.spythere\.eu\/.*/i,
handler: 'StaleWhileRevalidate', handler: 'StaleWhileRevalidate',
options: { options: { cacheName: 'spythere-cache' },
cacheName: 'spythere-cache',
},
}, },
], ],
}, },
yarn.lock
+2157 -2314
View File
File diff suppressed because it is too large Load Diff