restruct: updated sass version and rules

This commit is contained in:
2025-03-26 18:04:00 +01:00
parent 829059d35b
commit 22b6177560
71 changed files with 2447 additions and 2507 deletions
@@ -234,9 +234,9 @@ export default defineComponent({
</script>
<style lang="scss" scoped>
@import '../../styles/responsive.scss';
@import '../../styles/JournalStats.scss';
@import '../../styles/badge.scss';
@use '../../styles/animations';
@use '../../styles/journal-stats';
@use '../../styles/responsive';
.daily-stats {
text-align: left;
@@ -265,7 +265,7 @@ ul.stats-list {
gap: 0.5em;
}
@include smallScreen {
@include responsive.smallScreen{
h3 {
text-align: center;
}
@@ -121,14 +121,8 @@ import StationStatusBadge from '../../Global/StationStatusBadge.vue';
export default defineComponent({
props: {
entry: {
type: Object as PropType<API.DispatcherHistory.Data>,
required: true
},
showExtraInfo: {
type: Boolean,
required: true
}
entry: { type: Object as PropType<API.DispatcherHistory.Data>, required: true },
showExtraInfo: { type: Boolean, required: true }
},
components: { StationStatusBadge },
@@ -136,10 +130,7 @@ export default defineComponent({
emits: ['toggleShowExtraInfo'],
data() {
return {
regions,
apiStore: useApiStore()
};
return { regions, apiStore: useApiStore() };
},
methods: {
@@ -151,8 +142,8 @@ export default defineComponent({
</script>
<style lang="scss" scoped>
@import '../../../styles/responsive.scss';
@import '../../../styles/badge.scss';
@use '../../../styles/responsive';
@use '../../../styles/badge';
.region-badge {
padding: 0 0.25em;
@@ -207,7 +198,7 @@ export default defineComponent({
border-radius: 1em;
}
@include smallScreen {
@include responsive.smallScreen{
.entry-info {
flex-direction: column;
justify-content: center;
@@ -81,5 +81,5 @@ export default defineComponent({
</script>
<style lang="scss" scoped>
@import '../../../styles/JournalStats.scss';
@use '../../../styles/journal-stats';
</style>
@@ -104,6 +104,5 @@ export default defineComponent({
</script>
<style lang="scss" scoped>
@import '../../../styles/variables.scss';
@import '../../../styles/JournalSection.scss';
@use '../../../styles/journal-section';
</style>
@@ -300,6 +300,6 @@ export default defineComponent({
</script>
<style lang="scss" scoped>
@import '../../styles/dropdown';
@import '../../styles/dropdown_filters';
@use '../../styles/dropdown';
@use '../../styles/dropdown-filters';
</style>
+2 -4
View File
@@ -79,14 +79,12 @@ export default defineComponent({
</script>
<style lang="scss" scoped>
@import '../../styles/dropdown.scss';
@import '../../styles/dropdown_filters.scss';
@import '../../styles/variables.scss';
@use '../../styles/dropdown';
@use '../../styles/dropdown-filters';
.dropdown_wrapper.dropdown-align-right {
left: auto;
right: 0;
max-width: 700px;
// max-width: 100%;
}
</style>
@@ -225,9 +225,8 @@ export default defineComponent({
</script>
<style lang="scss" scoped>
@import '../../../styles/variables.scss';
@import '../../../styles/responsive.scss';
@import '../../../styles/badge.scss';
@use '../../../styles/responsive';
@use '../../../styles/badge';
.details-body {
margin-top: 0.5em;
@@ -250,7 +249,7 @@ export default defineComponent({
margin-top: 1em;
button[data-checked='true'] {
color: $accentCol;
color: var(--clr-primary);
}
}
@@ -272,7 +271,7 @@ export default defineComponent({
span:last-child {
color: black;
background-color: $accentCol;
background-color: var(--clr-primary);
border-radius: 0 0.25em 0.25em 0;
}
}
@@ -300,7 +299,7 @@ hr {
}
}
@include smallScreen() {
@include responsive.smallScreen{
.timetable-specs {
justify-content: center;
}
@@ -130,8 +130,8 @@ export default defineComponent({
</script>
<style lang="scss" scoped>
@import '../../../styles/responsive';
@import '../../../styles/badge';
@use '../../../styles/responsive';
@use '../../../styles/badge';
.item-general {
display: flex;
@@ -191,7 +191,7 @@ export default defineComponent({
}
}
@include smallScreen {
@include responsive.smallScreen{
.item-general {
flex-direction: column;
justify-content: center;
@@ -59,7 +59,7 @@ export default defineComponent({
</script>
<style lang="scss" scoped>
@import '../../../styles/responsive.scss';
@use '../../../styles/responsive';
.entry-status {
display: flex;
@@ -67,7 +67,7 @@ export default defineComponent({
flex-wrap: wrap;
gap: 0.5em;
@include smallScreen() {
@include responsive.smallScreen{
justify-content: center;
}
}
@@ -187,7 +187,7 @@ export default defineComponent({
</script>
<style lang="scss" scoped>
@import '../../../styles/badge.scss';
@use '../../../styles/badge';
.entry-stops {
word-wrap: break-word;
@@ -68,5 +68,5 @@ export default defineComponent({
</script>
<style lang="scss" scoped>
@import '../../../styles/JournalStats.scss';
@use '../../../styles/journal-stats';
</style>
@@ -3,14 +3,14 @@
<!-- General -->
<EntryGeneral :timetable="timetableEntry" />
<!-- Route -->
<div class="entry-route">
<b>{{ timetableEntry.route.replace('|', ' - ') }}</b>
</div>
<hr />
<div @click="toggleExtraInfo" style="cursor: pointer">
<!-- Route -->
<div class="entry-route">
<b>{{ timetableEntry.route.replace('|', ' - ') }}</b>
</div>
<hr />
<!-- Status -->
<EntryStatus :timetable="timetableEntry" />
</div>
@@ -134,15 +134,20 @@ export default defineComponent({
</script>
<style lang="scss" scoped>
@import '../../../styles/responsive.scss';
@use '../../../styles/responsive';
.timetable-history-entry {
background-color: #1a1a1a;
padding: 1em;
}
@include smallScreen {
.entry-route {
display: flex;
}
@include responsive.smallScreen{
.entry-route {
justify-content: center;
text-align: center;
}
}
@@ -107,10 +107,11 @@ export default defineComponent({
</script>
<style lang="scss" scoped>
@import '../../../styles/JournalSection.scss';
@import '../../../styles/animations.scss';
@use '../../../styles/animations';
@use '../../../styles/journal-section';
@use '../../../styles/responsive';
@include smallScreen {
@include responsive.smallScreen{
.journal_item-info {
text-align: center;
}