mirror of
https://github.com/gohugoio/hugoDocs.git
synced 2025-09-19 13:44:48 -04:00
Remove heading from admonitions replacing icon with SVG
This commit is contained in:
Ryan Watters
parent
2af9243efa
commit
5ed3660b1d
@ -82,7 +82,7 @@ The following is a list of site-level variables (aka "global"). Many of these va
|
||||
: a string to override the default [permalink](/content-management/urls/) format as defined in the site configuration.
|
||||
|
||||
`.Site.RegularPages`
|
||||
: a shortcut to the *regular* page collection. `.Site.RegularPages` is equivalents to `where .Site.Pages "Kind" "page"`.
|
||||
: a shortcut to the *regular* page collection. `.Site.RegularPages` is equivalent to `where .Site.Pages "Kind" "page"`.
|
||||
|
||||
`.Site.RSSLink`
|
||||
: the URL for the site RSS.
|
||||
|
||||
BIN
dev-and-design-resources/note.afdesign
Normal file
BIN
dev-and-design-resources/note.afdesign
Normal file
Binary file not shown.
@ -1,4 +1,7 @@
|
||||
<div class="note">
|
||||
<div class="admonition note">
|
||||
<div class="note-icon">
|
||||
{{partial "svg-icons/exclamation.svg" .}}
|
||||
</div>
|
||||
<h2 id="{{if .Get 0}}{{.Get 0 | urlize}}{{else}}note{{end}}">{{if .Get 0}}{{.Get 0 | markdownify}}{{else}}Note{{end}}</h2>
|
||||
<div class="shortcode-content">{{- .Inner -}}</div>
|
||||
<div class="admonition-content">{{- .Inner -}}</div>
|
||||
</div>
|
||||
@ -1,4 +1,7 @@
|
||||
<div class="warning">
|
||||
<h2>{{if .Get 0}}{{.Get 0 | markdownify}}{{else}}Warning{{end}}</h2>
|
||||
<div class="shortcode-content">{{- .Inner -}}</div>
|
||||
<div class="admonition warning">
|
||||
<div class="admonition-icon">
|
||||
{{partial "svg-icons/exclamation.svg" .}}
|
||||
</div>
|
||||
<h2 id="{{if .Get 0}}{{.Get 0 | urlize}}{{else}}warning{{end}}">{{if .Get 0}}{{.Get 0 | markdownify}}{{else}}Warning{{end}}</h2>
|
||||
<div class="admonition-content">{{- .Inner -}}</div>
|
||||
</div>
|
||||
2
static/css/style.min.css
vendored
2
static/css/style.min.css
vendored
File diff suppressed because one or more lines are too long
@ -0,0 +1,6 @@
|
||||
<svg id="exclamation-icon" width="100%" height="100%" viewBox="0 0 24 24" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xml:space="preserve" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:1.41421;">
|
||||
<path d="M0,0L24,0L24,24L0,24L0,0Z" style="fill:none;"/>
|
||||
<g transform="matrix(1.2,0,0,1.2,-2.4,-2.4)">
|
||||
<path d="M12,2C6.48,2 2,6.48 2,12C2,17.52 6.48,22 12,22C17.52,22 22,17.52 22,12C22,6.48 17.52,2 12,2ZM13,17L11,17L11,15L13,15L13,17ZM13,13L11,13L11,7L13,7L13,13Z" style="fill-rule:nonzero;"/>
|
||||
</g>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 608 B |
@ -1,50 +1,56 @@
|
||||
.admonition {
|
||||
padding: 1em;
|
||||
}
|
||||
|
||||
.note,
|
||||
.warning {
|
||||
display: block;
|
||||
margin-bottom: 20px;
|
||||
width: 100%;
|
||||
border-left-width: 2px;
|
||||
border-left-width: 4px;
|
||||
border-left-style: solid;
|
||||
border-left-color: lighten($base-font-color, 20%);
|
||||
position: relative;
|
||||
padding-top: 4px;
|
||||
padding-bottom: 4px;
|
||||
&:before {
|
||||
font-family: 'fontello';
|
||||
display: block;
|
||||
#exclamation-icon {
|
||||
@include size(20px);
|
||||
fill: $hugo-blue;
|
||||
position: absolute;
|
||||
top: 40%;
|
||||
left: -.5em;
|
||||
z-index: 10;
|
||||
background-color: $body-bg-color;
|
||||
border-radius:30%;
|
||||
top: 20%;
|
||||
left: -12px;
|
||||
background-color: white;
|
||||
}
|
||||
h2 {
|
||||
font-size: 1.1em;
|
||||
color: lighten($base-font-color, 20%);
|
||||
width: 100%;
|
||||
display: block;
|
||||
margin: 0px;
|
||||
padding: 0px;
|
||||
margin-left: 0px;
|
||||
padding: 0px 12px;
|
||||
border: none;
|
||||
outline: none;
|
||||
border-bottom-width: 2px;
|
||||
border-bottom-style: solid;
|
||||
display: inline-block;
|
||||
width: auto;
|
||||
z-index: 20;
|
||||
code,
|
||||
pre {
|
||||
color: inherit;
|
||||
}
|
||||
em,strong {
|
||||
color:inherit;
|
||||
font-weight:inherit;
|
||||
}
|
||||
display:none;
|
||||
}
|
||||
.shortcode-content {
|
||||
// h2 {
|
||||
// font-size: 1.1em;
|
||||
// color: lighten($base-font-color, 20%);
|
||||
// width: 100%;
|
||||
// display: block;
|
||||
// margin: 0px;
|
||||
// padding: 0px;
|
||||
// margin-left: 0px;
|
||||
// padding: 0px 12px;
|
||||
// border: none;
|
||||
// outline: none;
|
||||
// border-bottom-width: 2px;
|
||||
// border-bottom-style: solid;
|
||||
// display: inline-block;
|
||||
// width: auto;
|
||||
// z-index: 20;
|
||||
// code,
|
||||
// pre {
|
||||
// color: inherit;
|
||||
// }
|
||||
// em,strong {
|
||||
// color:inherit;
|
||||
// font-weight:inherit;
|
||||
// }
|
||||
// display:none;
|
||||
// }
|
||||
.admonition-content {
|
||||
display: block;
|
||||
margin: 0px;
|
||||
font-size: 1em;
|
||||
@ -59,32 +65,47 @@
|
||||
|
||||
.note {
|
||||
border-color: $hugo-blue;
|
||||
background-color: desaturate(lighten($hugo-blue,61%),20%);
|
||||
&:before {
|
||||
content: '\e80d';
|
||||
color: $hugo-blue;
|
||||
background-color: desaturate(lighten($hugo-blue,61%),20%);
|
||||
}
|
||||
h2 {
|
||||
border-bottom-color: $hugo-blue;
|
||||
color: $hugo-blue;
|
||||
background-color: desaturate(lighten($hugo-blue, 61%), 20%);
|
||||
#exclamation-icon {
|
||||
fill: $hugo-blue;
|
||||
}
|
||||
// &:before {
|
||||
// content: '\f06a';
|
||||
// color: inherit;
|
||||
// font-family:'FontAwesome';
|
||||
// padding:0px;
|
||||
// color:$hugo-blue;
|
||||
// background-color: desaturate(lighten($hugo-blue,61%),20%);
|
||||
// // &::after {
|
||||
// // content:'';
|
||||
// // width: 2px;
|
||||
// // height: 4px;
|
||||
// // border:2px solid $hugo-blue;
|
||||
// // }
|
||||
// }
|
||||
// // h2 {
|
||||
// // border-bottom-color: $hugo-blue;
|
||||
// // color: $hugo-blue;
|
||||
// // }
|
||||
}
|
||||
|
||||
.warning {
|
||||
border-color: $hugo-pink;
|
||||
background-color: lighten($hugo-pink,54%);
|
||||
&:before {
|
||||
content: '\e810';
|
||||
color: $hugo-pink;
|
||||
background-color: lighten($hugo-pink,54%);
|
||||
background-color: lighten($hugo-pink, 54%);
|
||||
#exclamation-icon {
|
||||
fill: $hugo-pink;
|
||||
}
|
||||
h2 {
|
||||
border-bottom-color: $hugo-pink;
|
||||
color: $hugo-pink;
|
||||
pre,
|
||||
code {
|
||||
color: $hugo-pink;
|
||||
}
|
||||
}
|
||||
}
|
||||
// &:before {
|
||||
// content: '\e810';
|
||||
// color: $hugo-pink;
|
||||
// background-color: lighten($hugo-pink, 54%);
|
||||
// }
|
||||
// h2 {
|
||||
// border-bottom-color: $hugo-pink;
|
||||
// color: $hugo-pink;
|
||||
// pre,
|
||||
// code {
|
||||
// color: $hugo-pink;
|
||||
// }
|
||||
// }
|
||||
}
|
||||
|
||||
@ -84,8 +84,11 @@ aside {
|
||||
margin: 0px;
|
||||
font-weight: bolder;
|
||||
margin-right: 1em;
|
||||
code {
|
||||
font-size: .9em;
|
||||
}
|
||||
//basically allows you to style with ***word*** in markdown for words like "Required"
|
||||
> strong > em > code{
|
||||
> strong > em > code {
|
||||
// color: $hugo-pink;
|
||||
font-style: normal;
|
||||
position: relative;
|
||||
@ -106,7 +109,7 @@ aside {
|
||||
margin: .5em 0em 0em 0em;
|
||||
text-indent: 0px;
|
||||
height: auto;
|
||||
font-size: .9em;
|
||||
font-size: 1em;
|
||||
padding: {
|
||||
top: .25em;
|
||||
bottom: 0em;
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user