docker
/
docs
mirror of https://github.com/docker/docs.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

Merge pull request #19204 from dvdksn/fix-callout-icons 

fix: render callout icons
This commit is contained in:
David Karlsson 2024-01-25 14:12:36 +01:00 committed by GitHub
parent b41cdf9c02 47487acd24
commit f60747d579
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
3 changed files with 41 additions and 11 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

40
assets/css/callouts.css
View File

@ -10,7 +10,20 @@
@apply bg-blue-light-100 px-6 py-4 font-normal not-italic dark:bg-blue-dark-100;
quotes: none;
> *:first-child {
@apply relative ml-6 mt-0 before:absolute before:-left-6 before:font-icons before:content-['info'];
@apply relative ml-6 mt-0;
&:before {
@apply bg-black dark:bg-white;
position: absolute;
display: block;
margin-left: -24px;
margin-top: 4px;
width: 20px;
height: 20px;
mask-image: url('/icons/info-fill.svg');
-webkit-mask-image: url('/icons/info-fill.svg');
mask-repeat: no-repeat;
mask-size: cover;
}
}
*:last-child {
@apply mb-0 after:content-none;
@ -18,34 +31,39 @@
&.warning {
@apply border-l-red-light bg-red-light-100 dark:border-l-red-dark dark:bg-red-dark-100;
> *:first-child {
@apply before:content-['dangerous'];
> *:first-child:before {
mask-image: url('/icons/dangerous-fill.svg');
-webkit-mask-image: url('/icons/dangerous-fill.svg');
}
}
&.important {
@apply border-l-amber-light bg-amber-light-100 dark:border-l-amber-dark dark:bg-amber-dark-100;
> *:first-child {
@apply before:content-['warning'];
> *:first-child:before {
mask-image: url('/icons/warning-fill.svg');
-webkit-mask-image: url('/icons/warning-fill.svg');
}
}
&.tip {
@apply border-l-green-light bg-green-light-100 dark:border-l-green-dark dark:bg-green-dark-100;
> *:first-child {
@apply before:content-['lightbulb'];
> *:first-child:before {
mask-image: url('/icons/lightbulb-fill.svg');
-webkit-mask-image: url('/icons/lightbulb-fill.svg');
}
}
&.experimental {
> *:first-child {
@apply before:content-['science'];
> *:first-child:before {
mask-image: url('/icons/science-fill.svg');
-webkit-mask-image: url('/icons/science-fill.svg');
}
}
&.restricted {
@apply border-l-violet-light bg-violet-light-100 dark:border-l-violet-dark dark:bg-violet-dark-100;
> *:first-child {
@apply before:content-['rocket\_launch'];
> *:first-child:before {
mask-image: url('/icons/rocket_launch-fill.svg');
-webkit-mask-image: url('/icons/rocket_launch-fill.svg');
}
}
}

1
layouts/partials/head.html
View File

@ -60,3 +60,4 @@
{{ $mermaid := resources.Get "js/mermaid.js" | js.Build (dict "minify" true) }}
<script>{{ $mermaid.Content | safeJS }}</script>
{{ end }}
{{ partialCached "utils/resources.html" . }}

11
layouts/partials/utils/resources.html Normal file
View File

@ -0,0 +1,11 @@
{{/* meta partial for publishing resources */}}
{{ $icons := slice }}
{{ $icons = $icons | append (resources.Get "icons/info-fill.svg") }}
{{ $icons = $icons | append (resources.Get "icons/dangerous-fill.svg") }}
{{ $icons = $icons | append (resources.Get "icons/warning-fill.svg") }}
{{ $icons = $icons | append (resources.Get "icons/lightbulb-fill.svg") }}
{{ $icons = $icons | append (resources.Get "icons/science-fill.svg") }}
{{ $icons = $icons | append (resources.Get "icons/rocket_launch-fill.svg") }}
{{ range $icons }}
{{ .Publish}}
{{ end }}