Skip to content

Commit 9d3614e

Browse files
committed
refactor: update utility classes to v4
1 parent 9e0b34d commit 9d3614e

File tree

6 files changed

+71
-71
lines changed

6 files changed

+71
-71
lines changed

pug/404.pug

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -5,7 +5,7 @@ block view
55
.row.justify-content-center
66
.col-md-6
77
.clearfix
8-
h1.float-start.display-3.mr-4 404
8+
h1.float-start.display-3.me-4 404
99
h4.pt-3 Oops! You're lost.
1010
p.text-muted The page you are looking for was not found.
1111
.input-prepend.input-group

pug/500.pug

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -5,7 +5,7 @@ block view
55
.row.justify-content-center
66
.col-md-6
77
.clearfix
8-
h1.float-start.display-3.mr-4 500
8+
h1.float-start.display-3.me-4 500
99
h4.pt-3 Houston, we have a problem!
1010
p.text-muted The page you are looking for is temporarily unavailable.
1111
.input-prepend.input-group

pug/_partials/header.pug

Lines changed: 11 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -13,7 +13,7 @@ header.header.header-sticky.mb-4
1313
a.nav-link(href="#") Users
1414
li.nav-item
1515
a.nav-link(href="#") Settings
16-
ul.header-nav.ms-auto.mr-4
16+
ul.header-nav.ms-auto.me-4
1717
li.nav-item.d-md-down-none
1818
a.nav-link(href="#")
1919
svg.icon
@@ -34,52 +34,52 @@ header.header.header-sticky.mb-4
3434
.dropdown-header.bg-light.py-2
3535
.fw-semibold Account
3636
a.dropdown-item(href="#")
37-
svg.icon.mr-2
37+
svg.icon.me-2
3838
use(xlink:href="node_modules/@coreui/icons/sprites/free.svg#cil-bell")
3939
| Updates
4040
span.badge.bg-info.ms-auto 42
4141
a.dropdown-item(href="#")
42-
svg.icon.mr-2
42+
svg.icon.me-2
4343
use(xlink:href="node_modules/@coreui/icons/sprites/free.svg#cil-envelope-open")
4444
| Messages
4545
span.badge.bg-success.ms-auto 42
4646
a.dropdown-item(href="#")
47-
svg.icon.mr-2
47+
svg.icon.me-2
4848
use(xlink:href="node_modules/@coreui/icons/sprites/free.svg#cil-task")
4949
| Tasks
5050
span.badge.bg-danger.ms-auto 42
5151
a.dropdown-item(href="#")
52-
svg.icon.mr-2
52+
svg.icon.me-2
5353
use(xlink:href="node_modules/@coreui/icons/sprites/free.svg#cil-comment-square")
5454
| Comments
5555
span.badge.bg-warning.ms-auto 42
5656
.dropdown-header.bg-light.py-2
5757
.fw-semibold Settings
5858
a.dropdown-item(href="#")
59-
svg.icon.mr-2
59+
svg.icon.me-2
6060
use(xlink:href="node_modules/@coreui/icons/sprites/free.svg#cil-user")
6161
| Profile
6262
a.dropdown-item(href="#")
63-
svg.icon.mr-2
63+
svg.icon.me-2
6464
use(xlink:href="node_modules/@coreui/icons/sprites/free.svg#cil-settings")
6565
| Settings
6666
a.dropdown-item(href="#")
67-
svg.icon.mr-2
67+
svg.icon.me-2
6868
use(xlink:href="node_modules/@coreui/icons/sprites/free.svg#cil-credit-card")
6969
| Payments
7070
span.badge.bg-secondary.ms-auto 42
7171
a.dropdown-item(href="#")
72-
svg.icon.mr-2
72+
svg.icon.me-2
7373
use(xlink:href="node_modules/@coreui/icons/sprites/free.svg#cil-file")
7474
| Projects
7575
span.badge.bg-primary.ms-auto 42
7676
.dropdown-divider
7777
a.dropdown-item(href="#")
78-
svg.icon.mr-2
78+
svg.icon.me-2
7979
use(xlink:href="node_modules/@coreui/icons/sprites/free.svg#cil-lock-locked")
8080
| Lock Account
8181
a.dropdown-item(href="#")
82-
svg.icon.mr-2
82+
svg.icon.me-2
8383
use(xlink:href="node_modules/@coreui/icons/sprites/free.svg#cil-account-logout")
8484
| Logout
8585
.header-divider

