From b9b82cee42920fad22e3d7259359150ba664fb5b Mon Sep 17 00:00:00 2001 From: Andrej Zachar Date: Sun, 23 Nov 2014 02:05:52 -0800 Subject: [PATCH] Bootstrap social library support supported for less, sass in jade and html Log in is a primary way to get into your application (Sign up has less importance after social login) --- app/templates/Gruntfile.js | 2 +- app/templates/_bower.json | 4 +- .../app/account(auth)/login/login(html).html | 87 ++++++-------- .../app/account(auth)/login/login(jade).jade | 106 ++++++++++-------- .../app/account(auth)/login/login(less).less | 30 ----- .../app/account(auth)/login/login(sass).scss | 30 ----- .../account(auth)/signup/signup(html).html | 106 +++++------------- .../account(auth)/signup/signup(jade).jade | 80 +++++-------- app/templates/client/app/app(less).less | 4 + app/templates/client/app/app(sass).scss | 5 + .../components/navbar/navbar(html).html | 1 - .../components/navbar/navbar(jade).jade | 5 +- test/fixtures/bower.json | 1 + 13 files changed, 169 insertions(+), 292 deletions(-) diff --git a/app/templates/Gruntfile.js b/app/templates/Gruntfile.js index a0267aaa4..d83a69493 100644 --- a/app/templates/Gruntfile.js +++ b/app/templates/Gruntfile.js @@ -261,7 +261,7 @@ module.exports = function (grunt) { target: { src: '<%%= yeoman.client %>/index.html', ignorePath: '<%%= yeoman.client %>/', - exclude: [/bootstrap-sass-official/, /bootstrap.js/, '/json3/', '/es5-shim/'<% if(!filters.css) { %>, /bootstrap.css/, /font-awesome.css/ <% } %>] + exclude: [/bootstrap-sass-official/, /bootstrap.js/, '/json3/', '/es5-shim/'<% if(!filters.css) { %>, /bootstrap.css/, /font-awesome.css/, /bootstrap-social.css/ <% } %>] } }, diff --git a/app/templates/_bower.json b/app/templates/_bower.json index ce22650fb..e93ee7e9d 100644 --- a/app/templates/_bower.json +++ b/app/templates/_bower.json @@ -5,7 +5,9 @@ "angular": ">=1.2.*", "json3": "~3.3.1", "es5-shim": "~3.0.1",<% if(filters.bootstrap) { %><% if (filters.sass) { %> - "bootstrap-sass-official": "~3.1.1",<% } %> + "bootstrap-sass-official": "~3.1.1", + "bootstrap-social": "~4.8.0",<% } %><% if (filters.less) { %> + "bootstrap-social": "~4.8.0",<% } %> "bootstrap": "~3.1.1",<% } %> "angular-resource": ">=1.2.*", "angular-cookies": ">=1.2.*", diff --git a/app/templates/client/app/account(auth)/login/login(html).html b/app/templates/client/app/account(auth)/login/login(html).html index 572f2e144..a6c060e0f 100644 --- a/app/templates/client/app/account(auth)/login/login(html).html +++ b/app/templates/client/app/account(auth)/login/login(html).html @@ -2,60 +2,41 @@
-
-

Login

-

Accounts are reset on server restart from server/config/seed.js. Default account is test@test.com / test

-

Admin account is admin@admin.com / admin

-
-
-
- -
- - - +
+

Log in

<% if(filters.oauth) {%> +
<% if(filters.facebookAuth) {%> + <% } %><% if(filters.googleAuth) {%> + <% } %><% if(filters.twitterAuth) {%> + <% } %> +
+
<% } %> + +
+
+ +
@ + +
+
+
+ +
* + +
+
+
+

Please enter your email and password.

+

{{ errors.other }}

+
+
- -
- - - -
- -
-

- Please enter your email and password. -

-

- Please enter a valid email. -

- -

{{ errors.other }}

-
- -
- - - Register - -
-<% if(filters.oauth) {%> -
-
<% if(filters.facebookAuth) {%> - - Connect with Facebook - <% } %><% if(filters.googleAuth) {%> - - Connect with Google+ - <% } %><% if(filters.twitterAuth) {%> - - Connect with Twitter - <% } %> -
<% } %> +
+
New registration
-
-
+
+

Accounts are reset on server restart fromserver/config/seed.js. Default account istest@test.com/test

+

Admin account isadmin@admin.com/admin

