enhancement: extract styles to a `vue-form-generator.css` file. #27

lionel-bijaoui · 2016-08-08T14:43:33Z

coveralls · 2016-08-08T14:50:25Z

Coverage remained the same at 87.245% when pulling 21c8876 on lionel-bijaoui:LB_extract_style into 66d201d on icebob:master.

icebob · 2016-08-08T14:51:19Z

Thanks!

Please remove the scoped from styles in field*.vue
https://github.com/icebob/vue-form-generator/blob/master/src/fields/fieldText.vue#L14

lionel-bijaoui · 2016-08-08T14:57:32Z

I'm all for it, but as is, it will have repercussion on the style. Most css selector are input and span. They will need a class, no ?
Edit: also, it would be cool to have css-nano do some cleanup after (there are duplicate)

coveralls · 2016-08-08T15:06:44Z

Coverage remained the same at 87.245% when pulling 4a4641c on lionel-bijaoui:LB_extract_style into 66d201d on icebob:master.

…-generator into LB_extract_style

coveralls · 2016-08-08T15:28:19Z

Coverage remained the same at 87.245% when pulling 18cbeef on lionel-bijaoui:LB_extract_style into 66d201d on icebob:master.

icebob · 2016-08-08T15:33:31Z

Yes. Need a .vue-form-generator class.

2016.08.08. 16:57 ezt írta ("lionel-bijaoui" [email protected]):

I'm all for it, but as is, it will have repercussion on the style. Most
css selector are input and span. They will need a class, no ?

—
You are receiving this because you commented.
Reply to this email directly, view it on GitHub
#27 (comment),
or mute the thread
https://github.com/notifications/unsubscribe-auth/AAStWXZMW945lmE3tk7pS5_TcC-wP-Mlks5qd0PdgaJpZM4JfHam
.

lionel-bijaoui · 2016-08-08T15:54:26Z

@icebob I will refactor the CSS in this branch, if it is OK for you. Approved ?

icebob · 2016-08-08T16:04:45Z

Ok.

2016.08.08. 17:54 ezt írta ("lionel-bijaoui" [email protected]):

@icebob https://github.com/icebob I will refactor the CSS in this
branch, if it is OK for you. Approved ?

—
You are receiving this because you were mentioned.
Reply to this email directly, view it on GitHub
#27 (comment),
or mute the thread
https://github.com/notifications/unsubscribe-auth/AAStWco0IKtnoqj1JQmIsvwrSbraNLapks5qd1EygaJpZM4JfHam
.

icebob · 2016-08-08T17:15:58Z

We add .vue-form-generator class for fieldset in https://github.com/icebob/vue-form-generator/blob/master/src/formGenerator.vue#L2

lionel-bijaoui · 2016-08-08T18:29:06Z

I'm also going to add .field-*** for component specific class override (e.g. .field-checkbox).
I also noticed that some field components have multiple top-level elements. This will create fragment instance that should be avoided.
~~Can I fix it too or should I open an issue and fix it later?~~ #28
Having it done now will be easier especially with these class override (I can place this class on the top-level element)

icebob · 2016-08-08T19:11:08Z

@lionel-bijaoui please don't add .field-*** classes! They have. Check this line: https://github.com/icebob/vue-form-generator/blob/master/src/formGenerator.vue#L101
So only need to add .vue-form-generator to the fieldset and change the selectors in the styles.

For multiple-top-level elements: fix it later. Just collect the concerned fields and create an issue.

icebob · 2016-08-08T19:17:56Z

package.json

@@ -54,6 +54,7 @@
    "eslint-loader": "1.5.0",
    "eslint-plugin-html": "1.5.1",
    "eslint-plugin-vue": "0.1.1",
+    "extract-text-webpack-plugin": "^1.0.1",


Please change to static version number "v1.0.1"

coveralls · 2016-08-09T08:09:05Z

Coverage remained the same at 87.245% when pulling 778a9ff on lionel-bijaoui:LB_extract_style into 66d201d on icebob:master.

icebob · 2016-08-09T08:14:49Z

@lionel-bijaoui do you need my help for styles?

lionel-bijaoui · 2016-08-09T08:16:38Z

@icebob it's ok for me, I have a few questions to be clear on what direction you want to go.

