@burh/nuxt-core 1.0.240 → 1.0.242

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.
@@ -1,196 +1,196 @@
1
- <template>
2
- <nuxt-link :to="`/recrutamento/vaga/${job.id}`" class="recruitment__card">
3
- <article>
4
- <header class="recruitment__card__header">
5
- <div class="recruitment__card__header__status">
6
- <p>SELECT</p>
7
- </div>
8
- <div class="recruitment__card__header__actions">
9
- <el-tooltip placement="top" content="Anotações">
10
- <button
11
- class="action__item"
12
- @click.stop.prevent="$emit('notes-click')"
13
- >
14
- <i class="far fa-comment-alt"></i>
15
- </button>
16
- </el-tooltip>
17
-
18
- <el-tooltip placement="top" content="Compartilhar">
19
- <button
20
- class="action__item"
21
- @click.stop.prevent="$emit('share-click')"
22
- >
23
- <i class="fas fa-share-alt"></i>
24
- </button>
25
- </el-tooltip>
26
- </div>
27
- </header>
28
-
29
- <section class="recruitment__card__content">
30
- <span class="recruitment__card__content__date">Publicada {{fromNow(job.published_at)}}</span>
31
- <h2 class="recruitment__card__content__title">{{ job.title }}</h2>
32
- <span class="recruitment__card__content__id">{{ job.id }}</span>
33
-
34
- <div class="recruitment__card__info">
35
- <p class="recruitment__card__info__text"><span>{{ job.info.applieds }}</span>Inscritos</p>
36
- <p class="recruitment__card__info__text"><span>{{ job.info.positions }}</span>Posição</p>
37
- <p class="recruitment__card__info__text"><span>{{ job.info.hireds }}</span>Contratados</p>
38
- </div>
39
- </section>
40
-
41
- <footer class="recruitment__card__footer">
42
- <p class="recruitment__card__footer__title">EQUIPE RESPONSÁVEL</p>
43
- <div class="recruitment__card__footer__images">
44
- <el-tooltip
45
- v-for="(user, index) in job.team"
46
- :key="index"
47
- placement="top"
48
- :content="user.name"
49
- >
50
- <img
51
- :src="user.image"
52
- :alt="user.name"
53
- >
54
- </el-tooltip>
55
- </div>
56
- </footer>
57
- </article>
58
- </nuxt-link>
59
- </template>
60
-
61
- <script>
62
- import moment from 'moment';
63
- import 'moment/locale/pt-br';
64
-
65
- export default {
66
- name: 'recruitment-card',
67
- props: {
68
- job: {
69
- type: Object,
70
- default: () => []
71
- }
72
- },
73
- methods: {
74
- fromNow(date, format = 'YYYYMMDD') {
75
- return moment(date, format).fromNow();
76
- }
77
- }
78
- };
79
- </script>
80
-
81
- <style lang="scss" scoped>
82
- .recruitment__card {
83
- cursor: pointer;
84
- background: #fff;
85
- box-shadow: 0 3px 20px rgba(0, 0, 0, 0.08);
86
- padding: 20px;
87
- border-radius: 4px;
88
- border: none;
89
- text-align: initial;
90
- color: #1D364B;
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
- display: flex;
102
- align-items: center;
103
- justify-content: space-between;
104
- padding: 5px 0;
105
- &__actions {
106
- display: flex;
107
- align-items: center;
108
- .action__item {
109
- cursor: pointer;
110
- width: 42px;
111
- height: 42px;
112
- border-radius: 100px;
113
- transition: background 0.5s;
114
- display: flex;
115
- align-items: center;
116
- justify-content: center;
117
- background: transparent;
118
- border: 0;
119
- position: relative;
120
- &:hover {
121
- background: rgba(0, 0, 0, 0.08);
122
- }
123
- &:focus {
124
- outline: none;
125
- background: rgba(0, 0, 0, 0.08);
126
- }
127
- &:not(:first-child) {
128
- margin-left: 5px;
129
- }
130
- i {
131
- color: #AEB6BE;
132
- }
133
- }
134
- }
135
- }
136
-
137
- &__content {
138
- &__date {
139
- font-size: 0.875rem;
140
- font-weight: 400;
141
- color: #AEB6BE;
142
- }
143
- &__title {
144
- font-size: 1.275rem;
145
- color: #1D364B;
146
- margin-bottom: 0;
147
- }
148
- &__id {
149
- font-size: 0.875rem;
150
- font-weight: 600;
151
- color: #525F7F;
152
- }
153
- }
154
-
155
- &__info {
156
- padding: 20px 0;
157
- &__text {
158
- margin-bottom: 0;
159
- font-size: 1rem;
160
- font-weight: 500;
161
- span {
162
- margin-right: 5px;
163
- color: #1F8CEB;
164
- }
165
- }
166
- }
167
-
168
- &__footer {
169
- border-top: 1px solid #E9E9E9;
170
- padding-top: 10px;
171
- &__title {
172
- color: #525F7F;
173
- font-size: 0.875rem;
174
- font-weight: 600;
175
- margin-bottom: 0;
176
- }
177
- &__images {
178
- display: flex;
179
- align-items: center;
180
- user-select: none;
181
- img {
182
- $size: 32px;
183
- display: block;
184
- width: $size;
185
- height: $size;
186
- object-fit: cover;
187
- border-radius: 100px;
188
- border: 2px solid #fff;
189
- &:not(:first-child) {
190
- margin-left: -10px;
191
- }
192
- }
193
- }
194
- }
195
- }
196
- </style>
1
+ <template>
2
+ <nuxt-link :to="`/recrutamento/vaga/${job.id}`" class="recruitment__card">
3
+ <article>
4
+ <header class="recruitment__card__header">
5
+ <div class="recruitment__card__header__status">
6
+ <p>SELECT</p>
7
+ </div>
8
+ <div class="recruitment__card__header__actions">
9
+ <el-tooltip placement="top" content="Anotações">
10
+ <button
11
+ class="action__item"
12
+ @click.stop.prevent="$emit('notes-click')"
13
+ >
14
+ <i class="far fa-comment-alt"></i>
15
+ </button>
16
+ </el-tooltip>
17
+
18
+ <el-tooltip placement="top" content="Compartilhar">
19
+ <button
20
+ class="action__item"
21
+ @click.stop.prevent="$emit('share-click')"
22
+ >
23
+ <i class="fas fa-share-alt"></i>
24
+ </button>
25
+ </el-tooltip>
26
+ </div>
27
+ </header>
28
+
29
+ <section class="recruitment__card__content">
30
+ <span class="recruitment__card__content__date">Publicada {{fromNow(job.published_at)}}</span>
31
+ <h2 class="recruitment__card__content__title">{{ job.title }}</h2>
32
+ <span class="recruitment__card__content__id">{{ job.id }}</span>
33
+
34
+ <div class="recruitment__card__info">
35
+ <p class="recruitment__card__info__text"><span>{{ job.info.applieds }}</span>Inscritos</p>
36
+ <p class="recruitment__card__info__text"><span>{{ job.info.positions }}</span>Posição</p>
37
+ <p class="recruitment__card__info__text"><span>{{ job.info.hireds }}</span>Contratados</p>
38
+ </div>
39
+ </section>
40
+
41
+ <footer class="recruitment__card__footer">
42
+ <p class="recruitment__card__footer__title">EQUIPE RESPONSÁVEL</p>
43
+ <div class="recruitment__card__footer__images">
44
+ <el-tooltip
45
+ v-for="(user, index) in job.team"
46
+ :key="index"
47
+ placement="top"
48
+ :content="user.name"
49
+ >
50
+ <img
51
+ :src="user.image"
52
+ :alt="user.name"
53
+ >
54
+ </el-tooltip>
55
+ </div>
56
+ </footer>
57
+ </article>
58
+ </nuxt-link>
59
+ </template>
60
+
61
+ <script>
62
+ import moment from 'moment';
63
+ import 'moment/locale/pt-br';
64
+
65
+ export default {
66
+ name: 'recruitment-card',
67
+ props: {
68
+ job: {
69
+ type: Object,
70
+ default: () => []
71
+ }
72
+ },
73
+ methods: {
74
+ fromNow(date, format = 'YYYYMMDD') {
75
+ return moment(date, format).fromNow();
76
+ }
77
+ }
78
+ };
79
+ </script>
80
+
81
+ <style lang="scss" scoped>
82
+ .recruitment__card {
83
+ cursor: pointer;
84
+ background: #fff;
85
+ box-shadow: 0 3px 20px rgba(0, 0, 0, 0.08);
86
+ padding: 20px;
87
+ border-radius: 4px;
88
+ border: none;
89
+ text-align: initial;
90
+ color: #1D364B;
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
+ display: flex;
102
+ align-items: center;
103
+ justify-content: space-between;
104
+ padding: 5px 0;
105
+ &__actions {
106
+ display: flex;
107
+ align-items: center;
108
+ .action__item {
109
+ cursor: pointer;
110
+ width: 42px;
111
+ height: 42px;
112
+ border-radius: 100px;
113
+ transition: background 0.5s;
114
+ display: flex;
115
+ align-items: center;
116
+ justify-content: center;
117
+ background: transparent;
118
+ border: 0;
119
+ position: relative;
120
+ &:hover {
121
+ background: rgba(0, 0, 0, 0.08);
122
+ }
123
+ &:focus {
124
+ outline: none;
125
+ background: rgba(0, 0, 0, 0.08);
126
+ }
127
+ &:not(:first-child) {
128
+ margin-left: 5px;
129
+ }
130
+ i {
131
+ color: #AEB6BE;
132
+ }
133
+ }
134
+ }
135
+ }
136
+
137
+ &__content {
138
+ &__date {
139
+ font-size: 0.875rem;
140
+ font-weight: 400;
141
+ color: #AEB6BE;
142
+ }
143
+ &__title {
144
+ font-size: 1.275rem;
145
+ color: #1D364B;
146
+ margin-bottom: 0;
147
+ }
148
+ &__id {
149
+ font-size: 0.875rem;
150
+ font-weight: 600;
151
+ color: #525F7F;
152
+ }
153
+ }
154
+
155
+ &__info {
156
+ padding: 20px 0;
157
+ &__text {
158
+ margin-bottom: 0;
159
+ font-size: 1rem;
160
+ font-weight: 500;
161
+ span {
162
+ margin-right: 5px;
163
+ color: #1F8CEB;
164
+ }
165
+ }
166
+ }
167
+
168
+ &__footer {
169
+ border-top: 1px solid #E9E9E9;
170
+ padding-top: 10px;
171
+ &__title {
172
+ color: #525F7F;
173
+ font-size: 0.875rem;
174
+ font-weight: 600;
175
+ margin-bottom: 0;
176
+ }
177
+ &__images {
178
+ display: flex;
179
+ align-items: center;
180
+ user-select: none;
181
+ img {
182
+ $size: 32px;
183
+ display: block;
184
+ width: $size;
185
+ height: $size;
186
+ object-fit: cover;
187
+ border-radius: 100px;
188
+ border: 2px solid #fff;
189
+ &:not(:first-child) {
190
+ margin-left: -10px;
191
+ }
192
+ }
193
+ }
194
+ }
195
+ }
196
+ </style>