website: add a better edit this page element (#13391)
website/docs: Flesh out contributor footer. Co-authored-by: Teffen Ellis <teffen@nirri.us>
This commit is contained in:
		| @ -102,6 +102,7 @@ const createConfig = (): Config => { | ||||
|                     docs: { | ||||
|                         id: "docs", | ||||
|                         sidebarPath: "./sidebars.js", | ||||
|                         showLastUpdateTime: true, | ||||
|                         editUrl: | ||||
|                             "https://github.com/goauthentik/authentik/edit/main/website/", | ||||
|                         docItemComponent: "@theme/ApiItem", | ||||
|  | ||||
							
								
								
									
										124
									
								
								website/src/theme/EditMetaRow/index.tsx
									
									
									
									
									
										Normal file
									
								
							
							
						
						
									
										124
									
								
								website/src/theme/EditMetaRow/index.tsx
									
									
									
									
									
										Normal file
									
								
							| @ -0,0 +1,124 @@ | ||||
| import React, { type ReactNode } from "react"; | ||||
| import clsx from "clsx"; | ||||
| import EditThisPage from "@theme/EditThisPage"; | ||||
| import type { Props } from "@theme/EditMetaRow"; | ||||
|  | ||||
| import LastUpdated from "@theme/LastUpdated"; | ||||
| import Admonition from "@theme/Admonition"; | ||||
| import styles from "./styles.module.css"; | ||||
| import Translate from "@docusaurus/Translate"; | ||||
| import IconNote from "@theme/Admonition/Icon/Note"; | ||||
|  | ||||
| const EditMetaRow: React.FC<Props> = ({ | ||||
|     className, | ||||
|     editUrl, | ||||
|     lastUpdatedAt, | ||||
|     lastUpdatedBy, | ||||
| }: Props) => { | ||||
|     return ( | ||||
|         <> | ||||
|             <hr className={styles.divider} /> | ||||
|  | ||||
|             <Admonition | ||||
|                 className={clsx(styles.admonitionContrib, className)} | ||||
|                 icon={<IconNote className={styles.contribIcon} />} | ||||
|                 title={ | ||||
|                     <span className={styles.headerContent}> | ||||
|                         Help us improve this content | ||||
|                     </span> | ||||
|                 } | ||||
|                 type="info" | ||||
|             > | ||||
|                 <p> | ||||
|                     <Translate | ||||
|                         id="theme.common.contributor.footerDescription1" | ||||
|                         description="The initial description for the contribution footer" | ||||
|                     > | ||||
|                         Documentation for authentik is made possible by | ||||
|                         contributors like you! | ||||
|                     </Translate> | ||||
|                 </p> | ||||
|  | ||||
|                 <p> | ||||
|                     <Translate | ||||
|                         id="theme.common.contributor.footerDescription2" | ||||
|                         description="The initial description for the contribution footer" | ||||
|                     > | ||||
|                         You can help us improve this page, or let us know about | ||||
|                         an issue by opening a pull request on GitHub. | ||||
|                     </Translate> | ||||
|                 </p> | ||||
|  | ||||
|                 <div className="row"> | ||||
|                     <div className="col col--12"> | ||||
|                         <ul> | ||||
|                             {editUrl && ( | ||||
|                                 <li> | ||||
|                                     <EditThisPage editUrl={editUrl} /> | ||||
|                                 </li> | ||||
|                             )} | ||||
|  | ||||
|                             <li> | ||||
|                                 <a | ||||
|                                     href="https://docs.goauthentik.io/docs/developer-docs/" | ||||
|                                     target="_blank" | ||||
|                                     rel="noreferrer noopener" | ||||
|                                 > | ||||
|                                     <Translate | ||||
|                                         id="theme.common.contributor.howToContribute" | ||||
|                                         description="The link label to the contribution guide" | ||||
|                                     > | ||||
|                                         Contributor Guide | ||||
|                                     </Translate> | ||||
|                                 </a> | ||||
|                             </li> | ||||
|  | ||||
|                             <li> | ||||
|                                 <a | ||||
|                                     href="https://github.com/goauthentik/authentik/issues/new/choose" | ||||
|                                     target="_blank" | ||||
|                                     rel="noreferrer noopener" | ||||
|                                 > | ||||
|                                     <Translate | ||||
|                                         id="theme.common.contributor.createAnIssue" | ||||
|                                         description="The link label to report a documentation issue" | ||||
|                                     > | ||||
|                                         Open an issue | ||||
|                                     </Translate> | ||||
|                                 </a> | ||||
|                             </li> | ||||
|  | ||||
|                             <li> | ||||
|                                 <a | ||||
|                                     href="https://goauthentik.io/pricing/" | ||||
|                                     target="_blank" | ||||
|                                     rel="noreferrer noopener" | ||||
|                                 > | ||||
|                                     <Translate | ||||
|                                         id="theme.common.contributor.getSupport" | ||||
|                                         description="The link label to request support" | ||||
|                                     > | ||||
|                                         Get Enterprise Support | ||||
|                                     </Translate> | ||||
|                                 </a> | ||||
|                             </li> | ||||
|                         </ul> | ||||
|                     </div> | ||||
|                 </div> | ||||
|             </Admonition> | ||||
|  | ||||
|             <div className="row"> | ||||
|                 <div className={clsx("col", styles.lastUpdated)}> | ||||
|                     {(lastUpdatedAt || lastUpdatedBy) && ( | ||||
|                         <LastUpdated | ||||
|                             lastUpdatedAt={lastUpdatedAt} | ||||
|                             lastUpdatedBy={lastUpdatedBy} | ||||
|                         /> | ||||
|                     )} | ||||
|                 </div> | ||||
|             </div> | ||||
|         </> | ||||
|     ); | ||||
| }; | ||||
|  | ||||
| export default EditMetaRow; | ||||
							
								
								
									
										62
									
								
								website/src/theme/EditMetaRow/styles.module.css
									
									
									
									
									
										Normal file
									
								
							
							
						
						
									
										62
									
								
								website/src/theme/EditMetaRow/styles.module.css
									
									
									
									
									
										Normal file
									
								
							| @ -0,0 +1,62 @@ | ||||
| .lastUpdated { | ||||
|     font-size: smaller; | ||||
|     font-style: italic; | ||||
|     margin-top: 0.2rem; | ||||
|     align-self: end; | ||||
| } | ||||
|  | ||||
| .divider { | ||||
|     margin-block: calc(var(--ifm-spacing-horizontal) * 1.5); | ||||
|     margin-inline: var(--ifm-spacing-vertical); | ||||
| } | ||||
|  | ||||
| @media (min-width: 997px) { | ||||
|     .lastUpdated { | ||||
|         text-align: right; | ||||
|     } | ||||
| } | ||||
|  | ||||
| .headerContent { | ||||
|     text-transform: none; | ||||
| } | ||||
|  | ||||
| .admonitionContrib { | ||||
|     --ifm-h5-font-size: 1.25rem; | ||||
|  | ||||
|     display: block; | ||||
|  | ||||
|     @media (min-width: 768px) { | ||||
|         --ifm-h5-font-size: 1.5rem; | ||||
|         --ifm-paragraph-margin-bottom: 0; | ||||
|  | ||||
|         p:first-child { | ||||
|             margin-top: 0.75em; | ||||
|         } | ||||
|  | ||||
|         ul { | ||||
|             --ifm-spacing-horizontal: 0.5rem; | ||||
|  | ||||
|             display: flex; | ||||
|             gap: var(--ifm-spacing-horizontal); | ||||
|             justify-content: center; | ||||
|             margin: calc(var(--ifm-spacing-horizontal) * 2) 0 | ||||
|                 var(--ifm-spacing-horizontal); | ||||
|             padding: 0; | ||||
|         } | ||||
|  | ||||
|         li { | ||||
|             vertical-align: middle; | ||||
|             display: flex; | ||||
|             align-items: center; | ||||
|         } | ||||
|  | ||||
|         li:not(:first-child)::before { | ||||
|             display: inline-block; | ||||
|             content: "•"; | ||||
|             list-style-type: "•"; | ||||
|             font-size: 1em; | ||||
|             opacity: 0.75; | ||||
|             margin-inline-end: var(--ifm-spacing-horizontal); | ||||
|         } | ||||
|     } | ||||
| } | ||||
							
								
								
									
										21
									
								
								website/src/theme/EditThisPage/index.tsx
									
									
									
									
									
										Normal file
									
								
							
							
						
						
									
										21
									
								
								website/src/theme/EditThisPage/index.tsx
									
									
									
									
									
										Normal file
									
								
							| @ -0,0 +1,21 @@ | ||||
| import React, { type ReactNode } from "react"; | ||||
| import Translate from "@docusaurus/Translate"; | ||||
| import { ThemeClassNames } from "@docusaurus/theme-common"; | ||||
| import Link from "@docusaurus/Link"; | ||||
| import type { Props } from "@theme/EditThisPage"; | ||||
|  | ||||
| export default function EditThisPage({ editUrl }: Props): ReactNode { | ||||
|     return ( | ||||
|         <Link to={editUrl} className={ThemeClassNames.common.editThisPage}> | ||||
|             <Translate | ||||
|                 id="theme.common.editThisPage" | ||||
|                 values={{ | ||||
|                     github: <strong>GitHub</strong>, | ||||
|                 }} | ||||
|                 description="The link label to edit the current page" | ||||
|             > | ||||
|                 {"Edit on {github}"} | ||||
|             </Translate> | ||||
|         </Link> | ||||
|     ); | ||||
| } | ||||
		Reference in New Issue
	
	Block a user
	 Jens L.
					Jens L.