+
+
\ No newline at end of file diff --git a/app/templates/client/app/account(auth)/login/login(jade).jade b/app/templates/client/app/account(auth)/login/login(jade).jade index 4b13c0b13..54ecf9b27 100644 --- a/app/templates/client/app/account(auth)/login/login(jade).jade +++ b/app/templates/client/app/account(auth)/login/login(jade).jade @@ -1,54 +1,66 @@ div(ng-include='"components/navbar/navbar.html"') .container .row - .col-sm-12 - h1 Login - p - | Accounts are reset on server restart from - code server/config/seed.js - | . Default account is - code test@test.com - | / - code test - p - | Admin account is - code admin@admin.com - | / - code admin - - .col-sm-12 - form.form(name='form', ng-submit='login(form)', novalidate='') - .form-group - label Email - input.form-control(type='text', name='email', ng-model='user.email') - .form-group - label Password - input.form-control(type='password', name='password', ng-model='user.password') + .col-sm-offset-3.col-sm-6.col-xs-12 + h1 Log in + <% if(filters.oauth) {%> + .well + <% if(filters.facebookAuth) {%> + button.btn.btn-block.btn-social.btn-facebook(ng-click='loginOauth("facebook")') + i.fa.fa-facebook + | + span Connect with + | Facebook + <% } %><% if(filters.googleAuth) {%> + button.btn.btn-block.btn-social.btn-google-plus(ng-click='loginOauth("google")') + i.fa.fa-google-plus + | + span Connect with + | Google+ + <% } %><% if(filters.twitterAuth) {%> + button.btn.btn-block.btn-social.btn-twitter(ng-click='loginOauth("twitter")') + i.fa.fa-twitter + | + span Connect with + | Twitter + <% } %> + hr + <% } %> + form(name='form', ng-submit='login(form)', novalidate='') + .well + .form-group + label.sr-only(for='email') Email address + .input-group + span.input-group-addon @ + input.form-control(type='email', placeholder='Email address', required='', autofocus='', name='email', ng-model='user.email') + .form-group + label.sr-only(for='password') Password + .input-group + span.input-group-addon * + input.form-control(type='password', placeholder='Password', name='password', ng-model='user.password', required='') + .form-group.has-error + p.help-block(ng-show='form.email.$error.required && form.password.$error.required && submitted') + | Please enter your email and password. + p.help-block {{ errors.other }} - .form-group.has-error - p.help-block(ng-show='form.email.$error.required && form.password.$error.required && submitted') - | Please enter your email and password. - p.help-block {{ errors.other }} + button.btn.btn-primary.btn-block(type='submit') + | Log in - div - button.btn.btn-inverse.btn-lg.btn-login(type='submit') - | Login - = ' ' - a.btn.btn-default.btn-lg.btn-register(href='/signup') - | Register -<% if(filters.oauth) {%> hr + .well + a.btn.btn-default.btn-block(href='/signup') + | New registration - div<% if(filters.facebookAuth) {%> - a.btn.btn-facebook(href='', ng-click='loginOauth("facebook")') - i.fa.fa-facebook - | Connect with Facebook - = ' '<% } %><% if(filters.googleAuth) {%> - a.btn.btn-google-plus(href='', ng-click='loginOauth("google")') - i.fa.fa-google-plus - | Connect with Google+ - = ' '<% } %><% if(filters.twitterAuth) {%> - a.btn.btn-twitter(href='', ng-click='loginOauth("twitter")') - i.fa.fa-twitter - | Connect with Twitter<% } %><% } %> - hr + .row + p + | Accounts are reset on server restart from + code server/config/seed.js + | . Default account is + code test@test.com + | / + code test + p + | Admin account is + code admin@admin.com + | / + code admin \ No newline at end of file diff --git a/app/templates/client/app/account(auth)/login/login(less).less b/app/templates/client/app/account(auth)/login/login(less).less index bd01a056e..e69de29bb 100644 --- a/app/templates/client/app/account(auth)/login/login(less).less +++ b/app/templates/client/app/account(auth)/login/login(less).less @@ -1,30 +0,0 @@ -<% if(filters.bootstrap) { %>// Colors -// -------------------------------------------------- - -@btnText: #fff; -@btnTextAlt: #000;<% if (filters.oauth) { %> -<% if (filters.facebookAuth) { %> -@btnFacebookBackground: #3B5998; -@btnFacebookBackgroundHighlight: #133783;<% } if (filters.twitterAuth) { %> -@btnTwitterBackground: #2daddc; -@btnTwitterBackgroundHighlight: #0271bf;<% } if (filters.googleAuth) { %> -@btnGooglePlusBackground: #dd4b39; -@btnGooglePlusBackgroundHighlight: #c53727;<% } %> -@btnGithubBackground: #fafafa; -@btnGithubBackgroundHighlight: #ccc; - -// Social buttons -// -------------------------------------------------- -<% if (filters.facebookAuth) { %> -.btn-facebook { - .button-variant(@btnText; @btnFacebookBackgroundHighlight; @btnFacebookBackgroundHighlight); -}<% } if (filters.twitterAuth) { %> -.btn-twitter { - .button-variant(@btnText; @btnTwitterBackground; @btnTwitterBackgroundHighlight); -}<% } if (filters.googleAuth) { %> -.btn-google-plus { - .button-variant(@btnText; @btnGooglePlusBackground; @btnGooglePlusBackgroundHighlight); -}<% } %> -.btn-github { - .button-variant(@btnTextAlt; @btnGithubBackground; @btnGithubBackgroundHighlight); -}<% } %><% } %> diff --git a/app/templates/client/app/account(auth)/login/login(sass).scss b/app/templates/client/app/account(auth)/login/login(sass).scss index eb214a8ca..e69de29bb 100644 --- a/app/templates/client/app/account(auth)/login/login(sass).scss +++ b/app/templates/client/app/account(auth)/login/login(sass).scss @@ -1,30 +0,0 @@ -<% if(filters.bootstrap) { %>// Colors -// -------------------------------------------------- - -$btnText: #fff; -$btnTextAlt: #000;<% if (filters.oauth) { %> -<% if (filters.facebookAuth) { %> -$btnFacebookBackground: #3B5998; -$btnFacebookBackgroundHighlight: #133783;<% } if (filters.twitterAuth) { %> -$btnTwitterBackground: #2daddc; -$btnTwitterBackgroundHighlight: #0271bf;<% } if (filters.googleAuth) { %> -$btnGooglePlusBackground: #dd4b39; -$btnGooglePlusBackgroundHighlight: #c53727;<% } %> -$btnGithubBackground: #fafafa; -$btnGithubBackgroundHighlight: #ccc; - -// Social buttons -// -------------------------------------------------- -<% if (filters.facebookAuth) { %> -.btn-facebook { - @include button-variant($btnText, $btnFacebookBackgroundHighlight, $btnFacebookBackgroundHighlight); -}<% } if (filters.twitterAuth) { %> -.btn-twitter { - @include button-variant($btnText, $btnTwitterBackground, $btnTwitterBackgroundHighlight); -}<% } if (filters.googleAuth) { %> -.btn-google-plus { - @include button-variant($btnText, $btnGooglePlusBackground, $btnGooglePlusBackgroundHighlight); -}<% } %> -.btn-github { - @include button-variant($btnTextAlt, $btnGithubBackground, $btnGithubBackgroundHighlight); -}<% } %><% } %> diff --git a/app/templates/client/app/account(auth)/signup/signup(html).html b/app/templates/client/app/account(auth)/signup/signup(html).html index 59faed568..bac156397 100644 --- a/app/templates/client/app/account(auth)/signup/signup(html).html +++ b/app/templates/client/app/account(auth)/signup/signup(html).html @@ -1,82 +1,36 @@ -
+
-
+

Sign up

+
+
+
+ + +

A name is required

+
+
+ + +

Doesn't look like a valid email.

+

What's your email address?

+

{{ errors.email }}

+
+
+ + +

Password must be at least 3 characters.

+

{{ errors.password }}

+
+
+ +
+
+
-
-
- -
- - - -

- A name is required -

-
- -
- - - -

- Doesn't look like a valid email. -

-

- What's your email address? -

-

- {{ errors.email }} -

-
- -
- - - -

- Password must be at least 3 characters. -

-

- {{ errors.password }} -

-
- -
- - - Login - -
-<% if(filters.oauth) {%> -
-
<% if(filters.facebookAuth) {%> - - Connect with Facebook - <% } %><% if(filters.googleAuth) {%> - - Connect with Google+ - <% } %><% if(filters.twitterAuth) {%> - - Connect with Twitter - <% } %> -
<% } %> -
-
+
-
-
+
+
\ No newline at end of file diff --git a/app/templates/client/app/account(auth)/signup/signup(jade).jade b/app/templates/client/app/account(auth)/signup/signup(jade).jade index 43815a21c..4638c773c 100644 --- a/app/templates/client/app/account(auth)/signup/signup(jade).jade +++ b/app/templates/client/app/account(auth)/signup/signup(jade).jade @@ -1,57 +1,39 @@ div(ng-include='"components/navbar/navbar.html"') .container .row - .col-sm-12 + .col-sm-offset-3.col-sm-6.col-xs-12 h1 Sign up - .col-sm-12 - form.form(name='form', ng-submit='register(form)', novalidate='') - .form-group(ng-class='{ "has-success": form.name.$valid && submitted,\ - "has-error": form.name.$invalid && submitted }') - label Name - input.form-control(type='text', name='name', ng-model='user.name', required='') - p.help-block(ng-show='form.name.$error.required && submitted') - | A name is required + .well + form.form(name='form', ng-submit='register(form)', novalidate='') + .form-group(ng-class='{ "has-success": form.name.$valid && submitted,\ + "has-error": form.name.$invalid && submitted }') + label Name + input.form-control(type='text', name='name', ng-model='user.name', required='') + p.help-block(ng-show='form.name.$error.required && submitted') + | A name is required - .form-group(ng-class='{ "has-success": form.email.$valid && submitted,\ - "has-error": form.email.$invalid && submitted }') - label Email - input.form-control(type='email', name='email', ng-model='user.email', required='', mongoose-error='') - p.help-block(ng-show='form.email.$error.email && submitted') - | Doesn't look like a valid email. - p.help-block(ng-show='form.email.$error.required && submitted') - | What's your email address? - p.help-block(ng-show='form.email.$error.mongoose') - | {{ errors.email }} + .form-group(ng-class='{ "has-success": form.email.$valid && submitted,\ + "has-error": form.email.$invalid && submitted }') + label Email + input.form-control(type='email', name='email', ng-model='user.email', required='', mongoose-error='') + p.help-block(ng-show='form.email.$error.email && submitted') + | Doesn't look like a valid email. + p.help-block(ng-show='form.email.$error.required && submitted') + | What's your email address? + p.help-block(ng-show='form.email.$error.mongoose') + | {{ errors.email }} - .form-group(ng-class='{ "has-success": form.password.$valid && submitted,\ - "has-error": form.password.$invalid && submitted }') - label Password - input.form-control(type='password', name='password', ng-model='user.password', ng-minlength='3', required='', mongoose-error='') - p.help-block(ng-show='(form.password.$error.minlength || form.password.$error.required) && submitted') - | Password must be at least 3 characters. - p.help-block(ng-show='form.password.$error.mongoose') - | {{ errors.password }} + .form-group(ng-class='{ "has-success": form.password.$valid && submitted,\ + "has-error": form.password.$invalid && submitted }') + label Password + input.form-control(type='password', name='password', ng-model='user.password', ng-minlength='3', required='', mongoose-error='') + p.help-block(ng-show='(form.password.$error.minlength || form.password.$error.required) && submitted') + | Password must be at least 3 characters. + p.help-block(ng-show='form.password.$error.mongoose') + | {{ errors.password }} - div - button.btn.btn-inverse.btn-lg.btn-login(type='submit') - | Sign up - = ' ' - a.btn.btn-default.btn-lg.btn-register(href='/login') - | Login - -<% if(filters.oauth) {%> - hr - - div<% if(filters.facebookAuth) {%> - a.btn.btn-facebook(href='', ng-click='loginOauth("facebook")') - i.fa.fa-facebook - | Connect with Facebook - = ' '<% } %><% if(filters.googleAuth) {%> - a.btn.btn-google-plus(href='', ng-click='loginOauth("google")') - i.fa.fa-google-plus - | Connect with Google+ - = ' '<% } %><% if(filters.twitterAuth) {%> - a.btn.btn-twitter(href='', ng-click='loginOauth("twitter")') - i.fa.fa-twitter - | Connect with Twitter<% } %><% } %> + div + button.btn.btn-primary.btn-block(type='submit') + | Sign up + .col-sm-3 hr diff --git a/app/templates/client/app/app(less).less b/app/templates/client/app/app(less).less index 30639f539..13e1f2408 100644 --- a/app/templates/client/app/app(less).less +++ b/app/templates/client/app/app(less).less @@ -4,6 +4,10 @@ <% if(filters.bootstrap) { %>@icon-font-path: '/bower_components/bootstrap/fonts/';<% } %> @fa-font-path: '/bower_components/font-awesome/fonts'; +<% if (filters.bootstrap && (filters.facebookAuth || filters.twitterAuth || filters.googleAuth)) { %> +@import '/bootstrap-social/bootstrap-social'; +<% } %> + /** * App-wide Styles */ diff --git a/app/templates/client/app/app(sass).scss b/app/templates/client/app/app(sass).scss index 4b8ae7a04..b1df15167 100644 --- a/app/templates/client/app/app(sass).scss +++ b/app/templates/client/app/app(sass).scss @@ -4,6 +4,11 @@ $fa-font-path: "/bower_components/font-awesome/fonts"; @import 'bootstrap-sass-official/vendor/assets/stylesheets/bootstrap';<% } %> @import 'font-awesome/scss/font-awesome'; +<% if (filters.bootstrap && (filters.facebookAuth || filters.twitterAuth || filters.googleAuth)) { %> +@import "bootstrap-social/bootstrap-social"; +<% } %> + + /** * App-wide Styles */ diff --git a/app/templates/client/components/navbar/navbar(html).html b/app/templates/client/components/navbar/navbar(html).html index 71f8606dd..518c621c5 100644 --- a/app/templates/client/components/navbar/navbar(html).html +++ b/app/templates/client/components/navbar/navbar(html).html @@ -18,7 +18,6 @@ <% if(filters.auth) { %>