ItsDrike/itsdrike.com
1
0
Fork 0
mirror of https://github.com/ItsDrike/itsdrike.com.git synced 2025-11-04 12:16:37 +00:00
Code Issues Projects Releases Packages Wiki Activity

Use custom notice style in favor of hugo-notice

Browse source
This commit is contained in:
ItsDrike 2022-07-24 01:47:43 +02:00
parent 6c2a21f37b
commit eb0b427a79
No known key found for this signature in database
GPG key ID: B014E761034AF742
6 changed files with 115 additions and 6 deletions
Download patch file Download diff file Expand all files Collapse all files

69
static/src/scss/_notice.scss Normal file
View file

@ -0,0 +1,69 @@
$notice-root: #FFF;
$notice-root-bg: #E7F2FA;
$notice-title: #FFF;
$notice-title-bg: #6AB0DE;
$notice-warning-title: rgba(130, 49, 47, 0.9);
$notice-warning: #341312;
$notice-info-title: #906B4B;
$notice-info: #392A1E;
$notice-note-title: #3F6985;
$notice-note: #192A35;
$notice-tip-title: rgba(46, 92, 46, 0.8);
$notice-tip: #122412;
.notice {
padding: 18px;
line-height: 24px;
margin-bottom: 24px;
border-radius: 4px;
color: $notice-root;
background: $notice-root-bg;
p:last-child {
margin-bottom: 0;
}
}
.notice.warning {
background: $notice-warning;
.notice-title {background: $notice-warning-title;}
}
.notice.info {
background: $notice-info;
.notice-title {background: $notice-info-title;}
}
.notice.note {
background: $notice-note;
.notice-title {background: $notice-note-title;}
}
.notice.tip {
background: $notice-tip;
.notice-title{background: $notice-tip-title;}
}
.notice-title{
margin: -18px -18px 12px;
padding: 4px 18px;
border-radius: 4px 4px 0 0;
font-weight: 700;
color: $notice-title;
background: $notice-title-bg;
}
.icon-notice{
display: inline-flex;
align-self: center;
margin-right: 8px;
img, svg {
height: 1em;
width: 1em;
fill: currentColor;
}
}
.icon-notice img, .icon-notice.baseline svg{
top: 0.125em;
position: relative;
}

1
static/src/scss/style.scss
View file

@ -11,3 +11,4 @@
@import "anchors";
@import "code";
@import "code_copy";
@import "notice";