@burh/nuxt-core 1.0.340 → 1.0.341

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 (28) hide show
  1. package/assets/sass/burh-ds/_global.scss +323 -323
  2. package/assets/sass/burh-ds/content/_interface-spa.scss +306 -306
  3. package/assets/sass/burh-ds/content/_main-content.scss +25 -25
  4. package/components/argon-core/BaseDropdown.vue +114 -114
  5. package/components/argon-core/LoadingPanel.vue +26 -26
  6. package/components/argon-core/Modal.vue +183 -183
  7. package/components/burh-ds/Cards/BaseCard.vue +190 -188
  8. package/components/burh-ds/Cards/FeatureBusinessCard.vue +74 -74
  9. package/components/burh-ds/Cards/PerformanceCard.vue +81 -81
  10. package/components/burh-ds/Cards/RecruitmentCard.vue +229 -229
  11. package/components/burh-ds/Curriculum/UserCurriculum/index.vue +245 -245
  12. package/components/burh-ds/Dropdown/JobStatusDropdown.vue +153 -146
  13. package/components/burh-ds/Filters/FilterWithDropdown.vue +228 -169
  14. package/components/burh-ds/Inputs/SearchInput.vue +64 -64
  15. package/components/burh-ds/Modals/NewUserModal.vue +87 -87
  16. package/components/burh-ds/Modals/SharedModal.vue +270 -270
  17. package/components/burh-ds/Modals/UniversityAccessModal.vue +134 -134
  18. package/components/burh-ds/Skeleton/BaseCardUniversity.vue +79 -79
  19. package/components/burh-ds/Skeleton/BaseCardUser.vue +84 -84
  20. package/components/burh-ds/Skeleton/BaseCourseInfo.vue +71 -71
  21. package/components/burh-ds/Skeleton/Cards.vue +86 -86
  22. package/components/burh-ds/Skeleton/Home.vue +100 -100
  23. package/components/burh-ds/Skeleton/RecruitmentCard.vue +169 -169
  24. package/components/burh-ds/Skeleton/SkeletonAnimate.vue +96 -96
  25. package/environment.js +221 -221
  26. package/nuxt.config.js +207 -207
  27. package/package.json +1 -1
  28. package/plugins/vClickOutside.js +4 -4
