SebinNyshkim/sebin-reference
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

refactor: import specific SCSS mixins

Browse source
This commit is contained in:
Sebin Nyshkim 2022-01-11 20:47:25 +01:00
parent 25e8b0ad65
commit f2948005e1
7 changed files with 23 additions and 15 deletions
Download patch file Download diff file Expand all files Collapse all files

12
src/components/DataTable.vue
View file

@ -63,14 +63,22 @@ export default {
</script>
<style lang="scss">
@import "@/scss/base.scss";
@import "@/scss/_variables.scss";
@import "@/scss/_mixins.scss";
.datatable {
border-collapse: collapse;
width: 100%;
max-width: 55rem;
margin: auto;
@include mq-desktop {
max-width: 45rem;
}
@include mq-bigscreen {
max-width: 55rem;
}
&__heading,
&__cell {
padding: 0.25em 0.5em;

4
src/components/Navigation.vue
View file

@ -23,7 +23,8 @@ export default {
</script>
<style lang="scss">
@import "@/scss/base.scss";
@import "@/scss/_variables.scss";
@import "@/scss/_mixins.scss";
.nav {
overflow: auto;
@ -89,7 +90,6 @@ export default {
position: absolute;
width: 0;
height: 0.125em;
// background-color: $copy-color;
bottom: 0;
transition: all 0.2s ease-in-out;
}

2
src/components/NsfwSwitch.vue
View file

@ -25,7 +25,7 @@ export default {
</script>
<style lang="scss">
@import "@/scss/base.scss";
@import "@/scss/_variables.scss";
.nsfw-switch {
font-family: "apple color emoji", "segoe ui emoji", "noto color emoji",

10
src/components/Prose.vue
View file

@ -5,7 +5,7 @@
</template>
<style lang="scss">
@import "@/scss/base.scss";
@import "@/scss/_mixins.scss";
.prose {
padding: 0 env(safe-area-inset-right) 0 env(safe-area-inset-left);
@ -16,18 +16,22 @@
p,
.quickfacts,
.btn-group {
max-width: 55rem;
margin: {
left: 1rem;
right: 1rem;
}
@media (min-width: 55em) {
@include mq-desktop {
max-width: 45rem;
margin: {
left: auto;
right: auto;
}
}
@include mq-bigscreen {
max-width: 55rem;
}
}
}
</style>

6
src/components/QuickFacts.vue
View file

@ -24,7 +24,7 @@ export default {
</script>
<style lang="scss">
@import "@/scss/base.scss";
@import "@/scss/_variables.scss";
.quickfacts {
border-radius: 1em;
@ -83,10 +83,6 @@ export default {
ul {
margin: 0;
padding: 0 0.5em;
@media (min-width: 40em) {
columns: 2 auto;
}
}
li {