Skip to content

Commit

Permalink
feat: support Md component
Browse files Browse the repository at this point in the history
  • Loading branch information
asabotovich committed May 23, 2024
1 parent dce782e commit f4ac535
Show file tree
Hide file tree
Showing 4 changed files with 65 additions and 0 deletions.
22 changes: 22 additions & 0 deletions src/harmony/Md/Md.module.css
Original file line number Diff line number Diff line change
@@ -0,0 +1,22 @@
.Md a {
color: inherit;
text-decoration: underline;

transition: color cubic-bezier(0.3, 0, 0.5, 1) 0.1s;

cursor: pointer;
}

.Md a:hover {
color: var(--blue-500);
}

.Md img {
max-width: 100%;
border-radius: var(--radius-m);
cursor: pointer;
}

.Md p {
hyphens: auto;
}
34 changes: 34 additions & 0 deletions src/harmony/Md/Md.stories.tsx
Original file line number Diff line number Diff line change
@@ -0,0 +1,34 @@
import type { Meta, StoryFn } from '@storybook/react';
import React from 'react';

import { Card, CardContent } from '../Card/Card';

import { Md } from './Md';

const meta: Meta<typeof Md> = {
title: '@harmony/Md',
component: Md,
};

export default meta;

export const Default: StoryFn<typeof Md> = () => {
return (
<div style={{ width: 500 }}>
<Card>
<CardContent view="transparent">
<Md>
<a href="#">Link to some page</a>
<p>
Lorem ipsum dolor sit amet, consectetur adipisicing elit. Aut impedit possimus fugit numquam
reiciendis ratione at praesentium cumque, nisi ea quia delectus rem! Ipsa, id voluptates
reprehenderit totam nemo eius sed commodi architecto labore impedit a in laborum explicabo
autem, provident, minima exercitationem corrupti quasi sequi eveniet eaque iure unde.
</p>
<img src="https://www.dogeat.ru/img/%D0%9F%D0%BE%D1%87%D0%B5%D0%BC%D1%83%20%D0%BA%D0%BE%D1%82%20%D1%85%D1%80%D0%B8%D0%BF%D0%B8%D1%82%20%D0%B8%20%D1%82%D1%8F%D0%B6%D0%B5%D0%BB%D0%BE%20%D0%B4%D1%8B%D1%88%D0%B8%D1%82.jpg" />
</Md>
</CardContent>
</Card>
</div>
);
};
8 changes: 8 additions & 0 deletions src/harmony/Md/Md.tsx
Original file line number Diff line number Diff line change
@@ -0,0 +1,8 @@
import React, { FC, HTMLAttributes } from 'react';
import cn from 'classnames';

import s from './Md.module.css';

export const Md: FC<HTMLAttributes<HTMLDivElement>> = ({ className, ...props }) => (
<div className={cn(s.Md, className)} {...props}></div>
);
1 change: 1 addition & 0 deletions src/harmony/index.ts
Original file line number Diff line number Diff line change
Expand Up @@ -21,6 +21,7 @@ export * from './HistoryRecord/HistoryRecord';
export * from './Input/Input';
export * from './Keyboard/Keyboard';
export * from './Link/Link';
export * from './Md/Md';
export * from './MenuItem/MenuItem';
export * from './Modal/Modal';
export * from './ModalPreview/ModalPreview';
Expand Down

0 comments on commit f4ac535

Please sign in to comment.