X-Git-Url: https://git.localhorst.tv/?a=blobdiff_plain;f=resources%2Fjs%2Fcomponents%2Ftechniques%2FDetail.js;h=665392365b40120b0c9834fa01eeb5d7d145b7d2;hb=de9be1288c2b3214e007c8d67d6b19e756cf08ba;hp=488205b2e6d68ffdd374ae93d78a5b0cfe704b6b;hpb=5b21bf8a7e7efed35389c693fcf3775d6ee3f0ec;p=alttp.git

diff --git a/resources/js/components/techniques/Detail.js b/resources/js/components/techniques/Detail.js
index 488205b..6653923 100644
--- a/resources/js/components/techniques/Detail.js
+++ b/resources/js/components/techniques/Detail.js
@@ -5,6 +5,7 @@ import { withTranslation } from 'react-i18next';
 
 import List from './List';
 import Outline from './Outline';
+import Rulesets from './Rulesets';
 import RawHTML from '../common/RawHTML';
 import {
 	getRelations,
@@ -15,7 +16,12 @@ import {
 import i18n from '../../i18n';
 
 const Detail = ({ technique }) => <Container as="article">
-	<h1>{getTranslation(technique, 'title', i18n.language)}</h1>
+	<div className="d-flex align-items-center justify-content-between">
+		<h1>{getTranslation(technique, 'title', i18n.language)}</h1>
+		{technique && technique.rulesets ?
+			<Rulesets technique={technique} />
+		: null}
+	</div>
 	<Outline technique={technique} />
 	<RawHTML html={getTranslation(technique, 'description', i18n.language)} />
 	{technique.chapters ? technique.chapters.map(chapter =>
@@ -41,6 +47,8 @@ Detail.propTypes = {
 		chapters: PropTypes.arrayOf(PropTypes.shape({
 		})),
 		description: PropTypes.string,
+		rulesets: PropTypes.shape({
+		}),
 		title: PropTypes.string,
 	}),
 };