This repository has been archived by the owner on Mar 7, 2023. It is now read-only.
-
Notifications
You must be signed in to change notification settings - Fork 21
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
feat: add Pods, Dashboard, Upgrade views, etc
Add few views and components Signed-off-by: evgeniybryzh<evgeniy@merge.rocks> Signed-off-by: Artem Chernyshev <artem.chernyshev@talos-systems.com>
- Loading branch information
Showing
51 changed files
with
2,496 additions
and
284 deletions.
There are no files selected for viewing
Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.
Oops, something went wrong.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,55 @@ | ||
| <template> | ||
| <div | ||
| v-click-outside="() => (isActionsDropdownOpened = false)" | ||
| class="box__actions" | ||
| ref="settingsButton" | ||
| > | ||
| <Popper offsetDistance="10" placement="left-start" zIndex="10"> | ||
| <template #content> | ||
| <slot /> | ||
| </template> | ||
| <button> | ||
| <t-icon | ||
| @click="() => (isActionsDropdownOpened = !isActionsDropdownOpened)" | ||
| class="box__actions-icon" | ||
| icon="action-horizontal" | ||
| :class="{ highlighted: isActionsDropdownOpened }" | ||
| /> | ||
| </button> | ||
| </Popper> | ||
| </div> | ||
| </template> | ||
|
|
||
| <script lang="ts"> | ||
| import { ref } from "@vue/reactivity"; | ||
| import TIcon from "@/components/common/Icon/TIcon.vue"; | ||
| import vClickOutside from "click-outside-vue3"; | ||
| import Popper from "vue3-popper"; | ||
| export default { | ||
| components: { Popper, TIcon }, | ||
| directives: { | ||
| clickOutside: vClickOutside.directive, | ||
| }, | ||
| setup() { | ||
| const isActionsDropdownOpened = ref(false); | ||
| const settingsButton = ref(null); | ||
| return { | ||
| isActionsDropdownOpened, | ||
| settingsButton, | ||
| }; | ||
| }, | ||
| }; | ||
| </script> | ||
|
|
||
| <style scoped> | ||
| .box__actions-icon { | ||
| @apply fill-current text-naturals-N11 hover:bg-naturals-N7 transition-all rounded duration-100 cursor-pointer; | ||
| width: 24px; | ||
| height: 24px; | ||
| } | ||
| .highlighted { | ||
| @apply bg-naturals-N7; | ||
| } | ||
| </style> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
19 changes: 19 additions & 0 deletions
19
frontend/src/components/common/Animation/TGroupAnimation.vue
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,19 @@ | ||
| <template> | ||
| <transition-group> | ||
| <slot /> | ||
| </transition-group> | ||
| </template> | ||
|
|
||
| <style> | ||
| .v-item { | ||
| opacity: 1; | ||
| } | ||
| .v-enter-active, | ||
| .v-leave-active { | ||
| transition: all 0.1s linear; | ||
| } | ||
| .v-enter-from, | ||
| .v-leave-to { | ||
| opacity: 0; | ||
| } | ||
| </style> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,42 @@ | ||
| <template> | ||
| <div class="checkbox" :class="{ checked: checked }"> | ||
| <t-animation> | ||
| <t-icon class="checkbox__icon" icon="check" v-show="checked" /> | ||
| </t-animation> | ||
| <input type="checkbox" hidden :value="checked" /> | ||
| </div> | ||
| </template> | ||
|
|
||
| <script lang="ts"> | ||
| import TIcon from "@/components/common/Icon/TIcon.vue"; | ||
| import TAnimation from "@/components/common/Animation/TAnimation.vue"; | ||
| export default { | ||
| components: { | ||
| TIcon, | ||
| TAnimation, | ||
| }, | ||
| props: { | ||
| checked: { | ||
| type: Boolean, | ||
| default: false, | ||
| }, | ||
| }, | ||
| }; | ||
| </script> | ||
|
|
||
| <style scoped> | ||
| .checkbox { | ||
| @apply border border-naturals-N7 flex items-center justify-center cursor-pointer; | ||
| width: 14px; | ||
| height: 14px; | ||
| border-radius: 2px; | ||
| } | ||
| .checked { | ||
| @apply border-primary-P6 bg-primary-P6; | ||
| } | ||
| .checkbox__icon { | ||
| @apply fill-current text-primary-P3; | ||
| width: 14px; | ||
| height: 14px; | ||
| } | ||
| </style> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Oops, something went wrong.