* Refactoring Help component * Fixing typo * Adding missing prop types * Removing setCommonProps * Moving show to parent component * Renaming Format component * Converting help component to functional component * Removing html from state * Fixing modal toggle and eslint errors * Adding arria hidden * Using optional chaining * Fixing variable names * Renaming state variable * Adding jsdoc Co-authored-by: Nick Taylor <nick@dev.to>
35 lines
1.1 KiB
JavaScript
35 lines
1.1 KiB
JavaScript
import { h } from 'preact';
|
|
import PropTypes from 'prop-types';
|
|
|
|
export const BasicEditor = ({ openModal }) => (
|
|
<div
|
|
data-testid="basic-editor-help"
|
|
className="crayons-card crayons-card--secondary p-4 mb-6"
|
|
>
|
|
You are currently using the basic markdown editor that uses{' '}
|
|
<a href="#frontmatter" onClick={() => openModal('frontmatterShowing')}>
|
|
Jekyll front matter
|
|
</a>
|
|
. You can also use the <em>rich+markdown</em> editor you can find in{' '}
|
|
<a href="/settings/customization">
|
|
UX settings
|
|
<svg
|
|
width="24"
|
|
height="24"
|
|
viewBox="0 0 24 24"
|
|
className="crayons-icon"
|
|
xmlns="http://www.w3.org/2000/svg"
|
|
role="img"
|
|
aria-labelledby="c038a36b2512ed25db907e179ab45cfc"
|
|
aria-hidden
|
|
>
|
|
<path d="M10.667 8v1.333H7.333v7.334h7.334v-3.334H16v4a.666.666 0 01-.667.667H6.667A.666.666 0 016 17.333V8.667A.667.667 0 016.667 8h4zM18 6v5.333h-1.333V8.275l-5.196 5.196-.942-.942 5.194-5.196h-3.056V6H18z" />
|
|
</svg>
|
|
</a>
|
|
.
|
|
</div>
|
|
);
|
|
|
|
BasicEditor.propTypes = {
|
|
toggleModal: PropTypes.func.isRequired,
|
|
};
|