@tiddh/brave-vue 1.93.60 → 1.93.62

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (4) hide show
  1. package/dist/src/Modal/Sidebar.vue +34 -12
  2. package/dist/src/Sidebar.vue +34 -12
  3. package/dist/src/components/Modal/Sidebar.vue +34 -12
  4. package/package.json +1 -1
package/dist/src/Modal/Sidebar.vue CHANGED
@@ -3,9 +3,13 @@
3
3
  <div :dir="dir">
4
4
  <div
5
5
  class="sidebar-brave"
6
- :class="[sidebarOpen ? 'open-sidebar' : 'close-sidebar', dir]"
6
+ :class="[
7
+ sidebarOpen ? 'open-sidebar' : 'close-sidebar',
8
+ dir,
9
+ cssSidebar,
10
+ ]"
7
11
  >
8
- <div class="overlay" v-if="sidebarOpen"></div>
12
+ <div class="overlay" v-if="sidebarOpen" @click="closeSidebar()"></div>
9
13
 
10
14
  <div class="sidebar">
11
15
  <div class="sidebar-close" @click="closeSidebar()">
@@ -61,13 +65,24 @@
61
65
  },
62
66
  },
63
67
 
68
+ watch: {
69
+ sidebarOpen(newVal, oldVal) {
70
+ // This function will be called whenever the 'myProp' prop changes.
71
+ // You can perform actions here based on the new and old values of 'myProp'.
72
+ if (newVal == true) {
73
+ this.cssSidebar = "";
74
+ }
75
+ //console.log("myProp changed:", newVal, oldVal);
76
+ },
77
+ },
78
+
64
79
  data() {
65
80
  return {
66
81
  sidebarPlans: false,
67
82
 
68
83
  planSidebar: null,
69
84
  giftSidebar: null,
70
- cssSidebar: "close-sidebar hide-overlay",
85
+ cssSidebar: "after-animation",
71
86
 
72
87
  paymentMethodsSelect: [],
73
88
  selectedMethod: [],
@@ -87,7 +102,9 @@
87
102
 
88
103
  async created() {},
89
104
 
90
- async mounted() {},
105
+ async mounted() {
106
+ //this.cssSidebar = "";
107
+ },
91
108
 
92
109
  methods: {
93
110
  click() {
@@ -100,19 +117,18 @@
100
117
  openSideBar() {
101
118
  const self = this;
102
119
 
103
- self.cssSidebar = "open-sidebar";
120
+ //self.cssSidebar = "open-sidebar";
104
121
  },
105
122
 
106
123
  closeSidebar() {
107
124
  const self = this;
108
125
 
109
- self.cssSidebar = "close-sidebar";
110
126
  document.getElementsByTagName("html")[0].removeAttribute("style");
111
127
  document.getElementsByTagName("body")[0].removeAttribute("style");
112
128
 
113
129
  setTimeout(function () {
114
130
  //self.cssSidebar = "close-sidebar hide-overlay";
115
-
131
+ self.cssSidebar = "after-animation";
116
132
  // self.$store.commit("checkout/OPEN_EDIT_PLAN", {
117
133
  // target: "plan",
118
134
  // value: false,
@@ -122,8 +138,8 @@
122
138
  // value: false,
123
139
  // });
124
140
  //self.cssSidebar = "open-sidebar";
125
-
126
- self.$emit("closeSidebar");
141
+ //self.
142
+ self.self.$emit("closeSidebar");
127
143
  }, 500);
128
144
  },
129
145
  },
@@ -137,11 +153,12 @@
137
153
  .sidebar-brave {
138
154
  width: 100%;
139
155
  position: fixed;
140
- top: 0;
156
+
141
157
  height: 100%;
142
158
  z-index: 999;
143
159
  overflow: hidden;
144
- display: none;
160
+ //display: none;
161
+ //bottom: 100%;
145
162
 
146
163
  @include media-breakpoint-down("sm") {
147
164
  overflow-y: scroll;
@@ -475,8 +492,9 @@
475
492
 
476
493
  &.open-sidebar {
477
494
  //display: block;
478
- display: none;
495
+ //display: block;
479
496
  right: 0px;
497
+ top: 0;
480
498
 
481
499
  &.rtl {
482
500
  right: auto !important;
@@ -504,7 +522,11 @@
504
522
  }
505
523
 
506
524
  &.close-sidebar {
525
+ top: 0;
507
526
  //display: none;
527
+ &.after-animation {
528
+ top: 100%;
529
+ }
508
530
 
509
531
  &.rtl {
510
532
  //right: auto !important;
package/dist/src/Sidebar.vue CHANGED
@@ -3,9 +3,13 @@
3
3
  <div :dir="dir">
4
4
  <div
5
5
  class="sidebar-brave"
6
- :class="[sidebarOpen ? 'open-sidebar' : 'close-sidebar', dir]"
6
+ :class="[
7
+ sidebarOpen ? 'open-sidebar' : 'close-sidebar',
8
+ dir,
9
+ cssSidebar,
10
+ ]"
7
11
  >
8
- <div class="overlay" v-if="sidebarOpen"></div>
12
+ <div class="overlay" v-if="sidebarOpen" @click="closeSidebar()"></div>
9
13
 
10
14
  <div class="sidebar">
11
15
  <div class="sidebar-close" @click="closeSidebar()">
@@ -61,13 +65,24 @@
61
65
  },
62
66
  },
63
67
 
68
+ watch: {
69
+ sidebarOpen(newVal, oldVal) {
70
+ // This function will be called whenever the 'myProp' prop changes.
71
+ // You can perform actions here based on the new and old values of 'myProp'.
72
+ if (newVal == true) {
73
+ this.cssSidebar = "";
74
+ }
75
+ //console.log("myProp changed:", newVal, oldVal);
76
+ },
77
+ },
78
+
64
79
  data() {
65
80
  return {
66
81
  sidebarPlans: false,
67
82
 
68
83
  planSidebar: null,
69
84
  giftSidebar: null,
70
- cssSidebar: "close-sidebar hide-overlay",
85
+ cssSidebar: "after-animation",
71
86
 
72
87
  paymentMethodsSelect: [],
73
88
  selectedMethod: [],
@@ -87,7 +102,9 @@
87
102
 
88
103
  async created() {},
89
104
 
90
- async mounted() {},
105
+ async mounted() {
106
+ //this.cssSidebar = "";
107
+ },
91
108
 
92
109
  methods: {
93
110
  click() {
@@ -100,19 +117,18 @@
100
117
  openSideBar() {
101
118
  const self = this;
102
119
 
103
- self.cssSidebar = "open-sidebar";
120
+ //self.cssSidebar = "open-sidebar";
104
121
  },
105
122
 
106
123
  closeSidebar() {
107
124
  const self = this;
108
125
 
109
- self.cssSidebar = "close-sidebar";
110
126
  document.getElementsByTagName("html")[0].removeAttribute("style");
111
127
  document.getElementsByTagName("body")[0].removeAttribute("style");
112
128
 
113
129
  setTimeout(function () {
114
130
  //self.cssSidebar = "close-sidebar hide-overlay";
115
-
131
+ self.cssSidebar = "after-animation";
116
132
  // self.$store.commit("checkout/OPEN_EDIT_PLAN", {
117
133
  // target: "plan",
118
134
  // value: false,
@@ -122,8 +138,8 @@
122
138
  // value: false,
123
139
  // });
124
140
  //self.cssSidebar = "open-sidebar";
125
-
126
- self.$emit("closeSidebar");
141
+ //self.
142
+ self.self.$emit("closeSidebar");
127
143
  }, 500);
128
144
  },
129
145
  },
@@ -137,11 +153,12 @@
137
153
  .sidebar-brave {
138
154
  width: 100%;
139
155
  position: fixed;
140
- top: 0;
156
+
141
157
  height: 100%;
142
158
  z-index: 999;
143
159
  overflow: hidden;
144
- display: none;
160
+ //display: none;
161
+ //bottom: 100%;
145
162
 
146
163
  @include media-breakpoint-down("sm") {
147
164
  overflow-y: scroll;
@@ -475,8 +492,9 @@
475
492
 
476
493
  &.open-sidebar {
477
494
  //display: block;
478
- display: none;
495
+ //display: block;
479
496
  right: 0px;
497
+ top: 0;
480
498
 
481
499
  &.rtl {
482
500
  right: auto !important;
@@ -504,7 +522,11 @@
504
522
  }
505
523
 
506
524
  &.close-sidebar {
525
+ top: 0;
507
526
  //display: none;
527
+ &.after-animation {
528
+ top: 100%;
529
+ }
508
530
 
509
531
  &.rtl {
510
532
  //right: auto !important;
package/dist/src/components/Modal/Sidebar.vue CHANGED
@@ -3,9 +3,13 @@
3
3
  <div :dir="dir">
4
4
  <div
5
5
  class="sidebar-brave"
6
- :class="[sidebarOpen ? 'open-sidebar' : 'close-sidebar', dir]"
6
+ :class="[
7
+ sidebarOpen ? 'open-sidebar' : 'close-sidebar',
8
+ dir,
9
+ cssSidebar,
10
+ ]"
7
11
  >
8
- <div class="overlay" v-if="sidebarOpen"></div>
12
+ <div class="overlay" v-if="sidebarOpen" @click="closeSidebar()"></div>
9
13
 
10
14
  <div class="sidebar">
11
15
  <div class="sidebar-close" @click="closeSidebar()">
@@ -61,13 +65,24 @@
61
65
  },
62
66
  },
63
67
 
68
+ watch: {
69
+ sidebarOpen(newVal, oldVal) {
70
+ // This function will be called whenever the 'myProp' prop changes.
71
+ // You can perform actions here based on the new and old values of 'myProp'.
72
+ if (newVal == true) {
73
+ this.cssSidebar = "";
74
+ }
75
+ //console.log("myProp changed:", newVal, oldVal);
76
+ },
77
+ },
78
+
64
79
  data() {
65
80
  return {
66
81
  sidebarPlans: false,
67
82
 
68
83
  planSidebar: null,
69
84
  giftSidebar: null,
70
- cssSidebar: "close-sidebar hide-overlay",
85
+ cssSidebar: "after-animation",
71
86
 
72
87
  paymentMethodsSelect: [],
73
88
  selectedMethod: [],
@@ -87,7 +102,9 @@
87
102
 
88
103
  async created() {},
89
104
 
90
- async mounted() {},
105
+ async mounted() {
106
+ //this.cssSidebar = "";
107
+ },
91
108
 
92
109
  methods: {
93
110
  click() {
@@ -100,19 +117,18 @@
100
117
  openSideBar() {
101
118
  const self = this;
102
119
 
103
- self.cssSidebar = "open-sidebar";
120
+ //self.cssSidebar = "open-sidebar";
104
121
  },
105
122
 
106
123
  closeSidebar() {
107
124
  const self = this;
108
125
 
109
- self.cssSidebar = "close-sidebar";
110
126
  document.getElementsByTagName("html")[0].removeAttribute("style");
111
127
  document.getElementsByTagName("body")[0].removeAttribute("style");
112
128
 
113
129
  setTimeout(function () {
114
130
  //self.cssSidebar = "close-sidebar hide-overlay";
115
-
131
+ self.cssSidebar = "after-animation";
116
132
  // self.$store.commit("checkout/OPEN_EDIT_PLAN", {
117
133
  // target: "plan",
118
134
  // value: false,
@@ -122,8 +138,8 @@
122
138
  // value: false,
123
139
  // });
124
140
  //self.cssSidebar = "open-sidebar";
125
-
126
- self.$emit("closeSidebar");
141
+ //self.
142
+ self.self.$emit("closeSidebar");
127
143
  }, 500);
128
144
  },
129
145
  },
@@ -137,11 +153,12 @@
137
153
  .sidebar-brave {
138
154
  width: 100%;
139
155
  position: fixed;
140
- top: 0;
156
+
141
157
  height: 100%;
142
158
  z-index: 999;
143
159
  overflow: hidden;
144
- display: none;
160
+ //display: none;
161
+ //bottom: 100%;
145
162
 
146
163
  @include media-breakpoint-down("sm") {
147
164
  overflow-y: scroll;
@@ -475,8 +492,9 @@
475
492
 
476
493
  &.open-sidebar {
477
494
  //display: block;
478
- display: none;
495
+ //display: block;
479
496
  right: 0px;
497
+ top: 0;
480
498
 
481
499
  &.rtl {
482
500
  right: auto !important;
@@ -504,7 +522,11 @@
504
522
  }
505
523
 
506
524
  &.close-sidebar {
525
+ top: 0;
507
526
  //display: none;
527
+ &.after-animation {
528
+ top: 100%;
529
+ }
508
530
 
509
531
  &.rtl {
510
532
  //right: auto !important;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@tiddh/brave-vue",
3
- "version": "1.93.60",
3
+ "version": "1.93.62",
4
4
  "private": false,
5
5
  "main": "dist/brave-vue.ssr.js",
6
6
  "browser": "dist/brave-vue.esm.js",