Nice notice messages, work based on https://github.com/martignoni/hugo-notice
This commit is contained in:
Raúl Martín
parent
9885b3084c
commit
6db917417a
8
i18n/de.yaml
Normal file
8
i18n/de.yaml
Normal file
@ -0,0 +1,8 @@
|
||||
- id: warning
|
||||
translation: "Warnung"
|
||||
- id: note
|
||||
translation: "Anmerkung"
|
||||
- id: info
|
||||
translation: "Info"
|
||||
- id: tip
|
||||
translation: "Hinweis"
|
||||
8
i18n/en.yaml
Normal file
8
i18n/en.yaml
Normal file
@ -0,0 +1,8 @@
|
||||
- id: warning
|
||||
translation: "Warning"
|
||||
- id: note
|
||||
translation: "Note"
|
||||
- id: info
|
||||
translation: "Info"
|
||||
- id: tip
|
||||
translation: "Tip"
|
||||
8
i18n/es.yaml
Normal file
8
i18n/es.yaml
Normal file
@ -0,0 +1,8 @@
|
||||
- id: warning
|
||||
translation: "Aviso"
|
||||
- id: note
|
||||
translation: "Nota"
|
||||
- id: info
|
||||
translation: "Información"
|
||||
- id: tip
|
||||
translation: "Consejo"
|
||||
8
i18n/fr.yaml
Normal file
8
i18n/fr.yaml
Normal file
@ -0,0 +1,8 @@
|
||||
- id: warning
|
||||
translation: "Avertissement"
|
||||
- id: note
|
||||
translation: "Remarque"
|
||||
- id: info
|
||||
translation: "Information"
|
||||
- id: tip
|
||||
translation: "Astuce"
|
||||
8
i18n/it.yaml
Normal file
8
i18n/it.yaml
Normal file
@ -0,0 +1,8 @@
|
||||
- id: warning
|
||||
translation: "Attenzione"
|
||||
- id: note
|
||||
translation: "Nota"
|
||||
- id: info
|
||||
translation: "Informazione"
|
||||
- id: tip
|
||||
translation: "Consiglio"
|
||||
8
i18n/pt.yaml
Normal file
8
i18n/pt.yaml
Normal file
@ -0,0 +1,8 @@
|
||||
- id: warning
|
||||
translation: "Aviso"
|
||||
- id: note
|
||||
translation: "Nota"
|
||||
- id: info
|
||||
translation: "Informação"
|
||||
- id: tip
|
||||
translation: "Dica"
|
||||
8
i18n/zh-cn.yaml
Normal file
8
i18n/zh-cn.yaml
Normal file
@ -0,0 +1,8 @@
|
||||
- id: warning
|
||||
translation: "警告"
|
||||
- id: note
|
||||
translation: "注释"
|
||||
- id: info
|
||||
translation: "信息"
|
||||
- id: tip
|
||||
translation: "提示"
|
||||
14
layouts/shortcodes/notice-feather-icons.html
Normal file
14
layouts/shortcodes/notice-feather-icons.html
Normal file
@ -0,0 +1,14 @@
|
||||
{{/* Available notice types: warning, info, note, tip */}}
|
||||
{{- $noticeType := .Get 0 -}}
|
||||
{{/* Workaround markdownify inconsistency for single/multiple paragraphs */}}
|
||||
{{- $raw := (markdownify .Inner | chomp) -}}
|
||||
{{- $block := findRE "(?is)^<(?:address|article|aside|blockquote|canvas|dd|div|dl|dt|fieldset|figcaption|figure|footer|form|h(?:1|2|3|4|5|6)|header|hgroup|hr|li|main|nav|noscript|ol|output|p|pre|section|table|tfoot|ul|video)\\b" $raw 1 -}}
|
||||
{{/* Count how many times we've called this shortcode and load the css if it's the first time */}}
|
||||
{{- if not ($.Page.Scratch.Get "noticecount") -}}
|
||||
<svg width="0" height="0" display="none" xmlns="http://www.w3.org/2000/svg"><symbol id="tip-notice" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="3" stroke-linecap="round" stroke-linejoin="round" class="feather feather-check-circle"><path d="M22 11.08V12a10 10 0 1 1-5.93-9.14"></path><polyline points="22 4 12 14.01 9 11.01"></polyline></symbol><symbol id="note-notice" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="3" stroke-linecap="round" stroke-linejoin="round" class="feather feather-alert-circle"><circle cx="12" cy="12" r="10"></circle><line x1="12" y1="8" x2="12" y2="12"></line><line x1="12" y1="16" x2="12.01" y2="16"></line></symbol><symbol id="warning-notice" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="3" stroke-linecap="round" stroke-linejoin="round" class="feather feather-alert-triangle"><path d="M10.29 3.86L1.82 18a2 2 0 0 0 1.71 3h16.94a2 2 0 0 0 1.71-3L13.71 3.86a2 2 0 0 0-3.42 0z"></path><line x1="12" y1="9" x2="12" y2="13"></line><line x1="12" y1="17" x2="12.01" y2="17"></line></symbol><symbol id="info-notice" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="3" stroke-linecap="round" stroke-linejoin="round" class="feather feather-info"><circle cx="12" cy="12" r="10"></circle><line x1="12" y1="16" x2="12" y2="12"></line><line x1="12" y1="8" x2="12.01" y2="8"></line></symbol></svg>
|
||||
{{- end -}}
|
||||
{{- $.Page.Scratch.Add "noticecount" 1 -}}
|
||||
<div class="notice {{ $noticeType }}" {{ if len .Params | eq 2 }} id="{{ .Get 1 }}" {{ end }}>
|
||||
<p class="first notice-title"><span class="icon-notice baseline"><svg><use href="#{{- $noticeType -}}-notice"></use></svg></span>{{- i18n $noticeType -}}</p>
|
||||
{{- if or $block (not $raw) }}{{ $raw }}{{ else }}<p>{{ $raw }}</p>{{ end -}}
|
||||
</div>
|
||||
14
layouts/shortcodes/notice.html
Normal file
14
layouts/shortcodes/notice.html
Normal file
@ -0,0 +1,14 @@
|
||||
{{/* Available notice types: warning, info, note, tip */}}
|
||||
{{- $noticeType := .Get 0 -}}
|
||||
{{/* Workaround markdownify inconsistency for single/multiple paragraphs */}}
|
||||
{{- $raw := (markdownify .Inner | chomp) -}}
|
||||
{{- $block := findRE "(?is)^<(?:address|article|aside|blockquote|canvas|dd|div|dl|dt|fieldset|figcaption|figure|footer|form|h(?:1|2|3|4|5|6)|header|hgroup|hr|li|main|nav|noscript|ol|output|p|pre|section|table|tfoot|ul|video)\\b" $raw 1 -}}
|
||||
{{/* Count how many times we've called this shortcode and load the css if it's the first time */}}
|
||||
{{- if not ($.Page.Scratch.Get "noticecount") -}}
|
||||
<svg width="0" height="0" display="none" xmlns="http://www.w3.org/2000/svg"><symbol id="tip-notice" viewBox="0 0 512 512" preserveAspectRatio="xMidYMid meet"><path d="M504 256c0 136.967-111.033 248-248 248S8 392.967 8 256 119.033 8 256 8s248 111.033 248 248zM227.314 387.314l184-184c6.248-6.248 6.248-16.379 0-22.627l-22.627-22.627c-6.248-6.249-16.379-6.249-22.628 0L216 308.118l-70.059-70.059c-6.248-6.248-16.379-6.248-22.628 0l-22.627 22.627c-6.248 6.248-6.248 16.379 0 22.627l104 104c6.249 6.249 16.379 6.249 22.628.001z"/></symbol><symbol id="note-notice" viewBox="0 0 512 512" preserveAspectRatio="xMidYMid meet"><path d="M504 256c0 136.997-111.043 248-248 248S8 392.997 8 256C8 119.083 119.043 8 256 8s248 111.083 248 248zm-248 50c-25.405 0-46 20.595-46 46s20.595 46 46 46 46-20.595 46-46-20.595-46-46-46zm-43.673-165.346l7.418 136c.347 6.364 5.609 11.346 11.982 11.346h48.546c6.373 0 11.635-4.982 11.982-11.346l7.418-136c.375-6.874-5.098-12.654-11.982-12.654h-63.383c-6.884 0-12.356 5.78-11.981 12.654z"/></symbol><symbol id="warning-notice" viewBox="0 0 576 512" preserveAspectRatio="xMidYMid meet"><path d="M569.517 440.013C587.975 472.007 564.806 512 527.94 512H48.054c-36.937 0-59.999-40.055-41.577-71.987L246.423 23.985c18.467-32.009 64.72-31.951 83.154 0l239.94 416.028zM288 354c-25.405 0-46 20.595-46 46s20.595 46 46 46 46-20.595 46-46-20.595-46-46-46zm-43.673-165.346l7.418 136c.347 6.364 5.609 11.346 11.982 11.346h48.546c6.373 0 11.635-4.982 11.982-11.346l7.418-136c.375-6.874-5.098-12.654-11.982-12.654h-63.383c-6.884 0-12.356 5.78-11.981 12.654z"/></symbol><symbol id="info-notice" viewBox="0 0 512 512" preserveAspectRatio="xMidYMid meet"><path d="M256 8C119.043 8 8 119.083 8 256c0 136.997 111.043 248 248 248s248-111.003 248-248C504 119.083 392.957 8 256 8zm0 110c23.196 0 42 18.804 42 42s-18.804 42-42 42-42-18.804-42-42 18.804-42 42-42zm56 254c0 6.627-5.373 12-12 12h-88c-6.627 0-12-5.373-12-12v-24c0-6.627 5.373-12 12-12h12v-64h-12c-6.627 0-12-5.373-12-12v-24c0-6.627 5.373-12 12-12h64c6.627 0 12 5.373 12 12v100h12c6.627 0 12 5.373 12 12v24z"/></symbol></svg>
|
||||
{{- end -}}
|
||||
{{- $.Page.Scratch.Add "noticecount" 1 -}}
|
||||
<div class="notice {{ $noticeType }}" {{ if len .Params | eq 2 }} id="{{ .Get 1 }}" {{ end }}>
|
||||
<p class="first notice-title"><span class="icon-notice baseline"><svg><use href="#{{- $noticeType -}}-notice"></use></svg></span>{{- i18n $noticeType -}}</p>
|
||||
{{- if or $block (not $raw) }}{{ $raw }}{{ else }}<p>{{ $raw }}</p>{{ end -}}
|
||||
</div>
|
||||
70
source/css/notice.css
Normal file
70
source/css/notice.css
Normal file
@ -0,0 +1,70 @@
|
||||
.notice {
|
||||
padding: 18px;
|
||||
line-height: 24px;
|
||||
margin-bottom: 24px;
|
||||
border-radius: 4px;
|
||||
border: #6ab0de 1px solid;
|
||||
background: rgba(231, 242, 250, 0.2);
|
||||
}
|
||||
|
||||
.notice p:last-child {
|
||||
margin-bottom: 0
|
||||
}
|
||||
|
||||
.notice-title {
|
||||
margin: -18px -18px 12px;
|
||||
padding: 4px 18px;
|
||||
border-radius: 4px 4px 0 0;
|
||||
font-weight: 700;
|
||||
color: #fff;
|
||||
background: #6ab0de
|
||||
}
|
||||
|
||||
.notice.warning {
|
||||
background: rgba(250, 226, 226, 0.2);
|
||||
border: rgba(217, 83, 79, .9) 1px solid;
|
||||
.notice-title {
|
||||
background: rgba(217, 83, 79, .9)
|
||||
}
|
||||
}
|
||||
|
||||
.notice.info {
|
||||
background: rgba(255, 242, 219, 0.2);
|
||||
border: #f0b37e 1px solid;
|
||||
.notice-title {
|
||||
background: #f0b37e
|
||||
}
|
||||
}
|
||||
|
||||
.notice.note {
|
||||
background: rgba(231, 242, 250, 0.2);
|
||||
border: #6ab0de 1px solid;
|
||||
.notice-title {
|
||||
background: #6ab0de
|
||||
}
|
||||
}
|
||||
|
||||
.notice.tip {
|
||||
background: rgba(231, 242, 250, 0.2);
|
||||
border: rgba(92, 184, 92, .8) 1px solid;
|
||||
.notice-title {
|
||||
background: rgba(92, 184, 92, .8)
|
||||
}
|
||||
}
|
||||
|
||||
.icon-notice {
|
||||
display: inline-flex;
|
||||
align-self: center;
|
||||
margin-right: 8px;
|
||||
img, svg {
|
||||
height: 1em;
|
||||
width: 1em;
|
||||
fill: currentColor
|
||||
}
|
||||
img, .baseline svg {
|
||||
top: 0.125em;
|
||||
position: relative
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
@ -14,3 +14,4 @@
|
||||
@import 'syntax';
|
||||
@import 'code';
|
||||
@import 'terms';
|
||||
@import 'notice';
|
||||
File diff suppressed because one or more lines are too long
Loading…
x
Reference in New Issue
Block a user