lionel-bijaoui · 2016-08-09T08:35:11Z

@icebob What should be the rule regarding bootstrap specific class (.form-control, .form-group, .form-inline, .form-horizontal, .radio, .radio-inline, .checkbox, .checkbox-inline, .form-control-static, etc) ?
Should we go full bootstrap way or keep only a minimal list of class?

…t selector for a more encapsulated style.

…idth of the switch.

coveralls · 2016-08-09T09:19:17Z

Coverage remained the same at 87.245% when pulling 49e8d43 on lionel-bijaoui:LB_extract_style into 66d201d on icebob:master.

icebob · 2016-08-09T09:39:42Z

@lionel-bijaoui we add minimal classes from bootstrap (e.g. .form-control, .form-group)
So the "official" style/theme would be bootstrap theme for input and button fields

icebob · 2016-08-09T11:02:15Z

Are you still working on this PR?

icebob · 2016-08-09T11:07:28Z

src/formGenerator.vue

@@ -1,5 +1,5 @@
 <template lang="jade">
-	fieldset(v-if="schema != null")
+	fieldset.vue-form-generator(v-if="schema != null")


This selector need to add in styles too:

<style lang="sass"> $errorColor: lighten(#F00, 0%); fieldset.vue-form-generator {

lionel-bijaoui · 2016-08-09T11:25:33Z

I'm almost ready. I will implement your comment and it should be good.

icebob · 2016-08-09T11:28:43Z

Great! 👍

coveralls · 2016-08-09T12:22:16Z

Coverage remained the same at 87.245% when pulling b2fcef1 on lionel-bijaoui:LB_extract_style into 66d201d on icebob:master.

lionel-bijaoui · 2016-08-09T12:23:17Z

@icebob Ready to merge ?

icebob · 2016-08-09T12:26:05Z

Firstly I create a branch based on this PR. Because I want to change styles on fieldSwitch too (remove white shadow because it is ugly on black background)

icebob · 2016-08-09T12:48:37Z

https://github.com/icebob/vue-form-generator/tree/extract-styles

icebob · 2016-08-09T14:08:09Z

Merged in #29

icebob · 2016-08-09T14:11:31Z

@lionel-bijaoui Thanks for your help :) 👍

lionel-bijaoui · 2016-08-09T14:15:05Z

Thank you, but I'm a bit lost, was I supposed to do something about my branch and your branch ?

icebob · 2016-08-09T14:28:35Z

No, it's ready. But I can't commit to your branch/PR, so I open an own branch what is based on your branch and made other changes in the styles.
E.g.: I added some bootstrap styles, so if bootstrap is not loaded, the looks will be same.
Check this fiddle: https://jsfiddle.net/icebob/0mg1v81e/
Now bootstrap removed from External links, add vue-form-generator.css and looks is similar! 👍

But I don't know what is this multiple empty lines in the generated css: https://github.com/icebob/vue-form-generator/blob/master/dist/vue-form-generator.css#L193

lionel-bijaoui · 2016-08-09T14:36:43Z

Great ! I was a bit confused 😕
Can I delete the branch ?

icebob · 2016-08-09T14:38:47Z

Yes you can. Now your commits are in the master.

enhancement: extract styles to a vue-form-generator.css file.

21c8876

lionel-bijaoui mentioned this pull request Aug 8, 2016

remove scoped styles #20

Closed

5 tasks

enhenhancement: remove scoped styles

4a4641c

Lionel Bijaoui added 2 commits August 8, 2016 17:23

enhenhancement: remove scoped styles

1c46aef

Merge branch 'LB_extract_style' of github.com:lionel-bijaoui/vue-form…

18cbeef

…-generator into LB_extract_style

icebob reviewed Aug 8, 2016
View reviewed changes

fix: package version for extract-text-webpack-plugin

778a9ff

Lionel Bijaoui added 3 commits August 9, 2016 11:16

enhancement: add global class .vue-form-generator. Rewriting of mos…

e864d10

…t selector for a more encapsulated style.

Small changes to fieldSwitch to allow easier customization of the w…

5a4769e

…idth of the switch.

dev: add a basic color field for testing

49e8d43

icebob reviewed Aug 9, 2016
View reviewed changes

fix: better selector for the main component and added latest build

b2fcef1

