add: route to stand along page

src/components/MarkdownTemplate/ParametersManager.js

@@ -70,9 +70,11 @@ const ParametersManager = ({ parameters, onChange }) => {
             <div style={{ maxHeight: "50vh", overflowY: "auto" }}>
                 {_parameters.map((param, index) => (
                     <div key={index} className="box" style={{ marginBottom: "0.5rem" }}>
-                        <div className="field is-grouped is-grouped-multiline">
+                        <div className="field is-grouped is-align-items-end">
+                            <div className="control">
+                                <label className="label">Name:</label>
+                            </div>
                             <div className="control is-expanded">
-                                <label className="label mb-1">Name:</label>
                                 <input
                                     type="text"
                                     className="input"

src/components/MarkdownTemplate/TypeEditor.js

@@ -69,7 +69,6 @@ const TypeEditor = ({ type, onChange }) => {
             case 'template':
                 return (
                     <div className="field">
-                        <label className="label">Template</label>
                         <div className="control">
                             <TemplateSelector
                                 template={_type.definition.template}
@@ -95,7 +94,7 @@ const TypeEditor = ({ type, onChange }) => {
     return (
         <div className="box">
             <div className="field">
-                <label className="label">Type</label>
+                {/*<label className="label">Type</label>*/}
                 <div className="control">
                     <div className="select is-fullwidth">
                         <select

src/components/Markdowns/MarkdownContent.js

@@ -9,11 +9,13 @@ import {usePath} from "../../utils/queries/path-queries";
 import {useMarkdownSetting} from "../../utils/queries/markdown-setting-queries";
 import {useMarkdownTemplate} from "../../utils/queries/markdown-template-queries";
 import {useMarkdownTemplateSetting} from "../../utils/queries/markdown-template-setting-queries";
+import MarkdownSettingModal from "../Modals/MarkdownSettingModal";
 
 const MarkdownContent = () => {
     const { strId } = useParams();
     const id = Number(strId);
     const [indexTitle, setIndexTitle] = useState(null);
+    const [isSettingModalOpen, setSettingModalOpen] = useState(false);
     const {data: markdown, isLoading, error} = useMarkdown(id);
     const {data: path, isFetching: isPathFetching} = usePath(markdown?.path_id);
     const {data: setting, isFetching: isSettingFetching} = useMarkdownSetting(markdown?.setting_id);
@@ -50,15 +52,28 @@ const MarkdownContent = () => {
 
     return (
         <div className="markdown-content-container">
-            <div className="field has-addons markdown-content-container-header">
-                <h1 className="title control">{markdown.title === "index" ? indexTitle : markdown.title}</h1>
+            <div className="is-flex is-justify-content-space-between is-align-items-center markdown-content-container-header">
+                <h1 className="title">{markdown.title === "index" ? indexTitle : markdown.title}</h1>
                 <PermissionGuard rolesRequired={['admin']}>
-                    <Link to={`/markdown/edit/${id}`} className="control button is-primary is-light">
-                        Edit
-                    </Link>
+                    <div className="field has-addons">
+                        <button
+                            className="control button is-info is-light"
+                            onClick={() => setSettingModalOpen(true)}
+                        >
+                            Settings
+                        </button>
+                        <Link to={`/markdown/edit/${id}`} className="control button is-primary is-light">
+                            Edit
+                        </Link>
+                    </div>
                 </PermissionGuard>
             </div>
             <MarkdownView content={JSON.parse(markdown.content)} template={template}/>
+            <MarkdownSettingModal 
+                isOpen={isSettingModalOpen}
+                markdown={markdown}
+                onClose={() => setSettingModalOpen(false)}
+            />
         </div>
     );
 };