mirror of
https://github.com/phuoc-ng/csslayout.git
synced 2025-08-07 22:56:51 +02:00
feat: Add follow block
This commit is contained in:
7
components/Follow.tsx
Normal file
7
components/Follow.tsx
Normal file
@@ -0,0 +1,7 @@
|
|||||||
|
import * as React from 'react';
|
||||||
|
|
||||||
|
export const Follow = () => (
|
||||||
|
<div className='block-follow'>
|
||||||
|
If you find this site helpful, follow me on <a href="https://twitter.com/nghuuphuoc">Twitter</a> and <a href="https://github.com/phuocng">GitHub</a> to get more useful content like this.
|
||||||
|
</div>
|
||||||
|
);
|
@@ -3,6 +3,7 @@ import Head from 'next/head';
|
|||||||
import { Heading, Spacer } from '@1milligram/design';
|
import { Heading, Spacer } from '@1milligram/design';
|
||||||
|
|
||||||
import { Ad } from '../components/Ad';
|
import { Ad } from '../components/Ad';
|
||||||
|
import { Follow } from '../components/Follow';
|
||||||
import { Pattern } from '../constants/Pattern';
|
import { Pattern } from '../constants/Pattern';
|
||||||
import { slug } from '../utils/slug';
|
import { slug } from '../utils/slug';
|
||||||
import { Layout } from './Layout';
|
import { Layout } from './Layout';
|
||||||
@@ -38,6 +39,7 @@ export const PatternLayout: React.FC<{
|
|||||||
<Spacer size="medium" />
|
<Spacer size="medium" />
|
||||||
</div>
|
</div>
|
||||||
{children}
|
{children}
|
||||||
|
<Follow />
|
||||||
<Spacer size="extraLarge" />
|
<Spacer size="extraLarge" />
|
||||||
</div>
|
</div>
|
||||||
</Layout>
|
</Layout>
|
||||||
|
11
styles/blocks/_follow.scss
Normal file
11
styles/blocks/_follow.scss
Normal file
@@ -0,0 +1,11 @@
|
|||||||
|
.block-follow {
|
||||||
|
background-color: #0465eb;
|
||||||
|
border-radius: 0.5rem;
|
||||||
|
color: #fff;
|
||||||
|
padding: 1rem;
|
||||||
|
|
||||||
|
a {
|
||||||
|
color: #fff;
|
||||||
|
text-decoration: underline;
|
||||||
|
}
|
||||||
|
}
|
@@ -5,6 +5,7 @@
|
|||||||
@import 'blocks/browser-frame';
|
@import 'blocks/browser-frame';
|
||||||
@import 'blocks/code';
|
@import 'blocks/code';
|
||||||
@import 'blocks/cover';
|
@import 'blocks/cover';
|
||||||
|
@import 'blocks/follow';
|
||||||
@import 'blocks/footer';
|
@import 'blocks/footer';
|
||||||
@import 'blocks/header';
|
@import 'blocks/header';
|
||||||
@import 'blocks/layout';
|
@import 'blocks/layout';
|
||||||
|
Reference in New Issue
Block a user