diff --git a/src/markdown/index.ts b/src/markdown/index.ts index e861f5a..a2d752b 100644 --- a/src/markdown/index.ts +++ b/src/markdown/index.ts @@ -59,8 +59,17 @@ const marked = new Marked() } } + const label = token.attrs?.label as string | undefined; + const inner = label ? `${label}${label}` : ""; const style = globalIconPrefix ? `style="--icon-src: url('${globalIconPrefix}/${iconName}.${extension}')"` : ''; - return ``; + const iconHtml = `${inner}`; + + const repeat = parseInt(`${token.attrs?.repeat || ''}`); + const join = token.attrs?.join || ''; + const separator = join ? `<${join}>` : ''; + if(isNaN(repeat) || repeat < 1) return iconHtml; + + return Array(repeat).fill(iconHtml).join(separator); } return false; } diff --git a/src/styles.css b/src/styles.css index bb81550..cea47f9 100644 --- a/src/styles.css +++ b/src/styles.css @@ -2,7 +2,7 @@ @plugin "@tailwindcss/typography"; /* icon */ -icon, pull{ +icon, pull, pull-2{ @apply inline-block; width: 1.5em; height: 1.28em; @@ -12,6 +12,7 @@ icon, pull{ background-size: contain; background-position: center; background-repeat: no-repeat; + position: relative; } icon.big{ width: 2em; @@ -21,6 +22,27 @@ pull{ margin-right: -.5em; width: 0; } +pull-2{ + margin-right: -1em; + width: 0; +} +icon.big .icon-label, icon.big .icon-label-stroke{ + line-height: 2; + text-weight: bold; +} +.icon-label, .icon-label-stroke{ + position: absolute; + text-align: center; + line-height: 1.28; + left: 0; right: 0; top: 0; bottom: 0; +} +.icon-label{ + color: white; +} +.icon-label-stroke{ + color: black; + -webkit-text-stroke: .14em black; +} /* prose */