olivegroup-gamified1
Version:
sample des
196 lines (191 loc) • 7.98 kB
JavaScript
import React, { Component } from 'react';
// import AddNewSection from '../components/AddNewSection';
// import PathwayMap from '../components/PathwayMap';
// import PathwayTree from '../components/PathwayTree';
class LeftContents extends Component {
render() {
return (
<>
<div className="d-flex justify-content-between tree-title p-3">
<span>Beginer - Figma Basic</span>
<span>
<svg
width="18"
height="18"
viewBox="0 0 18 18"
fill="none"
xmlns="http://www.w3.org/2000/svg"
>
<path
d="M15 10.995V15a1.5 1.5 0 0 1-1.5 1.5H3A1.5 1.5 0 0 1 1.5 15V4.5A1.5 1.5 0 0 1 3 3h4.005"
stroke="#fff"
stroke-width="2"
stroke-linecap="round"
stroke-linejoin="round"
/>
<path
d="m13.5 1.5 3 3L9 12H6V9l7.5-7.5z"
stroke="#fff"
stroke-width="2"
stroke-linecap="round"
stroke-linejoin="round"
/>
</svg>
</span>
</div>
{/* <div className="d-flex justify-content-center align-items-center h-100">
<AddNewSection />
</div> */}
{/* <PathwayMap /> */}
{/* <PathwayTree /> */}
<div className="tree">
<ul>
<li>
<div className="box active">
<svg
xmlns="http://www.w3.org/2000/svg"
width="16"
height="16"
fill="currentColor"
class="bi bi-square"
viewBox="0 0 16 16"
>
<path d="M14 1a1 1 0 0 1 1 1v12a1 1 0 0 1-1 1H2a1 1 0 0 1-1-1V2a1 1 0 0 1 1-1h12zM2 0a2 2 0 0 0-2 2v12a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V2a2 2 0 0 0-2-2H2z" />
</svg>{' '}
<a href="#">
<strong>C1</strong> - Cyber & Data Protection{' '}
</a>
</div>
<ul>
<li>
<div className="box">
<svg
xmlns="http://www.w3.org/2000/svg"
width="16"
height="16"
fill="currentColor"
class="bi bi-square"
viewBox="0 0 16 16"
>
<path d="M14 1a1 1 0 0 1 1 1v12a1 1 0 0 1-1 1H2a1 1 0 0 1-1-1V2a1 1 0 0 1 1-1h12zM2 0a2 2 0 0 0-2 2v12a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V2a2 2 0 0 0-2-2H2z" />
</svg>{' '}
<a href="#">
<strong>C1</strong> - Cyber & Data Protection{' '}
</a>
</div>
<ul>
<li>
<div className="box">
<svg
xmlns="http://www.w3.org/2000/svg"
width="16"
height="16"
fill="currentColor"
class="bi bi-square"
viewBox="0 0 16 16"
>
<path d="M14 1a1 1 0 0 1 1 1v12a1 1 0 0 1-1 1H2a1 1 0 0 1-1-1V2a1 1 0 0 1 1-1h12zM2 0a2 2 0 0 0-2 2v12a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V2a2 2 0 0 0-2-2H2z" />
</svg>{' '}
<a href="#">
<strong>C1</strong> - Cyber & Data Protection{' '}
</a>
</div>
<ul>
<li>
<div className="box">
<svg
xmlns="http://www.w3.org/2000/svg"
width="16"
height="16"
fill="currentColor"
class="bi bi-square"
viewBox="0 0 16 16"
>
<path d="M14 1a1 1 0 0 1 1 1v12a1 1 0 0 1-1 1H2a1 1 0 0 1-1-1V2a1 1 0 0 1 1-1h12zM2 0a2 2 0 0 0-2 2v12a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V2a2 2 0 0 0-2-2H2z" />
</svg>{' '}
<a href="#">
<strong>C1</strong> - Cyber & Data Protection{' '}
</a>
</div>
</li>
</ul>
</li>
<li>
<div className="box">
<svg
xmlns="http://www.w3.org/2000/svg"
width="16"
height="16"
fill="currentColor"
class="bi bi-square"
viewBox="0 0 16 16"
>
<path d="M14 1a1 1 0 0 1 1 1v12a1 1 0 0 1-1 1H2a1 1 0 0 1-1-1V2a1 1 0 0 1 1-1h12zM2 0a2 2 0 0 0-2 2v12a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V2a2 2 0 0 0-2-2H2z" />
</svg>{' '}
<a href="#">
<strong>C1</strong> - Cyber & Data Protection{' '}
</a>
</div>
</li>
<li>
<div className="box">
<svg
xmlns="http://www.w3.org/2000/svg"
width="16"
height="16"
fill="currentColor"
class="bi bi-square"
viewBox="0 0 16 16"
>
<path d="M14 1a1 1 0 0 1 1 1v12a1 1 0 0 1-1 1H2a1 1 0 0 1-1-1V2a1 1 0 0 1 1-1h12zM2 0a2 2 0 0 0-2 2v12a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V2a2 2 0 0 0-2-2H2z" />
</svg>{' '}
<a href="#">
<strong>C1</strong> - Cyber & Data Protection{' '}
</a>
</div>
</li>
<li>
<div className="box">
<svg
xmlns="http://www.w3.org/2000/svg"
width="16"
height="16"
fill="currentColor"
class="bi bi-square"
viewBox="0 0 16 16"
>
<path d="M14 1a1 1 0 0 1 1 1v12a1 1 0 0 1-1 1H2a1 1 0 0 1-1-1V2a1 1 0 0 1 1-1h12zM2 0a2 2 0 0 0-2 2v12a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V2a2 2 0 0 0-2-2H2z" />
</svg>{' '}
<a href="#">
<strong>C1</strong> - Cyber & Data Protection{' '}
</a>
</div>
</li>
</ul>
</li>
<li>
<div className="box">
<svg
xmlns="http://www.w3.org/2000/svg"
width="16"
height="16"
fill="currentColor"
class="bi bi-square"
viewBox="0 0 16 16"
>
<path d="M14 1a1 1 0 0 1 1 1v12a1 1 0 0 1-1 1H2a1 1 0 0 1-1-1V2a1 1 0 0 1 1-1h12zM2 0a2 2 0 0 0-2 2v12a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V2a2 2 0 0 0-2-2H2z" />
</svg>{' '}
<a href="#">
<strong>C1</strong> - Cyber & Data Protection{' '}
</a>
</div>
</li>
</ul>
</li>
</ul>
</div>
</>
);
}
}
export default LeftContents;