diff --git a/src/components/generic/CodeShell.js b/src/components/generic/CodeShell.js
index 16e2b2a..136ff41 100644
--- a/src/components/generic/CodeShell.js
+++ b/src/components/generic/CodeShell.js
@@ -1,23 +1,23 @@
import React from 'react';
-import {FlexColumn, Svg} from '../../utils/containers';
+import { FlexColumn, Svg } from '../../utils/containers';
import styled from 'styled-components';
import theme from '../../utils/theme';
import copyIco from '../../assets/copy_ico.svg';
import checkIco from '../../assets/check_ico.svg';
-import {Body, Code} from '../../utils/fonts';
+import { Body, Code } from '../../utils/fonts';
const CodeShellStyle = styled(FlexColumn)`
position: relative;
padding: 24px 14px 14px;
gap: 8px;
- background-color: ${({theme}) => theme.colors.dark07};
- border: 1px solid ${({theme}) => theme.colors.dark};
+ background-color: ${({ theme }) => theme.colors.dark07};
+ border: 1px solid ${({ theme }) => theme.colors.dark};
border-radius: 4px;
width: 100%;
align-items: flex-start;
- max-width: ${({maxWidth}) => maxWidth ? maxWidth : 'none'};
+ max-width: ${({ maxWidth }) => (maxWidth ? maxWidth : 'none')};
- @media (min-width: ${({theme}) => theme.overMobile}) {
+ @media (min-width: ${({ theme }) => theme.overMobile}) {
gap: 12px;
padding: 40px 32px 32px;
}
@@ -28,59 +28,63 @@ const CopiedMessageStyle = styled(Body)`
position: absolute;
top: -24px;
right: -10px;
- background-color: ${({theme}) => theme.colors.green};
- color: ${({theme}) => theme.colors.white};
+ background-color: ${({ theme }) => theme.colors.green};
+ color: ${({ theme }) => theme.colors.white};
border-radius: 4px;
padding: 6px;
`;
const CodeShell = (props) => {
- const [ico, setIco] = React.useState(copyIco);
+ const [ico, setIco] = React.useState(copyIco);
- const clickCopyButton = () => {
- let commands = '';
- if (props.commands.length > 1) {
- for (let command of props.commands)
- commands += command + '\n';
- } else commands = props.commands;
- navigator.clipboard.writeText(commands).then(r => console.log(r));
- setIco(checkIco);
- setTimeout(() => {
- setIco(copyIco);
- }, 3000);
- };
+ const clickCopyButton = () => {
+ let commands = '';
+ if (props.commands.length > 1) {
+ for (let command of props.commands) commands += command + '\n';
+ } else commands = props.commands;
+ navigator.clipboard.writeText(commands).then((r) => console.log(r));
+ setIco(checkIco);
+ setTimeout(() => {
+ setIco(copyIco);
+ }, 2000);
+ };
- const formatCommand = (command) => {
- if (command[0] === '\t') {
- return <> {formatCommand(command.slice(1))}>;
- /* eslint-disable */
- } else if (command[0] === '\s') {
- return <> {formatCommand(command.slice(1))}>;
- }
- return command;
- };
+ const formatCommand = (command) => {
+ if (command[0] === '\t') {
+ return <> {formatCommand(command.slice(1))}>;
+ }
+ return command;
+ };
- const renderCommands = () => {
- return (
- props.commands.map((command, index) => {
- return (
-
- {formatCommand(command)}
-
- );
- })
- );
- };
+ const renderCommands = () => {
+ return props.commands.map((command, index) => {
+ return (
+
+ {formatCommand(command)}
+
+ );
+ });
+ };
- return (
-