Redesign `examples/*html`

[publiclab]

Redesign `examples/*html`

[rexagod]

Pinging @ShivankSahai. @rain-light I guess you can go ahead with this. Let us know if you face any trouble along the way!

[rain-light]

Hello, I tried getting to work at this more than once this week, but unfortunately since I have to prepare Linear Algebra exam for the 1st of July and Java for the 10th I wouldn't have enough time to give this the amount of work it would need.

If someone else wants to do this, feel free to do it. If no one will have taken it when I'll have finished, I'll join again.
Sorry for the inconvenience and thank you!

[ShivankSahai]

I wish to work on this issue.

[rexagod]

Sure, @ShivankSahai, go ahead!

[ShivankSahai]

Hi, I made changes to the index.html and wysiwyg.html files, and opened up a pull request, so please see if I did everything correctly. I wasn't able to understand the issue fully, so please tell me if I should have done anything else, or something more, and I'll work on it.

[rexagod]

@ShivankSahai Can you link your PR back here by adding a "Fixes #65" in its description (at the start)? I'll have a look. Thanks!

[rexagod]

Okay I skimmed through it and just wanted to confirm, did you test it out? Please make sure the inline editor works on all the examples in the index.html, also can you modify the css a bit (refer issue description above) Thanks!

[rain-light]

Are you still working on this?

[rain-light]

Thank you, I started working on this. Anyways, npm found some high priority vulnerabilities and I run a "npm audit fix" to see what it could manage to fix alone. It then said that 2 of them would break something and I didn't continue.

Maybe you already know, but just in case I reported this here

[rain-light]

Alright, I went exploring around and now I have some questions.
I can see the application still is in a early phase of development and nothing is set on stone (correct me if I'm wrong). So:

• I see you include Bootstrap 3 in your dependencies, but not much of it is used. Is this mandatory? Or maybe I could use Bootstrap 4?

• I work best when I have a very high degree of freedom, aka no Bootstrap and coding the style from scratch; especially for 2 pages. This is also an option; if you'd choose this I would make a 'scss' folder inside of src following the 7-1 structure.

• If you would allow me to do so, I'd redesign the "Edit this section" form. To put it better I'd redesign everything, since the style would have to be consistent

• What does "(above, raw HTML blocks should be undisturbed)" stand for? If it's something related to avoiding messing with the DOM manipulation by the app, I could check what has to stay the same and what can change (can't do it right now, it's 10 PM in my country right now sorry)

• I have never used grunt, do you have some automated live server functionality such as with Gulp and browserSync?

EDIT:

• Oh and the icons! I could use a svg main file generated by icomoon.io (there's also FontAwesome if you want it) for better practice.

Thank you for the opportunity!

[rexagod]

Hi @rain-light! I appreciate your interest, and have tried to answer your questions below but feel free to ping me if you have any doubts whatsoever. Thanks!

I can see the application still is in a early phase of development and nothing is set on stone

This is actually a satellite library, and is used over at our plots2 repository for using markdown in comments. You can try it by commenting on any of the notes over at publiclab.org. It seems that that application is in an early phase as we haven't completely incorporated the set of APIs it has to offer inside the demo.

I see you include Bootstrap 3 in your dependencies, but not much of it is used. Is this mandatory? Or maybe I could use Bootstrap 4?

How about shifting the B3 code to B4 in a separate PR? Or maybe starting from scratch using B4?

I work best when I have a very high degree of freedom, aka no Bootstrap and coding the style from scratch; especially for 2 pages. This is also an option; if you'd choose this I would make a 'scss' folder inside of src following the 7-1 structure. If you would allow me to do so, I'd redesign the "Edit this section" form. To put it better I'd redesign everything, since the style would have to be consistent

Hmm, interesting. I'd be really excited to see some SCSS getting merged into this lib! Also, if you think this requires a complement revamp, go ahead!

What does "(above, raw HTML blocks should be undisturbed)" stand for?

It's actually the HTML blocks that are treated as examples for the demo to operate upon. Feel free to include it in your revamp if you feel like it!

I have never used grunt, do you have some automated live server functionality such as with Gulp and browserSync?

inline-markdown-editor/Gruntfile.js

Line 60 in 4b8ccf4

grunt.registerTask('default', ['watch']);

Sure! You can enable that by simply typing in grunt in your terminal.

Oh and the icons! I could use a svg main file generated by icomoon.io (there's also FontAwesome if you want it) for better practice.

Please do!

[NitinBhasneria]

@rexagod If no one is working on this so can I do this?

[rexagod]

Sure, @NitinBhasneia!

[NitinBhasneria]

ok, thanks, @rexagod. I have seen that someone was already working on this so anything you want to add then, please.

[pankajkrbansal]

@rexagod I'd like to try this!