70 lines
1.5 KiB
SCSS
70 lines
1.5 KiB
SCSS
.notices {
|
|
margin: 2rem 0;
|
|
position: relative;
|
|
border-radius: .125rem;
|
|
color: #fff;
|
|
padding: .3rem 0.5rem .3rem 2rem;
|
|
font-size: 0.9rem;
|
|
|
|
&:first-child {
|
|
&::before {
|
|
position: absolute;
|
|
top: -28.5px;
|
|
color: #fff;
|
|
content: '💡';
|
|
left: 10px;
|
|
}
|
|
|
|
&::after {
|
|
position: absolute;
|
|
top: -28.5px;
|
|
color: #fff;
|
|
left: 2rem;
|
|
}
|
|
}
|
|
|
|
&.info {
|
|
border-top: 30px solid #f1b37e;
|
|
background: #fefaf5;
|
|
color: rgba(150, 90, 38, 0.995) !important;
|
|
|
|
&:first-child::after {
|
|
content: 'Info';
|
|
font-family: $title-font;
|
|
}
|
|
}
|
|
|
|
&.warning {
|
|
border-top: 30px solid #d58181;
|
|
background: #fbeded;
|
|
color: rgba(132, 56, 56, 0.995) !important;
|
|
|
|
&:first-child::after {
|
|
content: 'Warning';
|
|
font-family: $title-font;
|
|
}
|
|
}
|
|
|
|
&.note {
|
|
border-top: 30px solid #6bb1e0;
|
|
background: #e6f3fb;
|
|
color: rgba(47, 103, 141, 0.995) !important;
|
|
|
|
&:first-child::after {
|
|
content: 'Note';
|
|
font-family: $title-font;
|
|
}
|
|
}
|
|
|
|
&.tip {
|
|
border-top: 30px solid #84c578;
|
|
background: #e8f7e6;
|
|
color: rgba(72, 125, 63, 0.995) !important;
|
|
|
|
&:first-child::after {
|
|
content: 'Tip';
|
|
font-family: $title-font;
|
|
}
|
|
}
|
|
}
|