TamperMonkey script for making GitHub's and Codeberg's `<details>` tags better

codeberg-details-tags.user.js

// ==UserScript==
// @name        Codeberg <details> tags
// @namespace   https://codeberg.org/waffle
// @include     https://codeberg.org/*
// @grant       GM_addStyle
// @version     1.0.0
// @author      waffle
// @description Makes Codeberg's <details> tags look better
// ==/UserScript==

const css = `
.markdown details {
	border: 2px solid var(--color-info-border);
	border-radius: 4px;
	padding: .5em .5em 0;
}

.markdown summary {
	font-weight: bold;
	margin: -.5em -.5em 0;
	padding: .5em;
	background-color: var(--color-info-border);
}

.markdown details[open] summary {
	border-bottom: 2px solid var(--color-info-border);
	margin-bottom: .5em;
}

.markdown details[open] p {
	margin-bottom: .25em;
}
`
GM_addStyle(css)

github-details-tags.user.js

// ==UserScript==
// @name        GitHub <details> tags
// @namespace   https://github.com/wafflecoffee
// @include     https://github.com/*
// @include     https://gist.github.com/*
// @grant       GM_addStyle
// @version     1.0.0
// @author      wafflecoffee
// @description Makes GitHub's <details> tags look better
// @homepageURL https://github.com/orgs/community/discussions/32028
// ==/UserScript==

const css = `
.markdown-body details {
	border: 2px solid var(--color-border-default);
	border-radius: 4px;
	padding: .5em .5em 0;
}

.markdown-body summary {
	font-weight: bold;
	margin: -.5em -.5em 0;
	padding: .5em;
	background-color: var(--color-border-default);
}

.markdown-body details[open] summary {
	border-bottom: 2px solid var(--color-border-default);
	margin-bottom: .5em;
}

.markdown-body details[open] p {
	margin-bottom: .25em;
}
`
GM_addStyle(css)