Remove heading from admonitions replacing icon with SVG

This commit is contained in:
Ryan Watters committed 2017-02-28 03:03:10 -06:00
1 parent 2af9243efa
commit 5ed3660b1d
8 files changed
+101 -65

No files matched your search

+1 -1
View File
@@ -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.
Binary file not shown.
+5 -2
View File
@@ -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>
+6 -3
View File
@@ -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>
+1 -1
View File
@@ -1 +1 @@
/*! normalize.css v3.0.3 | MIT License | github.com/necolas/normalize.css */html{font-family:sans-serif;-ms-text-size-adjust:100%;-webkit-text-size-adjust:100%}body{margin:0}article,aside,details,figcaption,figure,footer,header,hgroup,main,menu,nav,section,summary{display:block}audio,canvas,progress,video{display:inline-block;vertical-align:baseline}audio:not([controls]){display:none;height:0}[hidden],template{display:none}a{background-color:transparent}a:active,a:hover{outline:0}abbr[title]{border-bottom:1px dotted}b,strong{font-weight:bold}dfn{font-style:italic}h1{font-size:2em;margin:0.67em 0}mark{background:#ff0;color:#000}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sup{top:-0.5em}sub{bottom:-0.25em}img{border:0}svg:not(:root){overflow:hidden}figure{margin:1em 40px}hr{box-sizing:content-box;height:0}pre{overflow:auto}code,kbd,pre,samp{font-family:monospace, monospace;font-size:1em}button,input,optgroup,select,textarea{color:inherit;font:inherit;margin:0}button{overflow:visible}button,select{text-transform:none}button,html input[type="button"],input[type="reset"],input[type="submit"]{-webkit-appearance:button;cursor:pointer}button[disabled],html input[disabled]{cursor:default}button::-moz-focus-inner,input::-moz-focus-inner{border:0;padding:0}input{line-height:normal}input[type="checkbox"],input[type="radio"]{box-sizing:border-box;padding:0}input[type="number"]::-webkit-inner-spin-button,input[type="number"]::-webkit-outer-spin-button{height:auto}input[type="search"]{-webkit-appearance:textfield;box-sizing:content-box;border-radius:0px !important;outline:none}input[type="search"]::-webkit-search-cancel-button,input[type="search"]::-webkit-search-decoration{-webkit-appearance:none}fieldset{border:1px solid #c0c0c0;margin:0 2px;padding:0.35em 0.625em 0.75em}legend{border:0;padding:0}textarea{overflow:auto}optgroup{font-weight:bold}table{border-collapse:collapse;border-spacing:0}td,th{padding:0}html{box-sizing:border-box}*,*:before,*:after{box-sizing:inherit}html,body{margin:0px;padding:0px;outline:none;border:none;font-size:18px;font-family:"muli","Helvetica Neue","Helvetica","Roboto","Arial",sans-serif;color:#222;line-height:1.6;font-weight:300;overflow-x:hidden}body{font-size:93%;overflow-x:hidden;display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column}@media only screen and (min-width: 760px){body{font-size:97%}}@media only screen and (min-width: 960px){body{font-size:100%}}strong{font-weight:600;color:#222}p{margin-top:0px;margin-bottom:1.5em;line-height:1.6}@font-face{font-family:'fontello';src:url("/fonts/fontello/fontello.eot");src:url("/fonts/fontello/fontello.woff2") format("woff2"),url("/fonts/fontello/fontello.woff") format("woff"),url("/fonts/fontello/fontello.ttf") format("truetype"),url("/fonts/fontello/fontello.svg?78165468#fontello") format("svg");font-weight:normal;font-style:normal}[class^="icon-"]:before,[class*=" icon-"]:before{font-family:"fontello";font-style:normal;font-weight:normal;speak:none;display:inline-block;text-decoration:inherit;width:1em;margin-right:.2em;text-align:center;font-variant:normal;text-transform:none;line-height:1em;margin-left:.2em;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.icon-alert:before{content:'\e810'}.icon-angle-double-right:before{content:'\f101'}.icon-attach:before{content:'\e820'}.icon-attention:before{content:'\e80f'}.icon-bash:before{content:'\e804'}.icon-bell:before{content:'\e80d'}.icon-cancel:before{content:'\e81e'}.icon-caution:before{content:'\e80f'}.icon-chrome:before{content:'\e841'}.icon-clipboard:before{content:'\e817'}.icon-code:before{content:'\f121'}.icon-cog-alt:before{content:'\e814'}.icon-css3:before{content:'\f13c'}.icon-docs:before{content:'\f15c'}.icon-download:before{content:'\e815'}.icon-facebook-official:before{content:'\f230'}.icon-firefox:before{content:'\e840'}.icon-flag:before{content:'\e813'}.icon-forum:before{content:'\f03d';margin-right:.3em}.icon-github:before{content:'\f09b'}.icon-gitter:before{content:'\e819'}.icon-go:before{content:'\e801'}.icon-golang:before{content:'\e801'}.icon-heart:before{content:'\e81d'}.icon-help:before{content:'\e81b'}.icon-home:before{content:'\e812'}.icon-html.input:before{content:'\e81f'}.icon-html5:before{content:'\e800'}.icon-html:before{content:'\e800'}.icon-hugo:before{content:'\e81f'}.icon-ie:before{content:'\e843'}.icon-info:before{content:'\e811'}.icon-instagram:before{content:'\f32d'}.icon-javascript:before{content:'\e802'}.icon-js:before{content:'\e802'}.icon-json:before{content:'\e81c'}.icon-link:before{content:'\e816'}.icon-linkedin:before{content:'\f30c'}.icon-love:before{content:'\e81d'}.icon-mail:before{content:'\e821'}.icon-markdown:before{content:'\e80e'}.icon-md:before{content:'\e80e'}.icon-note:before{content:'\e80d'}.icon-opera:before{content:'\e842'}.icon-pdf:before{content:'\f1c1'}.icon-pencil:before{content:'\e80c'}.icon-picture:before{content:'\e808'}.icon-quLine truncated
/*! normalize.css v3.0.3 | MIT License | github.com/necolas/normalize.css */html{font-family:sans-serif;-ms-text-size-adjust:100%;-webkit-text-size-adjust:100%}body{margin:0}article,aside,details,figcaption,figure,footer,header,hgroup,main,menu,nav,section,summary{display:block}audio,canvas,progress,video{display:inline-block;vertical-align:baseline}audio:not([controls]){display:none;height:0}[hidden],template{display:none}a{background-color:transparent}a:active,a:hover{outline:0}abbr[title]{border-bottom:1px dotted}b,strong{font-weight:bold}dfn{font-style:italic}h1{font-size:2em;margin:0.67em 0}mark{background:#ff0;color:#000}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sup{top:-0.5em}sub{bottom:-0.25em}img{border:0}svg:not(:root){overflow:hidden}figure{margin:1em 40px}hr{box-sizing:content-box;height:0}pre{overflow:auto}code,kbd,pre,samp{font-family:monospace, monospace;font-size:1em}button,input,optgroup,select,textarea{color:inherit;font:inherit;margin:0}button{overflow:visible}button,select{text-transform:none}button,html input[type="button"],input[type="reset"],input[type="submit"]{-webkit-appearance:button;cursor:pointer}button[disabled],html input[disabled]{cursor:default}button::-moz-focus-inner,input::-moz-focus-inner{border:0;padding:0}input{line-height:normal}input[type="checkbox"],input[type="radio"]{box-sizing:border-box;padding:0}input[type="number"]::-webkit-inner-spin-button,input[type="number"]::-webkit-outer-spin-button{height:auto}input[type="search"]{-webkit-appearance:textfield;box-sizing:content-box;border-radius:0px !important;outline:none}input[type="search"]::-webkit-search-cancel-button,input[type="search"]::-webkit-search-decoration{-webkit-appearance:none}fieldset{border:1px solid #c0c0c0;margin:0 2px;padding:0.35em 0.625em 0.75em}legend{border:0;padding:0}textarea{overflow:auto}optgroup{font-weight:bold}table{border-collapse:collapse;border-spacing:0}td,th{padding:0}html{box-sizing:border-box}*,*:before,*:after{box-sizing:inherit}html,body{margin:0px;padding:0px;outline:none;border:none;font-size:18px;font-family:"muli","Helvetica Neue","Helvetica","Roboto","Arial",sans-serif;color:#222;line-height:1.6;font-weight:300;overflow-x:hidden}body{font-size:93%;overflow-x:hidden;display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column}@media only screen and (min-width: 760px){body{font-size:97%}}@media only screen and (min-width: 960px){body{font-size:100%}}strong{font-weight:600;color:#222}p{margin-top:0px;margin-bottom:1.5em;line-height:1.6}@font-face{font-family:'fontello';src:url("/fonts/fontello/fontello.eot");src:url("/fonts/fontello/fontello.woff2") format("woff2"),url("/fonts/fontello/fontello.woff") format("woff"),url("/fonts/fontello/fontello.ttf") format("truetype"),url("/fonts/fontello/fontello.svg?78165468#fontello") format("svg");font-weight:normal;font-style:normal}[class^="icon-"]:before,[class*=" icon-"]:before{font-family:"fontello";font-style:normal;font-weight:normal;speak:none;display:inline-block;text-decoration:inherit;width:1em;margin-right:.2em;text-align:center;font-variant:normal;text-transform:none;line-height:1em;margin-left:.2em;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.icon-alert:before{content:'\e810'}.icon-angle-double-right:before{content:'\f101'}.icon-attach:before{content:'\e820'}.icon-attention:before{content:'\e80f'}.icon-bash:before{content:'\e804'}.icon-bell:before{content:'\e80d'}.icon-cancel:before{content:'\e81e'}.icon-caution:before{content:'\e80f'}.icon-chrome:before{content:'\e841'}.icon-clipboard:before{content:'\e817'}.icon-code:before{content:'\f121'}.icon-cog-alt:before{content:'\e814'}.icon-css3:before{content:'\f13c'}.icon-docs:before{content:'\f15c'}.icon-download:before{content:'\e815'}.icon-facebook-official:before{content:'\f230'}.icon-firefox:before{content:'\e840'}.icon-flag:before{content:'\e813'}.icon-forum:before{content:'\f03d';margin-right:.3em}.icon-github:before{content:'\f09b'}.icon-gitter:before{content:'\e819'}.icon-go:before{content:'\e801'}.icon-golang:before{content:'\e801'}.icon-heart:before{content:'\e81d'}.icon-help:before{content:'\e81b'}.icon-home:before{content:'\e812'}.icon-html.input:before{content:'\e81f'}.icon-html5:before{content:'\e800'}.icon-html:before{content:'\e800'}.icon-hugo:before{content:'\e81f'}.icon-ie:before{content:'\e843'}.icon-info:before{content:'\e811'}.icon-instagram:before{content:'\f32d'}.icon-javascript:before{content:'\e802'}.icon-js:before{content:'\e802'}.icon-json:before{content:'\e81c'}.icon-link:before{content:'\e816'}.icon-linkedin:before{content:'\f30c'}.icon-love:before{content:'\e81d'}.icon-mail:before{content:'\e821'}.icon-markdown:before{content:'\e80e'}.icon-md:before{content:'\e80e'}.icon-note:before{content:'\e80d'}.icon-opera:before{content:'\e842'}.icon-pdf:before{content:'\f1c1'}.icon-pencil:before{content:'\e80c'}.icon-picture:before{content:'\e808'}.icon-quLine truncated
@@ -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;