1
0
mirror of https://github.com/phuoc-ng/csslayout.git synced 2025-08-18 11:51:28 +02:00

Add video background pattern

This commit is contained in:
Phuoc Nguyen
2019-12-16 22:13:24 +07:00
parent 7567b3e158
commit b7d4090c5f
8 changed files with 197 additions and 4 deletions

View File

@@ -3,12 +3,18 @@ import React from 'react';
import random from '../helpers/random';
interface BlockProps {
backgroundColor?: string;
blockHeight?: number;
justify?: string;
numberOfBlocks?: number;
}
const Block: React.FC<BlockProps> = ({ justify = 'start', numberOfBlocks = 1, blockHeight = 4 }) => {
const Block: React.FC<BlockProps> = ({
backgroundColor = 'rgba(0, 0, 0, 0.3)',
blockHeight = 4,
justify = 'start',
numberOfBlocks = 1,
}) => {
return (
<div
style={{
@@ -32,7 +38,7 @@ const Block: React.FC<BlockProps> = ({ justify = 'start', numberOfBlocks = 1, bl
>
<div
style={{
backgroundColor: 'rgba(0, 0, 0, 0.3)',
backgroundColor,
borderRadius: '9999px',
height: `${blockHeight}px`,
width: '100%',

View File

@@ -1,10 +1,16 @@
import React from 'react';
const Line: React.FC<{}> = () => {
interface LineProps {
backgroundColor?: string;
}
const Line: React.FC<LineProps> = ({
backgroundColor = 'rgba(0, 0, 0, 0.3)',
}) => {
return (
<div
style={{
backgroundColor: 'rgba(0, 0, 0, 0.3)',
backgroundColor,
height: '1px',
width: '100%',
}}