pug/buttons/brand-buttons.pug

Lines changed: 51 additions & 51 deletions
Original file line numberDiff line numberDiff line change
@@ -20,141 +20,141 @@ block view
2020
code .btn-sm
2121
p
2222
button.btn.btn-sm.btn-facebook(type='button')
23-
svg.icon.mr-2
23+
svg.icon.me-2
2424
use(xlink:href="node_modules/@coreui/icons/sprites/brand.svg#cib-facebook-f")
2525
span Facebook
2626
button.btn.btn-sm.btn-twitter(type='button')
27-
svg.icon.mr-2
27+
svg.icon.me-2
2828
use(xlink:href="node_modules/@coreui/icons/sprites/brand.svg#cib-twitter")
2929
span Twitter
3030
button.btn.btn-sm.btn-linkedin(type='button')
31-
svg.icon.mr-2
31+
svg.icon.me-2
3232
use(xlink:href="node_modules/@coreui/icons/sprites/brand.svg#cib-linkedin")
3333
span LinkedIn
3434
button.btn.btn-sm.btn-flickr(type='button')
35-
svg.icon.mr-2
35+
svg.icon.me-2
3636
use(xlink:href="node_modules/@coreui/icons/sprites/brand.svg#cib-flickr")
3737
span Flickr
3838
button.btn.btn-sm.btn-tumblr(type='button')
39-
svg.icon.mr-2
39+
svg.icon.me-2
4040
use(xlink:href="node_modules/@coreui/icons/sprites/brand.svg#cib-tumblr")
4141
span Tumblr
4242
button.btn.btn-sm.btn-xing(type='button')
43-
svg.icon.mr-2
43+
svg.icon.me-2
4444
use(xlink:href="node_modules/@coreui/icons/sprites/brand.svg#cib-xing")
4545
span Xing
4646
button.btn.btn-sm.btn-github(type='button')
47-
svg.icon.mr-2
47+
svg.icon.me-2
4848
use(xlink:href="node_modules/@coreui/icons/sprites/brand.svg#cib-github")
4949
span Github
5050
button.btn.btn-sm.btn-stack-overflow(type='button')
51-
svg.icon.mr-2
51+
svg.icon.me-2
5252
use(xlink:href="node_modules/@coreui/icons/sprites/brand.svg#cib-stack-overflow")
5353
span StackOverflow
5454
button.btn.btn-sm.btn-youtube(type='button')
55-
svg.icon.mr-2
55+
svg.icon.me-2
5656
use(xlink:href="node_modules/@coreui/icons/sprites/brand.svg#cib-youtube")
5757
span YouTube
5858
button.btn.btn-sm.btn-dribbble(type='button')
59-
svg.icon.mr-2
59+
svg.icon.me-2
6060
use(xlink:href="node_modules/@coreui/icons/sprites/brand.svg#cib-dribbble")
6161
span Dribbble
6262
button.btn.btn-sm.btn-instagram(type='button')
63-
svg.icon.mr-2
63+
svg.icon.me-2
6464
use(xlink:href="node_modules/@coreui/icons/sprites/brand.svg#cib-instagram")
6565
span Instagram
6666
button.btn.btn-sm.btn-pinterest(type='button')
67-
svg.icon.mr-2
67+
svg.icon.me-2
6868
use(xlink:href="node_modules/@coreui/icons/sprites/brand.svg#cib-pinterest")
6969
span Pinterest
7070
button.btn.btn-sm.btn-vk(type='button')
71-
svg.icon.mr-2
71+
svg.icon.me-2
7272
use(xlink:href="node_modules/@coreui/icons/sprites/brand.svg#cib-vk")
7373
span VK
7474
button.btn.btn-sm.btn-yahoo(type='button')
75-
svg.icon.mr-2
75+
svg.icon.me-2
7676
use(xlink:href="node_modules/@coreui/icons/sprites/brand.svg#cib-yahoo")
7777
span Yahoo
7878
button.btn.btn-sm.btn-behance(type='button')
79-
svg.icon.mr-2
79+
svg.icon.me-2
8080
use(xlink:href="node_modules/@coreui/icons/sprites/brand.svg#cib-behance")
8181
span Behance
8282
button.btn.btn-sm.btn-reddit(type='button')
83-
svg.icon.mr-2
83+
svg.icon.me-2
8484
use(xlink:href="node_modules/@coreui/icons/sprites/brand.svg#cib-reddit")
8585
span Reddit
8686
button.btn.btn-sm.btn-vimeo(type='button')
87-
svg.icon.mr-2
87+
svg.icon.me-2
8888
use(xlink:href="node_modules/@coreui/icons/sprites/brand.svg#cib-vimeo")
8989
span Vimeo
9090
h6 Size Normal
9191
p
9292
button.btn.btn-facebook(type='button')
93-
svg.icon.mr-2
93+
svg.icon.me-2
9494
use(xlink:href="node_modules/@coreui/icons/sprites/brand.svg#cib-facebook-f")
9595
span Facebook
9696
button.btn.btn-twitter(type='button')
97-
svg.icon.mr-2
97+
svg.icon.me-2
9898
use(xlink:href="node_modules/@coreui/icons/sprites/brand.svg#cib-twitter")
9999
span Twitter
100100
button.btn.btn-linkedin(type='button')
101-
svg.icon.mr-2
101+
svg.icon.me-2
102102
use(xlink:href="node_modules/@coreui/icons/sprites/brand.svg#cib-linkedin")
103103
span LinkedIn
104104
button.btn.btn-flickr(type='button')
105-
svg.icon.mr-2
105+
svg.icon.me-2
106106
use(xlink:href="node_modules/@coreui/icons/sprites/brand.svg#cib-flickr")
107107
span Flickr
108108
button.btn.btn-tumblr(type='button')
109-
svg.icon.mr-2
109+
svg.icon.me-2
110110
use(xlink:href="node_modules/@coreui/icons/sprites/brand.svg#cib-tumblr")
111111
span Tumblr
112112
button.btn.btn-xing(type='button')
113-
svg.icon.mr-2
113+
svg.icon.me-2
114114
use(xlink:href="node_modules/@coreui/icons/sprites/brand.svg#cib-xing")
115115
span Xing
116116
button.btn.btn-github(type='button')
117-
svg.icon.mr-2
117+
svg.icon.me-2
118118
use(xlink:href="node_modules/@coreui/icons/sprites/brand.svg#cib-github")
119119
span Github
120120
button.btn.btn-stack-overflow(type='button')
121-
svg.icon.mr-2
121+
svg.icon.me-2
122122
use(xlink:href="node_modules/@coreui/icons/sprites/brand.svg#cib-stack-overflow")
123123
span StackOverflow
124124
button.btn.btn-youtube(type='button')
125-
svg.icon.mr-2
125+
svg.icon.me-2
126126
use(xlink:href="node_modules/@coreui/icons/sprites/brand.svg#cib-youtube")
127127
span YouTube
128128
button.btn.btn-dribbble(type='button')
129-
svg.icon.mr-2
129+
svg.icon.me-2
130130
use(xlink:href="node_modules/@coreui/icons/sprites/brand.svg#cib-dribbble")
131131
span Dribbble
132132
button.btn.btn-instagram(type='button')
133-
svg.icon.mr-2
133+
svg.icon.me-2
134134
use(xlink:href="node_modules/@coreui/icons/sprites/brand.svg#cib-instagram")
135135
span Instagram
136136
button.btn.btn-pinterest(type='button')
137-
svg.icon.mr-2
137+
svg.icon.me-2
138138
use(xlink:href="node_modules/@coreui/icons/sprites/brand.svg#cib-pinterest")
139139
span Pinterest
140140
button.btn.btn-vk(type='button')
141-
svg.icon.mr-2
141+
svg.icon.me-2
142142
use(xlink:href="node_modules/@coreui/icons/sprites/brand.svg#cib-vk")
143143
span VK
144144
button.btn.btn-yahoo(type='button')
145-
svg.icon.mr-2
145+
svg.icon.me-2
146146
use(xlink:href="node_modules/@coreui/icons/sprites/brand.svg#cib-yahoo")
147147
span Yahoo
148148
button.btn.btn-behance(type='button')
149-
svg.icon.mr-2
149+
svg.icon.me-2
150150
use(xlink:href="node_modules/@coreui/icons/sprites/brand.svg#cib-behance")
151151
span Behance
152152
button.btn.btn-reddit(type='button')
153-
svg.icon.mr-2
153+
svg.icon.me-2
154154
use(xlink:href="node_modules/@coreui/icons/sprites/brand.svg#cib-reddit")
155155
span Reddit
156156
button.btn.btn-vimeo(type='button')
157-
svg.icon.mr-2
157+
svg.icon.me-2
158158
use(xlink:href="node_modules/@coreui/icons/sprites/brand.svg#cib-vimeo")
159159
span Vimeo
160160
h6
@@ -164,71 +164,71 @@ block view
164164
code .btn-lg
165165
p
166166
button.btn.btn-lg.btn-facebook(type='button')
167-
svg.icon.mr-2
167+
svg.icon.me-2
168168
use(xlink:href="node_modules/@coreui/icons/sprites/brand.svg#cib-facebook-f")
169169
span Facebook
170170
button.btn.btn-lg.btn-twitter(type='button')
171-
svg.icon.mr-2
171+
svg.icon.me-2
172172
use(xlink:href="node_modules/@coreui/icons/sprites/brand.svg#cib-twitter")
173173
span Twitter
174174
button.btn.btn-lg.btn-linkedin(type='button')
175-
svg.icon.mr-2
175+
svg.icon.me-2
176176
use(xlink:href="node_modules/@coreui/icons/sprites/brand.svg#cib-linkedin")
177177
span LinkedIn
178178
button.btn.btn-lg.btn-flickr(type='button')
179-
svg.icon.mr-2
179+
svg.icon.me-2
180180
use(xlink:href="node_modules/@coreui/icons/sprites/brand.svg#cib-flickr")
181181
span Flickr
182182
button.btn.btn-lg.btn-tumblr(type='button')
183-
svg.icon.mr-2
183+
svg.icon.me-2
184184
use(xlink:href="node_modules/@coreui/icons/sprites/brand.svg#cib-tumblr")
185185
span Tumblr
186186
button.btn.btn-lg.btn-xing(type='button')
187-
svg.icon.mr-2
187+
svg.icon.me-2
188188
use(xlink:href="node_modules/@coreui/icons/sprites/brand.svg#cib-xing")
189189
span Xing
190190
button.btn.btn-lg.btn-github(type='button')
191-
svg.icon.mr-2
191+
svg.icon.me-2
192192
use(xlink:href="node_modules/@coreui/icons/sprites/brand.svg#cib-github")
193193
span Github
194194
button.btn.btn-lg.btn-stack-overflow(type='button')
195-
svg.icon.mr-2
195+
svg.icon.me-2
196196
use(xlink:href="node_modules/@coreui/icons/sprites/brand.svg#cib-stack-overflow")
197197
span StackOverflow
198198
button.btn.btn-lg.btn-youtube(type='button')
199-
svg.icon.mr-2
199+
svg.icon.me-2
200200
use(xlink:href="node_modules/@coreui/icons/sprites/brand.svg#cib-youtube")
201201
span YouTube
202202
button.btn.btn-lg.btn-dribbble(type='button')
203-
svg.icon.mr-2
203+
svg.icon.me-2
204204
use(xlink:href="node_modules/@coreui/icons/sprites/brand.svg#cib-dribbble")
205205
span Dribbble
206206
button.btn.btn-lg.btn-instagram(type='button')
207-
svg.icon.mr-2
207+
svg.icon.me-2
208208
use(xlink:href="node_modules/@coreui/icons/sprites/brand.svg#cib-instagram")
209209
span Instagram
210210
button.btn.btn-lg.btn-pinterest(type='button')
211-
svg.icon.mr-2
211+
svg.icon.me-2
212212
use(xlink:href="node_modules/@coreui/icons/sprites/brand.svg#cib-pinterest")
213213
span Pinterest
214214
button.btn.btn-lg.btn-vk(type='button')
215-
svg.icon.mr-2
215+
svg.icon.me-2
216216
use(xlink:href="node_modules/@coreui/icons/sprites/brand.svg#cib-vk")
217217
span VK
218218
button.btn.btn-lg.btn-yahoo(type='button')
219-
svg.icon.mr-2
219+
svg.icon.me-2
220220
use(xlink:href="node_modules/@coreui/icons/sprites/brand.svg#cib-yahoo")
221221
span Yahoo
222222
button.btn.btn-lg.btn-behance(type='button')
223-
svg.icon.mr-2
223+
svg.icon.me-2
224224
use(xlink:href="node_modules/@coreui/icons/sprites/brand.svg#cib-behance")
225225
span Behance
226226
button.btn.btn-lg.btn-reddit(type='button')
227-
svg.icon.mr-2
227+
svg.icon.me-2
228228
use(xlink:href="node_modules/@coreui/icons/sprites/brand.svg#cib-reddit")
229229
span Reddit
230230
button.btn.btn-lg.btn-vimeo(type='button')
231-
svg.icon.mr-2
231+
svg.icon.me-2
232232
use(xlink:href="node_modules/@coreui/icons/sprites/brand.svg#cib-vimeo")
233233
span Vimeo
234234
// /.col

