compact keysanity tracker

[alttp.git] / resources / js / components / techniques / List.js

diff --git a/resources/js/components/techniques/List.js b/resources/js/components/techniques/List.js
index 58f0eaef254a5c10ba118b92e5b471f8e5e31389..aa80836c562098cefc3e5303ed8466b2bafcb941 100644 (file)
--- a/resources/js/components/techniques/List.js
+++ b/resources/js/components/techniques/List.js
@@ -2,6 +2,7 @@ import PropTypes from 'prop-types';
 import React from 'react';
 import { Link } from 'react-router-dom';
 
+import Rulesets from './Rulesets';
 import {
        getLink,
        getTranslation,
@@ -10,13 +11,18 @@ import i18n from '../../i18n';
 
 const List = ({ techniques }) => <ul className="tech-list">
        {techniques.map(tech =>
-               <li key={tech.id}>
-                       <h2>
-                               <Link to={getLink(tech)}>
-                                       {getTranslation(tech, 'title', i18n.language)}
-                               </Link>
-                       </h2>
-                       <p>{getTranslation(tech, 'short', i18n.language)}</p>
+               <li className="d-flex align-items-start justify-content-between" key={tech.id}>
+                       <div>
+                               <h2>
+                                       <Link to={getLink(tech)}>
+                                               {getTranslation(tech, 'title', i18n.language)}
+                                       </Link>
+                               </h2>
+                               <p>{getTranslation(tech, 'short', i18n.language)}</p>
+                       </div>
+                       {tech.rulesets ?
+                               <Rulesets technique={tech} />
+                       : null}
                </li>
        )}
 </ul>;