diff --git a/.eleventy.js b/.eleventy.js index 537b9b6..7409a7d 100644 --- a/.eleventy.js +++ b/.eleventy.js @@ -40,6 +40,25 @@ module.exports = function(eleventyConfig) { .use(markdownItAnchor, mdAnchorOpts) ) + eleventyConfig.addPairedShortcode("admonition", function(content, type, title) { + let titleStr = ""; + if(title) { + titleStr = title; + } else if(type) { + titleStr = type.substring(0, 1).toUpperCase() + type.substring(1).toLowerCase(); + } else { + titleStr = "Info"; + } + + return `
+
+ + ${titleStr} +
+
${content}
+
` + }); + return { dir: { input: "content" diff --git a/assets/css/codeberg-docs.css b/assets/css/codeberg-docs.css index ce48388..9f03a0b 100644 --- a/assets/css/codeberg-docs.css +++ b/assets/css/codeberg-docs.css @@ -1,3 +1,25 @@ +:root{ + --admonition-background-color--info: rgba(68, 138, 255, 0.2); + --admonition-background-color--note: rgba(0, 184, 212, 0.2); + --admonition-background-color--warning: rgba(255, 145, 0, 0.2); + --admonition-background-color--tip: rgba(0, 191, 165, 0.2); + --admonition-background-color--question: rgba(100, 221, 23, 0.2); + + --admonition-border-color--info: rgb(68, 138, 255); + --admonition-border-color--note: rgb(0, 184, 212); + --admonition-border-color--warning: rgb(255, 145, 0); + --admonition-border-color--tip: rgb(0, 191, 165); + --admonition-border-color--question: rgb(100, 221, 23); + + --admonition-icon--info: url('data:image/svg+xml;charset=utf-8,'); + --admonition-icon--note: url('data:image/svg+xml;charset=utf-8,'); + --admonition-icon--warning: url('data:image/svg+xml;charset=utf-8,'); + --admonition-icon--tip: url('data:image/svg+xml;charset=utf-8,'); + --admonition-icon--question: url('data:image/svg+xml;charset=utf-8,'); + + --admonition-icon-dimension: 20px; +} + .content :not(img, pre) { max-width: 80ch; } .content img { border: 5px solid rgba(0, 0, 0, 0.2); max-width: 100%; } .content blockquote { margin: 0; } @@ -49,3 +71,94 @@ code:not(pre > code) { border-color: var(--dm-code-border-color); } +/* Custom Admonition boxes */ + +.admonition { + background-color: var(--admonition-background-color--info); + border: .2rem solid var(--admonition-border-color--info); + border-radius: .3rem; + + border-left-width: .5rem; + + padding: 1em 1.5em; +} + +.admonition-title { + font-weight: bold; + font-size: 1.2em; +} + +.admonition-icon::before { + content: ""; + + background-color: var(--admonition-border-color--info); + + mask-position: center; + mask-repeat: no-repeat; + mask-size: contain; + mask-image: var(--admonition-icon--info); + + -webkit-mask-position: center; + -webkit-mask-repeat: no-repeat; + -webkit-mask-size: contain; + -webkit-mask-image: var(--admonition-icon--info); + + display: inline-block; + margin-right: .4em; + vertical-align: bottom; + + height: 1.5em; + width: 1.5em; +} + +.admonition.note { + background-color: var(--admonition-background-color--note); + border-color: var(--admonition-border-color--note); +} + +.admonition-icon.note::before { + background-color: var(--admonition-border-color--note); + + mask-image: var(--admonition-icon--note); + -webkit-mask-image: var(--admonition-icon--note); +} + +.admonition.warning { + background-color: var(--admonition-background-color--warning); + border-color: var(--admonition-border-color--warning); +} + +.admonition-icon.warning::before { + background-color: var(--admonition-border-color--warning); + + mask-image: var(--admonition-icon--warning); + -webkit-mask-image: var(--admonition-icon--warning); +} + +.admonition.tip { + background-color: var(--admonition-background-color--tip); + border-color: var(--admonition-border-color--tip); +} + +.admonition-icon.tip::before { + background-color: var(--admonition-border-color--tip); + + mask-image: var(--admonition-icon--tip); + -webkit-mask-image: var(--admonition-icon--tip); +} + +.admonition.question { + background-color: var(--admonition-background-color--question); + border-color: var(--admonition-border-color--question); +} + +.admonition-icon.question::before { + background-color: var(--admonition-border-color--question); + + mask-image: var(--admonition-icon--question); + -webkit-mask-image: var(--admonition-icon--question); +} + +.admonition-content > *:last-child { + margin-bottom: 0; +} \ No newline at end of file diff --git a/content/codeberg-pages/using-custom-domain.md b/content/codeberg-pages/using-custom-domain.md index 1617906..621d539 100644 --- a/content/codeberg-pages/using-custom-domain.md +++ b/content/codeberg-pages/using-custom-domain.md @@ -8,7 +8,7 @@ eleventyNavigation: Instead of using the `codeberg.page` Domain, you can also purchase your own domain from your internet service provider of your choice and configure it to serve content from Codeberg Page. -> **Currently known pitfalls for failed certificates:** +> **Currently known pitfalls for failed certificates:**
> - you must either not have a [CAA record](https://en.wikipedia.org/wiki/DNS_Certification_Authority_Authorization#Record), or explicitly allow [LetsEncrypt](https://letsencrypt.org) there For custom domains, two things are required: @@ -23,7 +23,7 @@ For custom domains, two things are required:
-> **Why do I need all these DNS records?**
+> **Why do I need all these DNS records?**
> To understand how the Pages Server serves content, you need to know that a user browsing your custom domain just sends "Hey, I want to see `yourdomain.com`" to the server. But the server might not know, that it is responsible for `yourdomain.com` and it cannot just server all domains in the world. So to find out if the server is responsible for `yourdomain.com` it will check the DNS entries of `yourdomain.com`. If it returns something with `codeberg.page` (according to the domain schemes mentioned below) then it knows, which respository to check for the `.domains` file and your content. ## Setting the DNS record @@ -74,7 +74,7 @@ The easiest and recommended way is to just setup a CNAME record for your domain,
-> **⚠️ Caution**
+> **⚠️ Caution**
> With a CNAME record everything on this domain is delegated to codeberg.page, which means you cannot setup your own e-mail adress with this method. If you need e-mail or others services, you have to use one of the remaining options. **Option 2: ALIAS record** @@ -228,7 +228,7 @@ For the DNS configuration: In this case, we want our *Project* pages available at the URL `https://example.com`. -> Note: this would be incompatible with using the apex `example.com` for other purposes, e.g. for the *Personal*/*Organization* example discussed before. +> Note: This would be incompatible with using the apex `example.com` for other purposes, e.g. for the *Personal*/*Organization* example discussed before. The `.domains` file contains the following: diff --git a/content/getting-started/first-repository.md b/content/getting-started/first-repository.md index cdb5c97..c4a6c40 100644 --- a/content/getting-started/first-repository.md +++ b/content/getting-started/first-repository.md @@ -11,6 +11,7 @@ Almost everything on Codeberg happens in a repository. Think of a repository as This article will guide you through creating your first repository on Codeberg, connecting your local development environment and making your first commit. ## Creating a Repository + > A note to more advanced users: It's currently not possible to use Push-to-Create to push a fresh repository onto Codeberg. To create a new repository, you need be logged in to your account on Codeberg.org. @@ -141,7 +142,7 @@ knut@iceberg:~/my-project$ git remote add origin https://codeberg.org/knut/fooba If all is done correctly, this command should output nothing. -> **Errors:** +> **Errors**
> If you added an already initalized remote repository and try to push, you will get an error, if your local commit history is different from the history of the remote. You have some choices to resolve the conflict: > - Merge your changes with the ones in the remote `git pull` > - If you are sure, that you want to overwrite all changes in the remote, you can force push with `git -f push` diff --git a/content/getting-started/first-steps.md b/content/getting-started/first-steps.md index be0a0d2..92c733e 100644 --- a/content/getting-started/first-steps.md +++ b/content/getting-started/first-steps.md @@ -56,7 +56,6 @@ your security. > Please visit the [guide in the security section](/security/2fa) to learn how to set up 2FA. - ## Moving on from here Now that you have an account on Codeberg, you can choose from a number of possible ways to explore: diff --git a/content/getting-started/install-git.md b/content/getting-started/install-git.md index b4b6768..85748db 100644 --- a/content/getting-started/install-git.md +++ b/content/getting-started/install-git.md @@ -106,6 +106,7 @@ git update-git-for-windows After that, just follow the instructions in the terminal to update to the latest version. Alternatively, you can download the installer from the Git website as explained above. + > Make sure that you run the new installer with the same permissions (Administrator or standard user) as the original installation. If not, it will be installed twice and that will create a mess. If you want to keep all your previous settings, simply tick the box `Only show new options` in the setup wizard (see screenshots above). diff --git a/content/improving-documentation/style-guide.md b/content/improving-documentation/style-guide.md index c468ef2..3b3101e 100644 --- a/content/improving-documentation/style-guide.md +++ b/content/improving-documentation/style-guide.md @@ -157,17 +157,52 @@ Favor “self-contained information units” over interconnected information uni ### Notes and warnings -Keep notes and warnings outside the body of your running text. Use appropriate Markdown syntax to display notes and warnings, e.g. using the following markdown syntax: +Keep notes and warnings outside the body of your running text. Use admonition boxes, also known as callouts, to show said information. -```markdown -> **Note:** -> Always write the names of measurement units in lowercase letters, i.e. use “watt” instead of “Watt”. +The syntax is as follows: ``` +{% raw %} +{% admonition "type" "title [optional]" %} -which will be rendered as: +Content -> **Note:** -> Always write the names of measurement units in lowercase letters, i.e. use “watt” instead of “Watt”. +{% endadmonition %} +{% endraw %} +``` +If no title is provided will the admonition box default to the type being used as title.
+Note the gaps between the content and the start and end tag. These are required to allow markdown to be rendered. + +The following admonition types are currently available: + +{% admonition "info" %} + +Default type used should no type or an invalid one be provided. Should be used to give short and useful information to know about. + +{% endadmonition %} + +{% admonition "note" %} + +Can be used to provide short snippets of information. + +{% endadmonition %} + +{% admonition "warning" %} + +Use to indicate possible issues and problems, or known pitfalls a user should look out for. + +{% endadmonition %} + +{% admonition "tip" %} + +Can be used to give suggestions and hints to a user. + +{% endadmonition %} + +{% admonition "question" %} + +Use to show and answer a question the user may ask in this situation. + +{% endadmonition %} ### Topic typology