mirror of
https://github.com/phuoc-ng/csslayout.git
synced 2025-08-12 00:54:45 +02:00
Add heading component
This commit is contained in:
@@ -1,5 +1,6 @@
|
||||
import React from 'react';
|
||||
|
||||
import Heading from '../../components/Heading';
|
||||
import DetailsLayout from '../../layouts/DetailsLayout';
|
||||
import BrowserFrame from '../../placeholders/BrowserFrame';
|
||||
import Rectangle from '../../placeholders/Rectangle';
|
||||
@@ -44,8 +45,8 @@ const Details = () => {
|
||||
`}
|
||||
/>
|
||||
</div>
|
||||
<div className="bt b--black-20 relative">
|
||||
<h3 className="absolute bg-white f4 left-2 lh-copy ma0 ph2 top-0" style={{ transform: 'translate(0px, -50%)' }}>Use cases</h3>
|
||||
<section>
|
||||
<Heading title="Use cases" />
|
||||
|
||||
<div className="pa4">
|
||||
<div className="mb4 w4 pa2 relative ba b--black-30 br2">
|
||||
@@ -67,7 +68,7 @@ const Details = () => {
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
</DetailsLayout>
|
||||
);
|
||||
};
|
||||
|
@@ -1,5 +1,6 @@
|
||||
import React, { useState } from 'react';
|
||||
|
||||
import Heading from '../../components/Heading';
|
||||
import RelatedPatterns from '../../components/RelatedPatterns';
|
||||
import DetailsLayout from '../../layouts/DetailsLayout';
|
||||
import BrowserFrame from '../../placeholders/BrowserFrame';
|
||||
@@ -56,8 +57,8 @@ const Details = () => {
|
||||
`}
|
||||
/>
|
||||
</div>
|
||||
<div className="bt b--black-20 relative">
|
||||
<h3 className="absolute bg-white f4 left-2 lh-copy ma0 ph2 top-0 ttu" style={{ transform: 'translate(0px, -50%)' }}>Use cases</h3>
|
||||
<section>
|
||||
<Heading title="Use cases" />
|
||||
|
||||
<div className="pa4">
|
||||
<div className="inline-flex br-pill bg-black-10 pa1">
|
||||
@@ -71,7 +72,7 @@ const Details = () => {
|
||||
</label>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
<RelatedPatterns patterns={['Switch']} />
|
||||
</DetailsLayout>
|
||||
);
|
||||
|
Reference in New Issue
Block a user