hugo-theme-zzo/assets/sass/components/_notice.scss

73 lines
1.3 KiB
SCSS
Raw Normal View History

2019-11-04 13:09:44 +00:00
div.notices {
margin: 2rem 0;
position: relative;
border-radius: .2rem;
color: #fff;
padding: .5rem 1rem .5rem 2rem;
position: relative
}
div.notices p {
padding: 0px;
display: block;
font-size: 1rem;
margin-top: 0rem;
margin-bottom: 0rem;
}
div.notices p:first-child:before {
position: absolute;
top: -27px;
color: #fff;
font-family: FontAwesome;
content: '💡';
left: 10px;
}
div.notices p:first-child:after {
position: absolute;
top: -27px;
color: #fff;
left: 2rem;
}
div.notices.info p:first-child:after {
content: 'Info';
}
div.notices.warning p:first-child:after {
content: 'Warning';
}
div.notices.note p:first-child:after {
content: 'Note';
}
div.notices.tip p:first-child:after {
content: 'Tip';
}
div.notices.note {
border-top: 30px solid #6bb1e0;
background: #e6f3fb;
color: rgba(47, 103, 141, 0.995) !important;
}
div.notices.info {
border-top: 30px solid #f1b37e;
background: #fefaf5;
color: rgba(150, 90, 38, 0.995) !important;
}
div.notices.tip {
border-top: 30px solid #84c578;
background: #e8f7e6;
color: rgba(72, 125, 63, 0.995) !important;
}
div.notices.warning {
border-top: 30px solid #d58181;
background: #fbeded;
color: rgba(132, 56, 56, 0.995) !important;
}