1
0
mirror of https://github.com/privacyguides/privacyguides.org.git synced 2025-07-01 09:12:39 +00:00
Files
privacyguides.org/docs/meta/admonitions.md
redoomed1 06d2f0e3e1 style!: Make minor changes across recommendation pages for consistency (#2972)
- Grammar, Style, and Wording Changes
  - Remove commas where pauses or breaks in reading may not be needed
  - Reduce instances of comma splices by replacing commas with
    semicolons or em dashes where appropriate
  - Spell out abbreviations like E2EE for the first instance of the term
    on the page, then use the abbreviation for the subsequent instances
  - Add line breaks in card descriptions for a cleaner look,
    particularly for mentions of an accompanying blog review of a tool
  - Move more technical information from recommendation blurb to the
    description under the card
  - Format quotations from audits as block quotes
  - Standardize syntax for tooltips
  - Arrange download links according to the widely used order
    - Mobile app stores > alternative distribution methods (e.g.,
      GitHub) > developer-owned or -operated F-Droid repositories >>
      desktop platforms > Flathub >> browsers >> web
  - Shorten Chrome extension links
  - Standardize icon for web download links
  - For "Repository" buttons, embed direct links to project's Readme to
    differentiate them from "Source Code" links

- Other Changes
  - Add GitHub releases link for IVPN
  - Mention CryptPad's official public instance and add link to list of
    public instances
  - Replace current link to Miniflux docs with a direct link to the end
    user docs
  - Update version of Newsboat documentation link
  - Update and reword guidance on finding YouTube channel code for RSS feed
  - Remove F-Droid download link for Stingle since it is not owned by
    the developer or dev team

Signed-off-by: Jonah Aragon <jonah@privacyguides.org>
Signed-off-by: fria <fria@privacyguides.org>
Signed-off-by: Daniel Gray <dngray@privacyguides.org>
2025-05-15 21:10:42 +09:30

8.6 KiB

title, description
title description
Admonitions A guide for website contributors on creating admonitions.

Admonitions (or "call-outs") are tools that writers can use to include side content in an article without interrupting the document flow.

Example Admonition

This is an example of an admonition. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla et euismod nulla. Curabitur feugiat, tortor non consequat finibus, justo purus auctor massa, nec semper lorem quam in massa.

Example Collapsible Admonition

This is an example of a collapsible admonition. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla et euismod nulla. Curabitur feugiat, tortor non consequat finibus, justo purus auctor massa, nec semper lorem quam in massa.

Formatting

To add an admonition to a page, you can use the following code:

<div class="admonition TYPE" markdown>
<p class="admonition-title">TITLE</p>

ENCLOSED TEXT

</div>
<details class="TYPE" markdown>
<summary>TITLE</summary>

ENCLOSED TEXT

</details>

The TITLE must be specified; if you don't want a specific title you can set it to the same text as the TYPE (see below) in title case, e.g. Note. The ENCLOSED TEXT should be Markdown formatted.

Regular types

Replace TYPE in the examples above with one of the following:

note

Note

Lorem ipsum dolor sit amet, consectetur adipiscing elit.

abstract

Abstract

Lorem ipsum dolor sit amet, consectetur adipiscing elit.

info

Info

Lorem ipsum dolor sit amet, consectetur adipiscing elit.

tip

Tip

Lorem ipsum dolor sit amet, consectetur adipiscing elit.

success

Success

Lorem ipsum dolor sit amet, consectetur adipiscing elit.

question

Question

Lorem ipsum dolor sit amet, consectetur adipiscing elit.

warning

Warning

Lorem ipsum dolor sit amet, consectetur adipiscing elit.

failure

Failure

Lorem ipsum dolor sit amet, consectetur adipiscing elit.

danger

Danger

Lorem ipsum dolor sit amet, consectetur adipiscing elit.

bug

Bug

Lorem ipsum dolor sit amet, consectetur adipiscing elit.

example

Example

Lorem ipsum dolor sit amet, consectetur adipiscing elit.

quote

Quote

Lorem ipsum dolor sit amet, consectetur adipiscing elit.

Special Types

recommendation

This format is used to generate recommendation cards. Notably it is missing the <p class="admonition-title"> element.

<div class="admonition recommendation" markdown>

![PhotoPrism logo](assets/img/photo-management/photoprism.svg){ align=right }

**PhotoPrism** is a self-hostable platform for managing photos. It supports album syncing and sharing as well as a variety of other [features](https://photoprism.app/features). It does not include end-to-end encryption, so it's best hosted on a server that you trust and is under your control.

[:octicons-home-16: Homepage](https://photoprism.app){ .md-button .md-button--primary }
[:octicons-eye-16:](https://photoprism.app/privacy){ .card-link title="Privacy Policy" }
[:octicons-info-16:](https://photoprism.app/kb){ .card-link title="Documentation" }
[:octicons-code-16:](https://github.com/photoprism){ .card-link title="Source Code" }

<details class="downloads" markdown>
<summary>Downloads</summary>

- [:simple-github: GitHub](https://github.com/photoprism)

</details>

</div>

PhotoPrism logo{ align=right }

PhotoPrism is a self-hostable platform for managing photos. It supports album syncing and sharing as well as a variety of other features. It does not include end-to-end encryption, so it's best hosted on a server that you trust and is under your control.

:octicons-home-16: Homepage{ .md-button .md-button--primary } :octicons-eye-16:{ .card-link title="Privacy Policy" } :octicons-info-16:{ .card-link title="Documentation" } :octicons-code-16:{ .card-link title="Source Code" }

Downloads

downloads

This is a special type of collapsible admonition which is used to generate sections containing download links. It is only used within recommendation cards, as shown in the example above.

<details class="downloads" markdown>
<summary>Downloads</summary>

- [:simple-googleplay: Google Play](https://play.google.com/store/apps/details?id=ch.protonmail.android)
- [:simple-appstore: App Store](https://apps.apple.com/app/id979659905)
- [:simple-github: GitHub](https://github.com/ProtonMail/android-mail/releases)
- [:fontawesome-brands-windows: Windows](https://proton.me/mail/bridge#download)
- [:simple-apple: macOS](https://proton.me/mail/bridge#download)
- [:simple-linux: Linux](https://proton.me/mail/bridge#download)
- [:octicons-browser-16: Web](https://mail.proton.me)

</details>

Old Format

Throughout the site, you may see some admonitions formatted like the following examples:

!!! note

    Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla et euismod
    nulla. Curabitur feugiat, tortor non consequat finibus, justo purus auctor
    massa, nec semper lorem quam in massa.

Note

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla et euismod nulla. Curabitur feugiat, tortor non consequat finibus, justo purus auctor massa, nec semper lorem quam in massa.

??? example "Custom Title"

    Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla et euismod
    nulla. Curabitur feugiat, tortor non consequat finibus, justo purus auctor
    massa, nec semper lorem quam in massa.
Custom Title

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla et euismod nulla. Curabitur feugiat, tortor non consequat finibus, justo purus auctor massa, nec semper lorem quam in massa.

This format is no longer used going forward because it is incompatible with newer versions of our translation software at Crowdin. When adding a new page to the site, only the newer, HTML-based format should be used.

There is no rush to convert admonitions with the old format to the new format. Pages currently using this formatting should continue to work, but we will be updating them to use the newer, HTML-based format above over time as we continue to update the site.