package/components/burh-ds/Cards/BaseCard.vue CHANGED
@@ -1,188 +1,190 @@
1
- <template>
2
- <div class="recruitment__user__card">
3
- <div
4
- class="recruitment__user__card__header"
5
- :class="[
6
- { 'header__cover--shadow': cover },
7
- { 'header__cover--glass': glass }
8
- ]"
9
- >
10
- <div class="recruitment__user__card__header__actions">
11
- <div class="left">
12
- <slot name="header-left" />
13
- </div>
14
- <div class="right">
15
- <slot name="header-right" />
16
- </div>
17
- </div>
18
- <img
19
- :src="cover"
20
- class="user__cover"
21
- >
22
- </div>
23
-
24
- <div class="recruitment__user__card__content">
25
- <img :src="(avatar) ? avatar : getNameInitials(name, last_name)" :alt="name">
26
-
27
- <slot name="card-content" />
28
- </div>
29
-
30
- <div class="recruitment__user__card__footer">
31
- <slot name="card-footer" />
32
- </div>
33
- </div>
34
- </template>
35
-
36
- <script>
37
- export default {
38
- name: 'recruitment-user-card',
39
- props: {
40
- cover: {
41
- type: String,
42
- default: null
43
- },
44
- avatar: {
45
- type: String,
46
- default: null
47
- },
48
- name: {
49
- type: String,
50
- default: null
51
- },
52
- last_name: {
53
- type: String,
54
- default: null
55
- },
56
- glass: {
57
- type: Boolean,
58
- default: false
59
- }
60
- },
61
- methods: {
62
- getNameInitials(name, last_name) {
63
- const avatarUrl = process.env.routes.avatar;
64
-
65
- let userAvatarName;
66
-
67
- if (name && last_name) {
68
- userAvatarName = `${name.toUpperCase().charAt(0)}${last_name.toUpperCase().charAt(0)}`;
69
- } else if (name && last_name === null) {
70
- userAvatarName = name;
71
- } else {
72
- userAvatarName = 'BURH';
73
- }
74
-
75
- return avatarUrl.replace(':size', '124x124').replace(':initials', userAvatarName);
76
- },
77
- }
78
- };
79
- </script>
80
-
81
- <style lang="scss" scoped>
82
-
83
- .recruitment__user__card {
84
- background: #fff;
85
- box-shadow: 0 3px 20px rgba(0, 0, 0, 0.08);
86
- border-radius: 4px;
87
- overflow: hidden;
88
- cursor: pointer;
89
- transition: transform 0.25s;
90
- &:focus {
91
- outline: none;
92
- transform: translateY(-5px);
93
- }
94
- &:hover {
95
- transform: translateY(-5px);
96
- }
97
-
98
- &__header {
99
- width: 100%;
100
- height: 70px;
101
- overflow: hidden;
102
- position: relative;
103
- background: #1F8CEB;
104
- &.header__cover--shadow::before {
105
- content: '';
106
- position: absolute;
107
- top: 0;
108
- left: 0;
109
- width: 100%;
110
- height: 100%;
111
- background: linear-gradient(180deg, rgba(0, 0, 0, 0.6), 80%, transparent);
112
- z-index: 1;
113
- }
114
- &.header__cover--glass {
115
- &::before {
116
- backdrop-filter: blur( 4px );
117
- -webkit-backdrop-filter: blur( 4px );
118
- background: rgba(0,0,0,0.2)!important;
119
- }
120
- }
121
- .user__cover {
122
- width: 100%;
123
- height: 100%;
124
- object-fit: cover;
125
- }
126
- &__actions {
127
- position: absolute;
128
- top: 0;
129
- left: 0;
130
- width: 100%;
131
- display: flex;
132
- align-items: center;
133
- justify-content: space-between;
134
- padding: 10px 15px;
135
- z-index: 2;
136
- .right {
137
- display: flex;
138
- align-items: center;
139
- flex-direction: row;
140
- button {
141
- color: #fff;
142
- border: 0;
143
- background: transparent;
144
- width: 32px;
145
- height: 32px;
146
- display: flex;
147
- align-items: center;
148
- justify-content: center;
149
- }
150
- }
151
- }
152
- }
153
- &__content {
154
- display: flex;
155
- flex-direction: column;
156
- align-items: center;
157
- justify-content: center;
158
- padding: 0 10px;
159
- img {
160
- width: 120px;
161
- height: 120px;
162
- border-radius: 100px;
163
- object-fit: contain;
164
- margin-top: -20px;
165
- z-index: 10;
166
- box-shadow: 0 0 20px rgba(0, 0, 0, 0.1);
167
- background: #fff;
168
- border: 4px solid #fff;
169
- }
170
- }
171
- &__footer {
172
- display: flex;
173
- align-items: center;
174
- justify-content: center;
175
- padding-bottom: 20px;
176
- span {
177
- font-size: 0.875rem;
178
- font-weight: 500;
179
- margin: 0 10px;
180
- color: #AEB6BE;
181
- &.new {
182
- color: #1F8CEB;
183
- }
184
- }
185
- }
186
- }
187
-
188
- </style>
1
+ <template>
2
+ <div class="recruitment__user__card">
3
+ <div
4
+ class="recruitment__user__card__header"
5
+ :class="[
6
+ { 'header__cover--shadow': cover },
7
+ { 'header__cover--glass': glass }
8
+ ]"
9
+ >
10
+ <div class="recruitment__user__card__header__actions">
11
+ <div class="left">
12
+ <slot name="header-left" />
13
+ </div>
14
+ <div class="right">
15
+ <slot name="header-right" />
16
+ </div>
17
+ </div>
18
+ <img
19
+ v-if="cover !== null"
20
+ :src="cover"
21
+ class="user__cover"
22
+ @error="cover = null"
23
+ >
24
+ </div>
25
+
26
+ <div class="recruitment__user__card__content">
27
+ <img :src="(avatar) ? avatar : getNameInitials(name, last_name)" :alt="name">
28
+
29
+ <slot name="card-content" />
30
+ </div>
31
+
32
+ <div class="recruitment__user__card__footer">
33
+ <slot name="card-footer" />
34
+ </div>
35
+ </div>
36
+ </template>
37
+
38
+ <script>
39
+ export default {
40
+ name: 'recruitment-user-card',
41
+ props: {
42
+ cover: {
43
+ type: String,
44
+ default: null
45
+ },
46
+ avatar: {
47
+ type: String,
48
+ default: null
49
+ },
50
+ name: {
51
+ type: String,
52
+ default: null
53
+ },
54
+ last_name: {
55
+ type: String,
56
+ default: null
57
+ },
58
+ glass: {
59
+ type: Boolean,
60
+ default: false
61
+ }
62
+ },
63
+ methods: {
64
+ getNameInitials(name, last_name) {
65
+ const avatarUrl = process.env.routes.avatar;
66
+
67
+ let userAvatarName;
68
+
69
+ if (name && last_name) {
70
+ userAvatarName = `${name.toUpperCase().charAt(0)}${last_name.toUpperCase().charAt(0)}`;
71
+ } else if (name && last_name === null) {
72
+ userAvatarName = name;
73
+ } else {
74
+ userAvatarName = 'BURH';
75
+ }
76
+
77
+ return avatarUrl.replace(':size', '124x124').replace(':initials', userAvatarName);
78
+ },
79
+ }
80
+ };
81
+ </script>
82
+
83
+ <style lang="scss" scoped>
84
+
85
+ .recruitment__user__card {
86
+ background: #fff;
87
+ box-shadow: 0 3px 20px rgba(0, 0, 0, 0.08);
88
+ border-radius: 4px;
89
+ overflow: hidden;
90
+ cursor: pointer;
91
+ transition: transform 0.25s;
92
+ &:focus {
93
+ outline: none;
94
+ transform: translateY(-5px);
95
+ }
96
+ &:hover {
97
+ transform: translateY(-5px);
98
+ }
99
+
100
+ &__header {
101
+ width: 100%;
102
+ height: 70px;
103
+ overflow: hidden;
104
+ position: relative;
105
+ background: #1F8CEB;
106
+ &.header__cover--shadow::before {
107
+ content: '';
108
+ position: absolute;
109
+ top: 0;
110
+ left: 0;
111
+ width: 100%;
112
+ height: 100%;
113
+ background: linear-gradient(180deg, rgba(0, 0, 0, 0.6), 80%, transparent);
114
+ z-index: 1;
115
+ }
116
+ &.header__cover--glass {
117
+ &::before {
118
+ backdrop-filter: blur( 4px );
119
+ -webkit-backdrop-filter: blur( 4px );
120
+ background: rgba(0,0,0,0.2)!important;
121
+ }
122
+ }
123
+ .user__cover {
124
+ width: 100%;
125
+ height: 100%;
126
+ object-fit: cover;
127
+ }
128
+ &__actions {
129
+ position: absolute;
130
+ top: 0;
131
+ left: 0;
132
+ width: 100%;
133
+ display: flex;
134
+ align-items: center;
135
+ justify-content: space-between;
136
+ padding: 10px 15px;
137
+ z-index: 2;
138
+ .right {
139
+ display: flex;
140
+ align-items: center;
141
+ flex-direction: row;
142
+ button {
143
+ color: #fff;
144
+ border: 0;
145
+ background: transparent;
146
+ width: 32px;
147
+ height: 32px;
148
+ display: flex;
149
+ align-items: center;
150
+ justify-content: center;
151
+ }
152
+ }
153
+ }
154
+ }
155
+ &__content {
156
+ display: flex;
157
+ flex-direction: column;
158
+ align-items: center;
159
+ justify-content: center;
160
+ padding: 0 10px;
161
+ img {
162
+ width: 120px;
163
+ height: 120px;
164
+ border-radius: 100px;
165
+ object-fit: contain;
166
+ margin-top: -20px;
167
+ z-index: 10;
168
+ box-shadow: 0 0 20px rgba(0, 0, 0, 0.1);
169
+ background: #fff;
170
+ border: 4px solid #fff;
171
+ }
172
+ }
173
+ &__footer {
174
+ display: flex;
175
+ align-items: center;
176
+ justify-content: center;
177
+ padding-bottom: 20px;
178
+ span {
179
+ font-size: 0.875rem;
180
+ font-weight: 500;
181
+ margin: 0 10px;
182
+ color: #AEB6BE;
183
+ &.new {
184
+ color: #1F8CEB;
185
+ }
186
+ }
187
+ }
188
+ }
189
+
190
+ </style>
package/components/burh-ds/Cards/FeatureBusinessCard.vue CHANGED
@@ -1,74 +1,74 @@
1
- <template>
2
- <div class="feature__card">
3
- <div class="feature__card__image" :style="`--icon-bg-color: #${iconBgColor}`">
4
- <img :src="icon" :alt="title">
5
- </div>
6
- <div class="feature__card__title">
7
- <p>{{ title }}</p>
8
- </div>
9
- <div class="feature__card__description">
10
- <span>{{ description }}</span>
11
- </div>
12
- </div>
13
- </template>
14
-
15
- <script>
16
- export default {
17
- name: 'FeatureBusinessCard',
18
- props: {
19
- icon: String,
20
- iconBgColor: {
21
- type: String,
22
- default: '5983FE'
23
- },
24
- title: String,
25
- description: String,
26
- }
27
- };
28
- </script>
29
-
30
- <style lang="scss" scoped>
31
- .feature__card {
32
- background: #fff;
33
- padding: 20px;
34
- display: flex;
35
- flex-direction: column;
36
- align-items: flex-start;
37
- box-shadow: 5px 5px 50px 2px #E9EEF2;
38
- border-radius: 10px;
39
- width: 100%;
40
- min-width: 300px;
41
- margin: 0 auto;
42
- transition: transform 0.25s, box-shadow 0.5s;
43
- &__image {
44
- display: flex;
45
- align-items: center;
46
- justify-content: center;
47
- width: 45px;
48
- height: 45px;
49
- border-radius: 10px;
50
- background: var(--icon-bg-color);
51
- img {
52
- display: block;
53
- width: 25px;
54
- }
55
- }
56
- &__title {
57
- padding: 10px 0;
58
- p {
59
- font-size: 1.5625rem;
60
- font-weight: 600;
61
- margin-bottom: 0;
62
- }
63
- }
64
- &__description {
65
- text-align: left;
66
- font-weight: 400;
67
- font-size: 0.875rem;
68
- }
69
- &:hover {
70
- transform: translateY(-10px);
71
- box-shadow: 7px 15px 20px rgba(0, 0, 0, 0.05);
72
- }
73
- }
74
- </style>
1
+ <template>
2
+ <div class="feature__card">
3
+ <div class="feature__card__image" :style="`--icon-bg-color: #${iconBgColor}`">
4
+ <img :src="icon" :alt="title">
5
+ </div>
6
+ <div class="feature__card__title">
7
+ <p>{{ title }}</p>
8
+ </div>
9
+ <div class="feature__card__description">
10
+ <span>{{ description }}</span>
11
+ </div>
12
+ </div>
13
+ </template>
14
+
15
+ <script>
16
+ export default {
17
+ name: 'FeatureBusinessCard',
18
+ props: {
19
+ icon: String,
20
+ iconBgColor: {
21
+ type: String,
22
+ default: '5983FE'
23
+ },
24
+ title: String,
25
+ description: String,
26
+ }
27
+ };
28
+ </script>
29
+
30
+ <style lang="scss" scoped>
31
+ .feature__card {
32
+ background: #fff;
33
+ padding: 20px;
34
+ display: flex;
35
+ flex-direction: column;
36
+ align-items: flex-start;
37
+ box-shadow: 5px 5px 50px 2px #E9EEF2;
38
+ border-radius: 10px;
39
+ width: 100%;
40
+ min-width: 300px;
41
+ margin: 0 auto;
42
+ transition: transform 0.25s, box-shadow 0.5s;
43
+ &__image {
44
+ display: flex;
45
+ align-items: center;
46
+ justify-content: center;
47
+ width: 45px;
48
+ height: 45px;
49
+ border-radius: 10px;
50
+ background: var(--icon-bg-color);
51
+ img {
52
+ display: block;
53
+ width: 25px;
54
+ }
55
+ }
56
+ &__title {
57
+ padding: 10px 0;
58
+ p {
59
+ font-size: 1.5625rem;
60
+ font-weight: 600;
61
+ margin-bottom: 0;
62
+ }
63
+ }
64
+ &__description {
65
+ text-align: left;
66
+ font-weight: 400;
67
+ font-size: 0.875rem;
68
+ }
69
+ &:hover {
70
+ transform: translateY(-10px);
71
+ box-shadow: 7px 15px 20px rgba(0, 0, 0, 0.05);
72
+ }
73
+ }
74
+ </style>