pug/buttons/button-group.pug

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -20,19 +20,19 @@ block view
2020
small toolbar
2121
.card-body
2222
.btn-toolbar.mb-3(role='toolbar', aria-label='Toolbar with button groups')
23-
.btn-group.mr-2(role='group', aria-label='First group')
23+
.btn-group.me-2(role='group', aria-label='First group')
2424
button.btn.btn-secondary(type='button') 1
2525
button.btn.btn-secondary(type='button') 2
2626
button.btn.btn-secondary(type='button') 3
2727
button.btn.btn-secondary(type='button') 4
28-
.btn-group.mr-2(role='group', aria-label='Second group')
28+
.btn-group.me-2(role='group', aria-label='Second group')
2929
button.btn.btn-secondary(type='button') 5
3030
button.btn.btn-secondary(type='button') 6
3131
button.btn.btn-secondary(type='button') 7
3232
.btn-group(role='group', aria-label='Third group')
3333
button.btn.btn-secondary(type='button') 8
3434
.btn-toolbar.mb-3(role='toolbar', aria-label='Toolbar with button groups')
35-
.btn-group.mr-2(role='group', aria-label='First group')
35+
.btn-group.me-2(role='group', aria-label='First group')
3636
button.btn.btn-secondary(type='button') 1
3737
button.btn.btn-secondary(type='button') 2
3838
button.btn.btn-secondary(type='button') 3

0 commit comments

Comments
 (0)