/** * DokuWiki Plugin admnote (CSS styles) * * @license GPL 2 http://www.gnu.org/licenses/gpl-2.0.html * @author Martin Donath * @author Klaus Vormweg */ /* icon definitions */ :root { --adm-abstract-pic: url('data:image/svg+xml;charset=utf-8,'); --adm-bug-pic: url('data:image/svg+xml;charset=utf-8,'); --adm-danger-pic: url('data:image/svg+xml;charset=utf-8,'); --adm-example-pic: url('data:image/svg+xml;charset=utf-8,'); --adm-failure-pic: url('data:image/svg+xml;charset=utf-8,'); --adm-information-pic: url('data:image/svg+xml;charset=utf-8,'); --adm-note-pic: url('data:image/svg+xml;charset=utf-8,'); --adm-question-pic: url('data:image/svg+xml;charset=utf-8,'); --adm-quote-pic: url('data:image/svg+xml;charset=utf-8,'); --adm-achievement-pic: url('data:image/svg+xml;charset=utf-8,'); --adm-tip-pic: url('data:image/svg+xml;charset=utf-8,'); --adm-warning-pic: url('data:image/svg+xml;charset=utf-8,'); } /* Common definitions for all note types */ .admonition { margin: 1.5625em 0; padding: 0 .6rem; overflow: auto; color: hsla(0, 0%, 0%, 0.87); line-height: 1.6; color-adjust: exact; page-break-inside: avoid; background-color: hsla(0, 0%, 100%, 1); border-left: .2rem solid #448aff; border-radius: .1rem; box-shadow: 0 .2rem .5rem rgba(0,0,0,.05),0 0 .05rem rgba(0,0,0,.1); box-sizing: inherit; } .admonition-title { position: relative; margin: 0 -0.6rem 0rem -0.8rem; padding: .4rem .6rem .4rem 2.4rem; font-weight: 700; background-color: rgba(68,138,255,.1); } .admonition-title::before { position: absolute; left: .8rem; width: 1.25rem; height: 1.25rem; content: ""; } .admonition-title + p, .admonition-title + ul, .admonition-title + ol, .admonition-title + dl, .admonition-title + pre, .admonition-title + table, .admonition-title + blockquote { margin-top: 1rem; } /* Note type definitions */ /* Note */ .admonition.note { border-color: #448aff; } .note>.admonition-title { background-color: rgba(68,138,255,.1); } .note>.admonition-title::before { background-color: #448aff; -webkit-mask-image: var(--adm-note-pic); mask-image: var(--adm-note-pic); -webkit-mask-repeat: no-repeat; mask-repeat: no-repeat; } /* Abstract */ .admonition.abstract { border-color: #00b0ff; } .abstract>.admonition-title { background-color: rgba(0,176,255,.1); } .abstract>.admonition-title::before { background-color: #00b0ff; -webkit-mask-image: var(--adm-abstract-pic); mask-image: var(--adm-abstract-pic); -webkit-mask-repeat: no-repeat; mask-repeat: no-repeat; } /* information */ .admonition.information { border-color: #00b8d4; } .information>.admonition-title { background-color: rgba(0,184,212,.1); } .information>.admonition-title::before { background-color: #00b8d4; -webkit-mask-image: var(--adm-information-pic); mask-image: var(--adm-information-pic); -webkit-mask-repeat: no-repeat; mask-repeat: no-repeat; } /* Tip */ .admonition.tip { border-color: #00bfa5; } .tip>.admonition-title { background-color: rgba(0,191,165,.1); } .tip>.admonition-title::before { background-color: #00bfa5; -webkit-mask-image: var(--adm-tip-pic); mask-image: var(--adm-tip-pic); -webkit-mask-repeat: no-repeat; mask-repeat: no-repeat; } /* achievement */ .admonition.achievement { border-color: #00c853; } .achievement>.admonition-title { background-color: rgba(0,200,83,.1); } .achievement>.admonition-title::before { background-color: #00c853; -webkit-mask-image: var(--adm-achievement-pic); mask-image: var(--adm-achievement-pic); -webkit-mask-repeat: no-repeat; mask-repeat: no-repeat; } /* Question */ .admonition.question { border-color: #64dd17; } .question>.admonition-title { background-color: rgba(100,221,23,.1); } .question>.admonition-title::before { background-color: #64dd17; -webkit-mask-image: var(--adm-question-pic); mask-image: var(--adm-question-pic); -webkit-mask-repeat: no-repeat; mask-repeat: no-repeat; } /* Warning */ .admonition.warning { border-color: #ff9100; } .warning>.admonition-title { background-color: rgba(255,145,0,.1); } .warning>.admonition-title::before { background-color: #ff9100; -webkit-mask-image: var(--adm-warning-pic); mask-image: var(--adm-warning-pic); -webkit-mask-repeat: no-repeat; mask-repeat: no-repeat; } /* Failure */ .admonition.failure { border-color: #ff5252; } .failure>.admonition-title { background-color: rgba(255,82,82,.1); } .failure>.admonition-title::before { background-color: #ff5252; -webkit-mask-image: var(--adm-failure-pic); mask-image: var(--adm-failure-pic); -webkit-mask-repeat: no-repeat; mask-repeat: no-repeat; } /* Danger */ .admonition.danger { border-color: #ff1744; } .danger>.admonition-title { background-color: rgba(255,23,68,.1); } .danger>.admonition-title::before { background-color: #ff1744; -webkit-mask-image: var(--adm-danger-pic); mask-image: var(--adm-danger-pic); -webkit-mask-repeat: no-repeat; mask-repeat: no-repeat; } /* Bug */ .admonition.bug { border-color: #f50057; } .bug>.admonition-title { background-color: rgba(245,0,87,.1); } .bug>.admonition-title::before { background-color: #f50057; -webkit-mask-image: var(--adm-bug-pic); mask-image: var(--adm-bug-pic); -webkit-mask-repeat: no-repeat; mask-repeat: no-repeat; } /* Example */ .admonition.example { border-color: #651fff; } .example>.admonition-title { background-color: rgba(101,31,255,.1); } .example>.admonition-title::before { background-color: #651fff; -webkit-mask-image: var(--adm-example-pic); mask-image: var(--adm-example-pic); -webkit-mask-repeat: no-repeat; mask-repeat: no-repeat; } /* Quote */ .admonition.quote { border-color: #9e9e9e; } .quote>.admonition-title { background-color: rgba(158,158,158,.1); } .quote>.admonition-title::before { background-color: #9e9e9e; -webkit-mask-image: var(--adm-quote-pic); mask-image: var(--adm-quote-pic); -webkit-mask-repeat: no-repeat; mask-repeat: no-repeat; }