diff --git a/frontend/src/components/ListSecrets.vue b/frontend/src/components/ListSecrets.vue
index 12ff59b..c2944fd 100644
--- a/frontend/src/components/ListSecrets.vue
+++ b/frontend/src/components/ListSecrets.vue
@@ -16,13 +16,9 @@
>
-
+
+
+
@@ -54,6 +50,7 @@
:secret="secret.secret"
:id="secret.id"
:showOtp="showSecrets"
+ :key="showSecrets"
@edit="editSecret"
/>
@@ -86,12 +83,8 @@ export default {
loadCards: false,
showClear: false,
showSecrets: "yes",
- currentSort: "none",
+ currentSort: "asc",
sortOptions: [
- {
- name: "None",
- key: "none",
- },
{
name: "A-Z",
key: "asc",
@@ -131,6 +124,7 @@ export default {
this.secretsList.push(row);
});
this.filteredSecretsList = this.secretsList;
+ this.sortItems();
this.loadCards = true;
},
@@ -189,6 +183,7 @@ export default {
currentFilter: function () {
const filteredList = this.secretsList.filter(this.checkFirstLetter);
this.filteredSecretsList = filteredList;
+ this.sortItems();
},
currentSort: function () {
@@ -219,14 +214,15 @@ export default {
display: flex;
flex-direction: row;
flex-wrap: wrap;
- max-width: 90vw;
+ justify-content: space-evenly;
+ max-width: 96vw;
}
.filter-buttons {
- width: 90%;
+ width: 96vw;
display: flex;
- margin: 20px 0 20px 0;
- justify-content: space-between;
+ margin: 40px 0 20px 0;
+ justify-content: space-around;
flex-wrap: wrap;
}
@@ -235,16 +231,4 @@ export default {
justify-content: space-between;
min-width: 80px;
}
-/*
-#sort {
- border: none;
- border-bottom: 1px solid green;
- margin: 0 4px 0 4px;
- font-size: 1rem;
- text-align: center;
-}
-
-#sort:focus {
- outline: none;
-} */