From 2adba13ee6ffebeab57307acb2073260619e2d07 Mon Sep 17 00:00:00 2001 From: vjeantet Date: Sun, 6 Sep 2020 11:47:20 +0200 Subject: fix some shortcuts css --- assets/sass/main.scss | 1011 ++++++++++---------- assets/sass/shortcodes/alert.scss | 117 ++- assets/sass/shortcodes/button.scss | 37 +- exampleSite/content/shortcodes/alert/_index.md | 16 +- exampleSite/content/shortcodes/button/_index.md | 10 +- exampleSite/content/shortcodes/notice/_index.md | 18 +- ...n.scss_9fd32d87d247ca96761d3cae485087fe.content | 6 + ...t.scss_f300667da4f5b5f84e1a9e0702b2fdde.content | 28 +- ...n.scss_f300667da4f5b5f84e1a9e0702b2fdde.content | 32 +- layouts/partials/html-head.html | 2 + 10 files changed, 686 insertions(+), 591 deletions(-) diff --git a/assets/sass/main.scss b/assets/sass/main.scss index 3b52b44..1560dc1 100644 --- a/assets/sass/main.scss +++ b/assets/sass/main.scss @@ -1,502 +1,509 @@ -{{if .Site.Params.color_main}} -$color_main : {{ .Site.Params.color_main }} ; -{{else}} -$color_main : hsl(random(360)-1, random(100)-1%, random(100)-1%); -{{end}} - -{{if .Site.Params.color_second}} -$color_second : {{ .Site.Params.color_second }} ; -{{else}} -$color_second : saturate($color_main, 0%); -{{end}} - -$c_light1 : lighten($color_main, 15%); -$c_light2 : lighten($color_main, 45%); -$c_light3 : lighten($color_main, 50%); -$c_light4 : lighten($color_main, 80%); - - -$c_dark1 : darken($color_main, 15%); -$c_dark2 : darken($color_main, 25%); -$c_dark3 : darken($color_main, 45%); -$c_dark4 : darken($color_main, 50%); - - - -$c_saturate1 : $color_second; -$c_saturate2 : saturate($color_second, 30%); -$c_saturate3 : saturate($color_second, 40%); -$c_saturate4 : saturate($color_second, 50%); -$c_saturate5 : saturate($color_second, 60%); -$c_saturate6 : saturate($color_second, 75%); -$c_saturate7 : saturate($color_second, 90%); - -body:not(.render_raw){ - font-family:"Montserrat",sans-serif; - - - font-weight: 400; - line-height: 1.5; - color: $c_dark3; - - a{ - color: $c_dark4; - text-decoration: none; - background-color: transparent; - } - - - header { - background-color: $c_dark2; - - border-bottom: 2px solid gray ; - box-shadow: 0 0 0.2rem rgba(0,0,0,.1), 0 0.2rem 0.4rem rgba(0,0,0,.2); - - justify-content: space-between; - align-items: stretch ; - - color:($c_light2); - a { - color:invert($c_dark2); - } - > div { - display: flex; - flex-direction: row; - flex-wrap: nowrap; - justify-content: space-between; - align-items: stretch ; - - white-space: nowrap; - - - img { - height: 32px; - margin-right: 0.5rem; - } - .burger { - margin-right: 1rem; - } - - } - - - - - nav.shortcuts { - margin-left: auto; - position: relative; - - display: flex; - justify-content: flex-start; - list-style-type: none; - flex-direction: row; - flex-wrap: nowrap; - - li { - - margin: 0px; - .fa { - font-size: 1.5rem; - margin-right: 0.5rem - } - - a { - color:lighten(invert($c_dark2),4%); - padding: 0 1rem; - font-weight: bold; - font-size: 90%; - } - } - } - - - } - - - article { - background-color: $c_light4 ; - aside { - #close_menu{ - display: none; - float:right; - margin-right: 2rem; - } - - &.responsive{ - #close_menu{ - display: block; - } - } - } - - section.right-menu { - padding: 3.5rem 0 3.5rem 0; - font-size:14px; - line-height:20px; - padding-left:2px; - - .TableOfContents { - - > *{ - margin-left:5px; - } - label{ - font-weight:700; - letter-spacing: -1px; - display: block; - margin-bottom: 14px; - border-bottom: 1px dotted $c_light1; - color:$c_dark2; - font-variant: small-caps; - } - nav>ul{ - padding: 0px 0px 0px 0px; - margin: 0px 0px 0px 0px; - ul{ - padding: 0px 0px 0px 14px; - margin: 0px 0px 0px 0px; - border-left: 1px solid $c_light2; - li{ - font-size: 90%; - } - } - } - - ul{ - list-style-type: none; - } - li{ - padding: 8px 0px 8px 0px; - a { - font-weight:300; - /*padding-left: 2px;*/ - &.active{ - font-weight:500; - } - } - - } - - } - } - - } - - footer { - background-color: $c_dark2; - color:invert($c_dark2); - a{ - color:invert($c_dark2); - } - padding: 3rem; - } - -} - - -article section.page { - background-color: inherit; - #breadcrumb{ - display: block; - font-size: 1rem; - line-height: 1.5; - letter-spacing: -.01em; - font-weight: 500; - - ol{ - padding: 0px; - display: flex; - flex-wrap: wrap; - list-style: none; - li{ - display: list-item; - &:after{ - display: inline-block; - padding-right: .5rem; - padding-left: .5rem; - color: $c_dark3; - content: "⊸"; - } - a { - color: $c_dark3; - border-bottom: 1px dotted $c_saturate1; - padding-bottom: 4px; - padding-right: 0px; - } - - &.active{ - &:after{ - display: inline-block; - padding-left: .75rem; - content: ""; - } - } - } - - } - - } - - nav.subpages{ - margin-right: -1.5rem; - margin-left: -1.5rem; - padding-left: 1.5em; - - position: -webkit-sticky; - position: sticky; - overflow-y: auto; - top: 45px; - background-color: inherit; - - - - flex: 1; - display: flex; - justify-content: flex-start; - list-style-type: none; - li { - white-space: nowrap; - overflow: hidden; - text-overflow: ellipsis; - margin: 0px; - padding-right: .75rem; - min-width: 50px; - - a { - font-size: 90%; - color: $c_saturate4; - } - &:not(:first-child):before{ - display: inline-block; - padding-right: .75rem; - color: $c_saturate2; - content: "|"; - } - &.active{ - font-weight: bold; - } - } - li:first-child:before{ - content : "└ "; - color: $c_saturate2; - } - } - - - div.jump-to-section{ - font-size: smaller; - color:$c_dark2; - ul{ - li a{ - color:$c_saturate3; - } - } - - nav{ - background-color: white; - } - } - - - - - div.chevrons { - margin-top: 3rem; - border-top: 1px solid $c_light2; - border-bottom: 1px solid $c_light2; - padding: 1rem 0rem; - display: flex; - flex-direction: row; - align-items: stretch; - -webkit-box-pack: end!important; - justify-content: flex-end!important; - - a{ - display: flex; - align-items: center!important; - -webkit-box-align: center!important; - justify-content: flex-end!important; - - max-width: 70%; - - padding: 24px; - - &.prev{ - display: none - } - &.next div{ - text-align: right; - justify-content: flex-end; - padding: 20px; - } - - label{ - font-size: 24px; - font-weight: 700; - cursor: pointer; - } - p{ - font-size: 15px; - padding: 0px; - margin: 0px; - text-align: left; - } - - } - - - } -} -article section.page { - line-height:24px; - - h1:first-of-type { - font-size: 2.6rem; - margin-top: 1.5rem!important; - color:$c_dark2; - margin-bottom: 0px; - line-height: 1.05; - letter-spacing: -.05em; - font-weight: 800; - span{ - font-size: 90%; - font-weight: 500; - &:before{ - padding-left: .75rem; - padding-right: .75rem; - color: $c_dark2; - content: "⊷"; - } - ; - } - } -} -article section.page div.content{ - margin-top: 2.5rem; - - a.anchor { - display: block; - position: relative; - top: -7rem; - visibility: hidden; - } - - a{ - color:$c_saturate7; - font-weight: 500; - text-decoration: underline; - } - - h1 { - color:$c_dark1; - font-size:30px; - font-variant-ligatures:none; - font-weight:700; - height:88px; - letter-spacing:-0.75px; - line-height:32px; - } - - h2 { - - } // TABLE - table { - width: 100%; - margin-bottom: 2em; - - border-collapse: collapse; - border-spacing: 0; - border: 1px solid #e6e6e6; - - - - th, - td { - padding: .25rem .75rem - } - - th { - padding: 0.5rem; - text-transform: uppercase; - vertical-align: middle; - text-align: center; - font-weight: 800; - background: #f6f6f6; - color: black; - border-bottom: 2px solid #e5e5e5; - } - - td { - padding: 0.5rem; - vertical-align: middle; - border-bottom: 1px solid #e5e5e5; - border: 1px solid #e6e6e6; - color: #323232; - } - - td:first-child { - code { - background-color: transparent; - padding: 0 - } - } - } - // IMAGES - img { - border: 0; - max-width: 100%; - margin: 1.5rem auto; - display: block; - text-align: center; - - - - &.border { - border: 2px solid #e6e6e6 !important; - padding: 2px; - } - - &.shadow { - box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1); - } - - &.inline { - display: inline !important; - - vertical-align: bottom; - } - - &.inline { - display: inline !important; - - vertical-align: bottom; - } - } - - code { - - padding: 0.5px; - font-weight: 600; - white-space: pre-wrap; - } - div.highlight{ - pre{ - display:block; - white-space: pre-wrap; - code{ - display: block; - margin-left:-1.5rem; - margin-right:-1.5rem; - padding: 10px; - border:0px; - font-weight: inherit; - background-color: inherit; - } - } - } -} - - - - - +{{if .Site.Params.color_main}} +$color_main : {{ .Site.Params.color_main }} ; +{{else}} +$color_main : hsl(random(360)-1, random(100)-1%, random(100)-1%); +{{end}} + +{{if .Site.Params.color_second}} +$color_second : {{ .Site.Params.color_second }} ; +{{else}} +$color_second : saturate($color_main, 0%); +{{end}} + +$c_light1 : lighten($color_main, 15%); +$c_light2 : lighten($color_main, 45%); +$c_light3 : lighten($color_main, 50%); +$c_light4 : lighten($color_main, 80%); + + +$c_dark1 : darken($color_main, 15%); +$c_dark2 : darken($color_main, 25%); +$c_dark3 : darken($color_main, 45%); +$c_dark4 : darken($color_main, 50%); + + + +$c_saturate1 : $color_second; +$c_saturate2 : saturate($color_second, 30%); +$c_saturate3 : saturate($color_second, 40%); +$c_saturate4 : saturate($color_second, 50%); +$c_saturate5 : saturate($color_second, 60%); +$c_saturate6 : saturate($color_second, 75%); +$c_saturate7 : saturate($color_second, 90%); + +body:not(.render_raw){ + font-family:"Montserrat",sans-serif; + + + font-weight: 400; + line-height: 1.5; + color: $c_dark3; + + a{ + color: $c_dark4; + text-decoration: none; + background-color: transparent; + } + + + header { + background-color: $c_dark2; + + border-bottom: 2px solid gray ; + box-shadow: 0 0 0.2rem rgba(0,0,0,.1), 0 0.2rem 0.4rem rgba(0,0,0,.2); + + justify-content: space-between; + align-items: stretch ; + + color:($c_light2); + a { + color:invert($c_dark2); + } + > div { + display: flex; + flex-direction: row; + flex-wrap: nowrap; + justify-content: space-between; + align-items: stretch ; + + white-space: nowrap; + + + img { + height: 32px; + margin-right: 0.5rem; + } + .burger { + margin-right: 1rem; + } + + } + + + + + nav.shortcuts { + margin-left: auto; + position: relative; + + display: flex; + justify-content: flex-start; + list-style-type: none; + flex-direction: row; + flex-wrap: nowrap; + + li { + + margin: 0px; + .fa { + font-size: 1.5rem; + margin-right: 0.5rem + } + + a { + color:lighten(invert($c_dark2),4%); + padding: 0 1rem; + font-weight: bold; + font-size: 90%; + } + } + } + + + } + + + article { + background-color: $c_light4 ; + aside { + #close_menu{ + display: none; + float:right; + margin-right: 2rem; + } + + &.responsive{ + #close_menu{ + display: block; + } + } + } + + section.right-menu { + padding: 3.5rem 0 3.5rem 0; + font-size:14px; + line-height:20px; + padding-left:2px; + + .TableOfContents { + + > *{ + margin-left:5px; + } + label{ + font-weight:700; + letter-spacing: -1px; + display: block; + margin-bottom: 14px; + border-bottom: 1px dotted $c_light1; + color:$c_dark2; + font-variant: small-caps; + } + nav>ul{ + padding: 0px 0px 0px 0px; + margin: 0px 0px 0px 0px; + ul{ + padding: 0px 0px 0px 14px; + margin: 0px 0px 0px 0px; + border-left: 1px solid $c_light2; + li{ + font-size: 90%; + } + } + } + + ul{ + list-style-type: none; + } + li{ + padding: 8px 0px 8px 0px; + a { + font-weight:300; + /*padding-left: 2px;*/ + &.active{ + font-weight:500; + } + } + + } + + } + } + + } + + footer { + background-color: $c_dark2; + color:invert($c_dark2); + a{ + color:invert($c_dark2); + } + padding: 3rem; + } + +} + + +article section.page { + background-color: inherit; + #breadcrumb{ + display: block; + font-size: 1rem; + line-height: 1.5; + letter-spacing: -.01em; + font-weight: 500; + + ol{ + padding: 0px; + display: flex; + flex-wrap: wrap; + list-style: none; + li{ + display: list-item; + &:after{ + display: inline-block; + padding-right: .5rem; + padding-left: .5rem; + color: $c_dark3; + content: "⊸"; + } + a { + color: $c_dark3; + border-bottom: 1px dotted $c_saturate1; + padding-bottom: 4px; + padding-right: 0px; + } + + &.active{ + &:after{ + display: inline-block; + padding-left: .75rem; + content: ""; + } + } + } + + } + + } + + nav.subpages{ + margin-right: -1.5rem; + margin-left: -1.5rem; + padding-left: 1.5em; + + position: -webkit-sticky; + position: sticky; + overflow-y: auto; + top: 45px; + background-color: inherit; + + + + flex: 1; + display: flex; + justify-content: flex-start; + list-style-type: none; + li { + white-space: nowrap; + overflow: hidden; + text-overflow: ellipsis; + margin: 0px; + padding-right: .75rem; + min-width: 50px; + + a { + font-size: 90%; + color: $c_saturate4; + } + &:not(:first-child):before{ + display: inline-block; + padding-right: .75rem; + color: $c_saturate2; + content: "|"; + } + &.active{ + font-weight: bold; + } + } + li:first-child:before{ + content : "└ "; + color: $c_saturate2; + } + } + + + div.jump-to-section{ + font-size: smaller; + color:$c_dark2; + ul{ + li a{ + color:$c_saturate3; + } + } + + nav{ + background-color: white; + } + } + + + + + div.chevrons { + margin-top: 3rem; + border-top: 1px solid $c_light2; + border-bottom: 1px solid $c_light2; + padding: 1rem 0rem; + display: flex; + flex-direction: row; + align-items: stretch; + -webkit-box-pack: end!important; + justify-content: flex-end!important; + + a{ + display: flex; + align-items: center!important; + -webkit-box-align: center!important; + justify-content: flex-end!important; + + max-width: 70%; + + padding: 24px; + + &.prev{ + display: none + } + &.next div{ + text-align: right; + justify-content: flex-end; + padding: 20px; + } + + label{ + font-size: 24px; + font-weight: 700; + cursor: pointer; + } + p{ + font-size: 15px; + padding: 0px; + margin: 0px; + text-align: left; + } + + } + + + } +} +article section.page { + line-height:24px; + + h1:first-of-type { + font-size: 2.6rem; + margin-top: 1.5rem!important; + color:$c_dark2; + margin-bottom: 0px; + line-height: 1.05; + letter-spacing: -.05em; + font-weight: 800; + span{ + font-size: 90%; + font-weight: 500; + &:before{ + padding-left: .75rem; + padding-right: .75rem; + color: $c_dark2; + content: "⊷"; + } + ; + } + } +} +article section.page div.content{ + margin-top: 2.5rem; + + a.anchor { + display: block; + position: relative; + top: -7rem; + visibility: hidden; + } + + a{ + color:$c_saturate7; + font-weight: 500; + text-decoration: underline; + } + + h1 { + color:$c_dark1; + font-size:30px; + font-variant-ligatures:none; + font-weight:700; + height:88px; + letter-spacing:-0.75px; + line-height:32px; + } + + h2 { + + } // TABLE + table { + width: 100%; + margin-bottom: 2em; + + border-collapse: collapse; + border-spacing: 0; + border: 1px solid #e6e6e6; + + + + th, + td { + padding: .25rem .75rem + } + + th { + padding: 0.5rem; + text-transform: uppercase; + vertical-align: middle; + text-align: center; + font-weight: 800; + background: #f6f6f6; + color: black; + border-bottom: 2px solid #e5e5e5; + } + + td { + padding: 0.5rem; + vertical-align: middle; + border-bottom: 1px solid #e5e5e5; + border: 1px solid #e6e6e6; + color: #323232; + } + + td:first-child { + code { + background-color: transparent; + padding: 0 + } + } + } + // IMAGES + img { + border: 0; + max-width: 100%; + margin: 1.5rem auto; + display: block; + text-align: center; + + + + &.border { + border: 2px solid #e6e6e6 !important; + padding: 2px; + } + + &.shadow { + box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1); + } + + &.inline { + display: inline !important; + + vertical-align: bottom; + } + + &.inline { + display: inline !important; + + vertical-align: bottom; + } + } + + code { + font-family: SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono","Courier New",monospace; + font-size: 85%; + color: #e83e8c; + word-wrap: break-word; + + padding: 0.5px; + font-weight: 600; + white-space: pre-wrap; + } + + div.highlight{ + pre{ + display:block; + white-space: pre-wrap; + code{ + color:inherit!important; + font-size: 75%; + display: block; + margin-left:-1.5rem; + margin-right:-1.5rem; + padding: 10px; + border:0px; + font-weight: inherit; + background-color: inherit; + } + } + } +} + + + + + diff --git a/assets/sass/shortcodes/alert.scss b/assets/sass/shortcodes/alert.scss index e0b66f6..cbbb2f3 100644 --- a/assets/sass/shortcodes/alert.scss +++ b/assets/sass/shortcodes/alert.scss @@ -1,50 +1,67 @@ -$color_primary : #007bff ; -$color_secondary : #6c757d ; -$color_success : #28a745 ; -$color_danger : #dc3545 ; -$color_warning : #ffc107 ; -$color_info : #17a2b8 ; -$color_light : #f8f9fa ; -$color_dark : #343a40 ; -$color_white : #fff ; -$color_transparent : transparent ; - -div.alert{ - padding: .75rem 1.25rem; - margin-bottom: 1rem; - border: 1px solid transparent; - border-radius: .25rem; - - &.primary{ - color: white; - a{color: white; } - background-color: $color_primary; - border-color: $color_primary; - } - &.info{ - color: white; - a{color: white; } - background-color: $color_info; - border-color: $color_info; - } - &.success{ - color: white; - a{color: white; } - background-color: $color_success; - border-color: $color_success; - } - &.warning{ - color: black; - a{color: black; } - background-color: $color_warning; - border-color: $color_warning; - } - &.danger{ - color: white; - a{color: white; } - background-color: $color_danger; - border-color: $color_danger; - } - - -} +$color_primary : #007bff ; +$color_secondary : #6c757d ; +$color_success : #28a745 ; +$color_danger : #dc3545 ; +$color_warning : #ffc107 ; +$color_info : #17a2b8 ; +$color_light : #f8f9fa ; +$color_dark : #343a40 ; +$color_white : #fff ; +$color_transparent : transparent ; + +div.alert{ + padding: .75rem 1.25rem; + margin-bottom: 1rem; + border: 1px solid transparent; + border-radius: .25rem; + + a{color:inherit!important;} + + &.primary{ + color: white; + background-color: $color_primary; + border-color: $color_primary; + } + &.info{ + color: white; + background-color: $color_info; + border-color: $color_info; + } + &.success{ + color: white; + background-color: $color_success; + border-color: $color_success; + } + &.warning{ + color: black; + background-color: $color_warning; + border-color: $color_warning; + } + &.danger{ + color: white; + background-color: $color_danger; + border-color: $color_danger; + } + &.danger{ + color: white; + background-color: $color_danger; + border-color: $color_danger; + } + &.secondary{ + color: white; + background-color: $color_secondary; + border-color: $color_secondary; + } + &.light{ + color: black; + background-color: $color_light; + border-color: $color_light; + } + &.dark{ + color: white; + background-color: $color_dark; + border-color: $color_dark; + } + + +} diff --git a/assets/sass/shortcodes/button.scss b/assets/sass/shortcodes/button.scss index 6df1873..d82ffa5 100644 --- a/assets/sass/shortcodes/button.scss +++ b/assets/sass/shortcodes/button.scss @@ -22,28 +22,53 @@ button.btn{ background-color: #007bff; border-color: #007bff; + a{color:inherit!important;} + + &.primary{ + color: white; + background-color: $color_primary; + border-color: $color_primary; + } &.info{ color: white; - a{color: white; } - background-color: $color_primary; - border-color: $color_primary; + background-color: $color_info; + border-color: $color_info; } &.success{ color: white; - a{color: white; } background-color: $color_success; border-color: $color_success; } &.warning{ color: black; - a{color: black; } background-color: $color_warning; border-color: $color_warning; } &.danger{ color: white; - a{color: white; } background-color: $color_danger; border-color: $color_danger; } + &.danger{ + color: white; + background-color: $color_danger; + border-color: $color_danger; + } + &.secondary{ + color: white; + background-color: $color_secondary; + border-color: $color_secondary; + } + &.light{ + color: black; + background-color: $color_light; + border-color: $color_light; + } + &.dark{ + color: white; + background-color: $color_dark; + border-color: $color_dark; + } + + } \ No newline at end of file diff --git a/exampleSite/content/shortcodes/alert/_index.md b/exampleSite/content/shortcodes/alert/_index.md index 91025ee..1a3e217 100644 --- a/exampleSite/content/shortcodes/alert/_index.md +++ b/exampleSite/content/shortcodes/alert/_index.md @@ -10,7 +10,7 @@ The `alert` shortcode allow you to highlight information in your page. They crea | Parameter | Default | Description | |:--|:--|:--| -| theme | `info` | `success`, `info`,`warning`,`danger` | +| theme | `info` | `primary`,`success`, `info`,`warning`,`danger`,`dark`,`light`,`secondary` | {{%alert info%}} **Tips :** setting only the theme as argument works too : @@ -20,12 +20,20 @@ The `alert` shortcode allow you to highlight information in your page. They crea ## Basic examples ``` + {{%/* alert primary */%}}**this** is a primary{{%/* /alert */%}} {{%/* alert theme="info" */%}}**this** is a text{{%/* /alert */%}} {{%/* alert theme="success" */%}}**Yeahhh !** is a text{{%/* /alert */%}} {{%/* alert theme="warning" */%}}**Be carefull** is a text{{%/* /alert */%}} - {{%/* alert theme="danger" */%}}**Beware !** is a text{{%/* /alert */%}} + {{%/* alert danger */%}}**Beware !** is a text{{%/* /alert */%}} + {{%/* alert dark */%}}**Dark !** is a dark{{%/* /alert */%}} + {{%/* alert light */%}}**oooh !** is a light{{%/* /alert */%}} + {{%/* alert secondary */%}}**Wait !** is a secondary{{%/* /alert */%}} ``` +{{% alert primary %}}**this** is an primary{{% /alert %}} {{% alert theme="info"%}}**this** is an info{{% /alert %}} -{{% alert theme="success" %}}**Yeahhh !** is an success{{% /alert %}} +{{% alert theme="success" %}}**Yeahhh !** is a success{{% /alert %}} {{% alert theme="warning" %}}**Be carefull** is a warning{{% /alert %}} -{{% alert theme="danger" %}}**Beware !** is a danger{{% /alert %}} \ No newline at end of file +{{% alert danger %}}**Beware !** is a danger{{% /alert %}} +{{% alert dark %}}**Dark !** is a dark{{% /alert %}} +{{% alert light %}}**oooh !** is a light{{% /alert %}} +{{% alert secondary %}}**Wait !** is a secondary{{% /alert %}} \ No newline at end of file diff --git a/exampleSite/content/shortcodes/button/_index.md b/exampleSite/content/shortcodes/button/_index.md index 5ed2cc2..2d781cd 100644 --- a/exampleSite/content/shortcodes/button/_index.md +++ b/exampleSite/content/shortcodes/button/_index.md @@ -24,7 +24,9 @@ The inner text you place in short code will be displayed as the _button text_ {{}} Info {{}} {{}} Warning {{}} {{}} Danger ! {{}} - {{}} Danger ! {{}} + {{}} Dark ! {{}} + {{}} Light ! {{}} + {{}} Secondary{{}} ``` {{