Skip to content

Commit

Permalink
style: prettier formatting
Browse files Browse the repository at this point in the history
  • Loading branch information
uwla committed Feb 19, 2025
1 parent 2ee6731 commit 1759740
Show file tree
Hide file tree
Showing 67 changed files with 1,056 additions and 1,024 deletions.
4 changes: 2 additions & 2 deletions src/components/ActionButtons/ActionButtons.scss
Original file line number Diff line number Diff line change
@@ -1,5 +1,5 @@
.vdt-action-buttons {
display: flex;
justify-content: center;
grid-gap: .3em;
}
grid-gap: 0.3em;
}
23 changes: 8 additions & 15 deletions src/components/ActionButtons/ActionButtons.ts
Original file line number Diff line number Diff line change
Expand Up @@ -4,25 +4,18 @@ export default defineComponent({
name: "VdtActionButtons",
methods: {
triggerAction(action: string) {
this.$emit('userEvent', {
action: action,
data: this.data,
})
}
this.$emit("userEvent", { action: action, data: this.data })
},
},
props: {
actions: {
type: Array as () => string[],
default: () => ['view', 'edit', 'delete']
default: () => ["view", "edit", "delete"],
},
actionIcons: {
type: Object as () => ({ [key: string]: string }),
default: () => ({
view: "👁️",
edit: "✏️",
delete: "🗑️",
})
type: Object as () => { [key: string]: string },
default: () => ({ view: "👁️", edit: "✏️", delete: "🗑️" }),
},
data: Object
}
})
data: Object,
},
})
9 changes: 6 additions & 3 deletions src/components/ActionButtons/ActionButtons.vue
Original file line number Diff line number Diff line change
@@ -1,12 +1,15 @@
<template>
<div class="vdt-action-buttons">
<button v-for="(action, i) in actions" :key="i"
<button
v-for="(action, i) in actions"
:key="i"
class="vdt-btn"
:class="`vdt-action-${action}`"
@click="triggerAction(action)">
@click="triggerAction(action)"
>
{{ actionIcons[action] }}
</button>
</div>
</template>
<script src="./ActionButtons.ts" lang="ts"></script>
<style src="./ActionButtons.scss" lang="scss"></style>
<style src="./ActionButtons.scss" lang="scss"></style>
68 changes: 36 additions & 32 deletions src/components/DataTable.scss
Original file line number Diff line number Diff line change
Expand Up @@ -3,31 +3,33 @@
width: 100%;
grid-template-columns: 25% 25% 25% 25%;

& > .vdt-search, .vdt-pagination, .vdt-export {
margin-left: auto
& > .vdt-search,
.vdt-pagination,
.vdt-export {
margin-left: auto;
}

@media (min-width: 1401px) {
grid-template-areas:
"perPage search search search"
"table table table table"
"info pagination pagination download";
"perPage search search search"
"table table table table"
"info pagination pagination download";
}

@media (min-width: 1051px) AND (max-width: 1400px) {
grid-template-areas:
"perPage search search search"
"table table table table"
"info pagination pagination pagination"
". . download download";
"perPage search search search"
"table table table table"
"info pagination pagination pagination"
". . download download";
}

@media (min-width: 851px) AND (max-width: 1050px) {
grid-template-areas:
"perPage search search search"
"table table table table"
"pagination pagination pagination pagination"
"info info download download";
"perPage search search search"
"table table table table"
"pagination pagination pagination pagination"
"info info download download";
}

@medi max-width: 800px) {
Expand All @@ -38,24 +40,24 @@

@media (min-width: 651px) AND (max-width: 850px) {
grid-template-areas:
"perPage search search search"
"table table table table"
"pagination pagination pagination pagination"
"info info info info"
"download download download download";
"perPage search search search"
"table table table table"
"pagination pagination pagination pagination"
"info info info info"
"download download download download";
}

@media (max-width: 650px) {
grid-template-areas:
"search search search search"
"perPage perPage perPage perPage "
"table table table table"
"pagination pagination pagination pagination"
"info info info info"
"download download download download";

&>.vdt-perpage {
margin-left: auto
"search search search search"
"perPage perPage perPage perPage "
"table table table table"
"pagination pagination pagination pagination"
"info info info info"
"download download download download";

& > .vdt-perpage {
margin-left: auto;
}
}

Expand All @@ -71,7 +73,7 @@
.vdt-input {
background-color: #fff;
border: 1px solid #ced4da;
border-radius: .25rem;
border-radius: 0.25rem;
color: #495057;
display: inline-block;
line-height: 1.5;
Expand All @@ -94,19 +96,20 @@

.vdt-btn {
border: 1px solid transparent;
border-radius: .25rem;
border-radius: 0.25rem;
cursor: pointer;
color: #fff;
display: inline-block;
font-size: 1rem;
font-weight: 400;
line-height: 1.5;
padding: .375rem .75rem;
padding: 0.375rem 0.75rem;
text-align: center;
vertical-align: middle;
}

.vdt-action-view, .vdt-action-confirm {
.vdt-action-view,
.vdt-action-confirm {
border: 1px solid #28a745;
background-color: #28a745;
&:hover {
Expand All @@ -115,7 +118,8 @@
}
}

.vdt-action-edit, .vdt-btn-primary {
.vdt-action-edit,
.vdt-btn-primary {
border: 1px solid #007bff;
background-color: #007bff;
&:hover {
Expand Down
Loading

0 comments on commit 1759740

Please sign in to comment.