Improve headings structure (#1883)

The content of the SCM-Manager should be made accessible and usable in a sensibly structured way so that web content is easy to use for ever user.

scm-ui/ui-components/src/layout/SubSubtitle.tsx

@@ -0,0 +1,41 @@
+/*
+ * MIT License
+ *
+ * Copyright (c) 2020-present Cloudogu GmbH and Contributors
+ *
+ * Permission is hereby granted, free of charge, to any person obtaining a copy
+ * of this software and associated documentation files (the "Software"), to deal
+ * in the Software without restriction, including without limitation the rights
+ * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+ * copies of the Software, and to permit persons to whom the Software is
+ * furnished to do so, subject to the following conditions:
+ *
+ * The above copyright notice and this permission notice shall be included in all
+ * copies or substantial portions of the Software.
+ *
+ * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+ * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+ * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+ * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+ * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+ * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+ * SOFTWARE.
+ */
+import React from "react";
+import classNames from "classnames";
+
+type Props = {
+  className?: string;
+};
+
+class SubSubtitle extends React.Component<Props> {
+  render() {
+    const { className, children } = this.props;
+    if (children) {
+      return <h3 className={classNames("is-size-5", className)}>{children}</h3>;
+    }
+    return null;
+  }
+}
+
+export default SubSubtitle;

scm-ui/ui-components/src/layout/index.ts

@@ -29,8 +29,9 @@ export { default as Header } from "./Header";
 export { default as Level } from "./Level";
 export { default as Page } from "./Page";
 export { default as PageActions } from "./PageActions";
-export { default as Subtitle } from "./Subtitle";
 export { default as Title } from "./Title";
+export { default as Subtitle } from "./Subtitle";
+export { default as SubSubtitle } from "./SubSubtitle";
 export { default as CustomQueryFlexWrappedColumns } from "./CustomQueryFlexWrappedColumns";
 export { default as PrimaryContentColumn } from "./PrimaryContentColumn";
 export { default as SecondaryNavigationColumn } from "./SecondaryNavigationColumn";