@bulmil/core
Version:

99 lines • 2.55 kB
CSS
/* Bulma Utilities */
.divider {
position: relative;
display: -ms-flexbox;
display: flex;
-ms-flex-align: center;
align-items: center;
text-transform: uppercase;
color: hsl(0, 0%, 48%);
font-size: 0.75rem;
font-weight: 600;
letter-spacing: 0.5px;
margin: 25px 0;
}
.divider::after, .divider::before {
content: "";
display: block;
-ms-flex: 1;
flex: 1;
height: 1px;
background-color: hsl(0, 0%, 86%);
}
.divider:not(.is-right)::after {
margin-left: 10px;
}
.divider:not(.is-left)::before {
margin-right: 10px;
}
.divider.is-left::before {
display: none;
}
.divider.is-right::after {
display: none;
}
.divider.is-vertical {
-ms-flex-direction: column;
flex-direction: column;
margin: 0 25px;
}
.divider.is-vertical::after, .divider.is-vertical::before {
height: auto;
width: 1px;
}
.divider.is-vertical::after {
margin-left: 0;
margin-top: 10px;
}
.divider.is-vertical::before {
margin-right: 0;
margin-bottom: 10px;
}
.divider.is-white::after, .divider.is-white::before {
background-color: hsl(0, 0%, 100%);
}
.divider.is-black::after, .divider.is-black::before {
background-color: hsl(0, 0%, 4%);
}
.divider.is-light::after, .divider.is-light::before {
background-color: hsl(0, 0%, 96%);
}
.divider.is-dark::after, .divider.is-dark::before {
background-color: hsl(0, 0%, 21%);
}
.divider.is-primary::after, .divider.is-primary::before {
background-color: #5851ff;
}
.divider.is-primary.is-light::after, .divider.is-primary.is-light::before {
background-color: #ebebff;
}
.divider.is-link::after, .divider.is-link::before {
background-color: #5851ff;
}
.divider.is-link.is-light::after, .divider.is-link.is-light::before {
background-color: #ebebff;
}
.divider.is-info::after, .divider.is-info::before {
background-color: hsl(207, 61%, 53%);
}
.divider.is-info.is-light::after, .divider.is-info.is-light::before {
background-color: #eff5fb;
}
.divider.is-success::after, .divider.is-success::before {
background-color: hsl(153, 53%, 53%);
}
.divider.is-success.is-light::after, .divider.is-success.is-light::before {
background-color: #effaf5;
}
.divider.is-warning::after, .divider.is-warning::before {
background-color: hsl(44, 100%, 77%);
}
.divider.is-warning.is-light::after, .divider.is-warning.is-light::before {
background-color: #fffaeb;
}
.divider.is-danger::after, .divider.is-danger::before {
background-color: hsl(348, 86%, 61%);
}
.divider.is-danger.is-light::after, .divider.is-danger.is-light::before {
background-color: #feecf0;
}