icebob closed this Aug 9, 2016

lionel-bijaoui deleted the LB_extract_style branch August 9, 2016 15:38

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

enhancement: extract styles to a `vue-form-generator.css` file. #27

enhancement: extract styles to a `vue-form-generator.css` file. #27

lionel-bijaoui commented Aug 8, 2016

coveralls commented Aug 8, 2016 •

edited

Loading

icebob commented Aug 8, 2016

lionel-bijaoui commented Aug 8, 2016 •

edited

Loading

coveralls commented Aug 8, 2016 •

edited

Loading

coveralls commented Aug 8, 2016 •

edited

Loading

icebob commented Aug 8, 2016

lionel-bijaoui commented Aug 8, 2016

icebob commented Aug 8, 2016

icebob commented Aug 8, 2016

lionel-bijaoui commented Aug 8, 2016 •

edited

Loading

icebob commented Aug 8, 2016

icebob Aug 8, 2016

coveralls commented Aug 9, 2016 •

edited

Loading

icebob commented Aug 9, 2016

lionel-bijaoui commented Aug 9, 2016

lionel-bijaoui commented Aug 9, 2016

coveralls commented Aug 9, 2016 •

edited

Loading

icebob commented Aug 9, 2016

icebob commented Aug 9, 2016

icebob Aug 9, 2016

lionel-bijaoui commented Aug 9, 2016

icebob commented Aug 9, 2016

coveralls commented Aug 9, 2016 •

edited

Loading

lionel-bijaoui commented Aug 9, 2016

icebob commented Aug 9, 2016

icebob commented Aug 9, 2016

icebob commented Aug 9, 2016

icebob commented Aug 9, 2016

lionel-bijaoui commented Aug 9, 2016

icebob commented Aug 9, 2016

lionel-bijaoui commented Aug 9, 2016

icebob commented Aug 9, 2016

enhancement: extract styles to a vue-form-generator.css file. #27

enhancement: extract styles to a vue-form-generator.css file. #27

Conversation

lionel-bijaoui commented Aug 8, 2016

coveralls commented Aug 8, 2016 • edited Loading

icebob commented Aug 8, 2016

lionel-bijaoui commented Aug 8, 2016 • edited Loading

coveralls commented Aug 8, 2016 • edited Loading

coveralls commented Aug 8, 2016 • edited Loading

icebob commented Aug 8, 2016

lionel-bijaoui commented Aug 8, 2016

icebob commented Aug 8, 2016

icebob commented Aug 8, 2016

lionel-bijaoui commented Aug 8, 2016 • edited Loading

icebob commented Aug 8, 2016

icebob Aug 8, 2016

Choose a reason for hiding this comment

coveralls commented Aug 9, 2016 • edited Loading

icebob commented Aug 9, 2016

lionel-bijaoui commented Aug 9, 2016

lionel-bijaoui commented Aug 9, 2016

coveralls commented Aug 9, 2016 • edited Loading

icebob commented Aug 9, 2016

icebob commented Aug 9, 2016

icebob Aug 9, 2016

Choose a reason for hiding this comment

lionel-bijaoui commented Aug 9, 2016

icebob commented Aug 9, 2016

coveralls commented Aug 9, 2016 • edited Loading

lionel-bijaoui commented Aug 9, 2016

icebob commented Aug 9, 2016

icebob commented Aug 9, 2016

icebob commented Aug 9, 2016

icebob commented Aug 9, 2016

lionel-bijaoui commented Aug 9, 2016

icebob commented Aug 9, 2016

lionel-bijaoui commented Aug 9, 2016

icebob commented Aug 9, 2016

enhancement: extract styles to a `vue-form-generator.css` file. #27

enhancement: extract styles to a `vue-form-generator.css` file. #27

coveralls commented Aug 8, 2016 •

edited

Loading

lionel-bijaoui commented Aug 8, 2016 •

edited

Loading

coveralls commented Aug 8, 2016 •

edited

Loading

coveralls commented Aug 8, 2016 •

edited

Loading

lionel-bijaoui commented Aug 8, 2016 •

edited

Loading

coveralls commented Aug 9, 2016 •

edited

Loading

coveralls commented Aug 9, 2016 •

edited

Loading

coveralls commented Aug 9, 2016 •

edited

Loading