ideas icon indicating copy to clipboard operation
ideas copied to clipboard

Forms written in Markdown.

Open Kreijstal opened this issue 5 years ago • 5 comments

Project description

It would be nice if there could be a way to create a form from markdown. Where you write the inputs of what the user should write and you get a form back, a good way to do this could be, by the same way the parameters of a terminal are defined, or by some type system, I suspect that something like this already exists, but I don't know where. [Describe the project the best you can. Give any background information or link to resources that are necessary to understand the problem it is intended to solve. The more you elaborate on your idea, the easier it is to accomplish.]

Relevant Technology

There is this website https://markdownly.com/ that allows you to write tests in markdown, it could be used for this, but it is not open source [Write what technology is relevant. What language, what platform, any particular library/framework/existing project it is based on?]

Complexity and required time

[Please only tick off one box in each category by changing [ ] to [x]. The labels on the project will then be updated by the maintainers as soon as possible.]

Complexity

  • [ ] Beginner - This project requires no or little prior knowledge of the technolog(y|ies) specified to contribute to the project
  • [ ] Intermediate - The user should have some prior knowledge of the technolog(y|ies) to the point where they know how to use it, but not necessarily all the nooks and crannies of the technology
  • [x] Advanced - The project requires the user to have a good understanding of all components of the project to contribute

Required time (ETA)

  • [ ] Little work - A couple of days
  • [ ] Medium work - A week or two
  • [x] Much work - The project will take more than a couple of weeks and serious planning is required

Kreijstal avatar May 06 '19 19:05 Kreijstal

I am interested.

KIRA009 avatar May 28 '19 15:05 KIRA009

It would be great to work off of or integrate with some existing work out there, e.g. https://github.com/usds/us-forms-system

ha0ye avatar Nov 12 '19 18:11 ha0ye

I am very intrigued by the idea. could be helpful for the server storage and data complexity when storing data

mavdotjs avatar Jul 13 '22 23:07 mavdotjs

I am very intrigued by the idea. could be helpful for the server storage and data complexity when storing data

If anyone wants to help with designing the regex lmk.

mavdotjs avatar Jul 13 '22 23:07 mavdotjs

I am very intrigued by the idea. could be helpful for the server storage and data complexity when storing data

If anyone wants to help with designing the regex lmk.

I did the regex-markdown-form thing 2 years ago. I hit a wall since I wasn't using AST. Maybe I should polish it more for my job-hunt portfolio?

### Basic Usage ____

( Button )

[ ] Checkbox empty
[x] Checkbox checked

( ) Radio not selected
(x) Radio selected

(O_) Toggle-button

Input-text [    ]

+----+ TextArea
|    |
|    |
+----+

[ Select-Dropdown |V]

+------+ Select-Multi
| a1 | |
| 2b | |
| 3c | |
+------+

### END FORM ____

#### Credits

 + [Andrew Duckworth](https://twitter.com/AndrewDuck_) gave me the [original inspiration](https://grillopress.github.io/2019/05/04/writing-shorthand.html?utm_source=CRE+Newsletter&utm_campaign=32d8ab14cd-machine-learning_2019-10-18&utm_medium=email&utm_term=0_e9d73b2e20-32d8ab14cd-86278129), found in Conversion Rates Expert [newsletter](https://conversion-rate-experts.com/learning-zone/?utm_source=CRE+Newsletter&utm_campaign=32d8ab14cd-machine-learning_2019-10-18&utm_medium=email&utm_term=0_e9d73b2e20-32d8ab14cd-86278129)

<form>
<fieldset id="fs-basic-usage" class="form-group" style="border-width:1.7px 0.8px 1.4px 0.9px;border-radius:15px 255px 225px 15px/255px 15px 15px 225px;"><legend><h3 id="basic-usage">Basic Usage</h3></legend>

<p><html></p>
<form>
<p><button type="button" id="smsd-button" name="cb-group" value="smsd-button" style="border-width:0.9px 1.65px 2.2px 1.2px;border-radius:15px 265px 215px 15px/255px 15px 15px 225px;">Button</button></p>
<div><label class="paper-check"><input type="checkbox" id="cb-checkbox-empty" name="cb-checkbox-empty>" value="cb-checkbox-empty"><span>Checkbox empty</span></label></div>
<div><label class="paper-check"><input type="checkbox" id="cb-checkbox-checked" name="cb-checkbox-checked>" value="cb-checkbox-checked" checked><span>Checkbox checked</span></label></div>
<div><label class="paper-radio"><input type="radio" id="rb-radio-not-selected" name="rb->" value="rb-radio-not-selected"><span>Radio not selected</span></label></div>
<div><label class="paper-radio"><input type="radio" id="rb-radio-selected" name="rb->" value="rb-radio-selected" checked><span>Radio selected</span></label></div>
<p>
  <input type="checkbox" id="tscb-toggle-button" class="mdf-cbts"><label for="tscb-toggle-button" class="mdf-cbtsl" style="border-radius:0.85em 0.85em 0.85em 0.85em/0.85em 0.85em 0.85em 0.85em;"></label><label for="tscb-toggle-button" class="sl-right">Toggle-button</label>
</p>
<p><label>Input-text <abbr title="required" aria-label="blah"> ☼ </abbr><input required type="text" id="it-input-text" name="it-input-text" style="border-width:0.88px 1.61px 2.3px 1.18px;border-radius:15px 265px 215px 15px/255px 15px 15px 225px;" ></label>

<label class="l-blk"><p>
<textarea id="ta-textarea" name="story" rows="5" cols="33" style="border-width:0.95px 1.68px 2.26px 1.22px;border-radius:15px 265px 215px 15px/255px 15px 15px 225px;resize:none"></textarea>
TextArea</p></label>

<label><p>
  <select id="sd-p" name="sd-p" style="border-width:0.91px 1.68px 2.2px 1.23px;border-radius:15px 265px 215px 15px/255px 15px 15px 225px;">
    <option value="first">Select-Dropdown</option>
    <option value="second">Second Value</option>
    <option value="third">Third Value</option>
  </select>
</p></label>

<label class="l-blk"><p>
    <select id="sm-select-multi" name="sm-select-multi" multiple style="border-width:0.9px 1.65px 2.2px 1.2px;border-radius:15px 265px 215px 15px/255px 15px 15px 225px;">
      <option value="a1">a1</option>,
      <option value="2b">2b</option>,
      <option value="3c">3c</option>
    </select>
  Select-Multi</p></label>
  
</fieldset></form>

https://planetmarkdown.github.io/markdown-formland/

tomByrer avatar Jul 14 '22 01:07 tomByrer