oauth signin buttons per provider spec

This commit is contained in:
Zachary Chai 2017-01-20 14:34:30 -05:00
parent 3039bd168b
commit 9057948750
8 changed files with 76 additions and 23 deletions

Binary file not shown.

After

Width:  |  Height:  |  Size: 771 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.2 KiB

View File

@ -1,10 +1,7 @@
.login { .login {
.center-panel { .center-panel {
.center-panel-size { .center-panel-size {
max-width: 600px max-width: 400px
}
.center-panel-content-size {
max-width: 500px;
} }
} }
} }

View File

@ -118,3 +118,42 @@ body[data-controller=landing][data-action=rooms].app-background {
.popover { .popover {
max-width: none; max-width: none;
} }
a.signin-link {
&:hover, &:focus {
cursor: pointer;
text-decoration: none;
}
}
.signin-link {
.signin-icon {
vertical-align: middle;
width: 35px;
height: 35px;
}
.signin-button {
background: white;
width: 250px;
border: thin solid #888;
border-radius: 2px;
white-space: nowrap;
padding: 5px;
margin-bottom: 14px;
}
.signin-icon-wrapper {
display: inline-block;
width: 40px;
}
.signin-text-wrapper {
display: inline-block;
width: 200px;
}
.signin-text {
font-family: 'Roboto', sans-serif;
vertical-align: middle;
font-size: 14px;
font-weight: bold;
color: #444;
}
}

View File

@ -23,6 +23,7 @@ with BigBlueButton; if not, see <http://www.gnu.org/licenses/>.
<%= stylesheet_link_tag 'application', media: 'all', 'data-turbolinks-track': 'reload' %> <%= stylesheet_link_tag 'application', media: 'all', 'data-turbolinks-track': 'reload' %>
<%= javascript_include_tag 'application', 'data-turbolinks-track': 'reload' %> <%= javascript_include_tag 'application', 'data-turbolinks-track': 'reload' %>
<link href="https://fonts.googleapis.com/css?family=Roboto:400,700" rel="stylesheet">
</head> </head>
<body class="app-background" data-controller="<%= params[:controller] %>" data-action="<%= params[:action] %>"> <body class="app-background" data-controller="<%= params[:controller] %>" data-action="<%= params[:action] %>">
@ -35,6 +36,9 @@ with BigBlueButton; if not, see <http://www.gnu.org/licenses/>.
<span class="logo-wrapper pull-left"> <span class="logo-wrapper pull-left">
<%= link_to image_tag("bbb-logo.png", :alt => "BigBlueButton", :class => "logo"), root_path %> <%= link_to image_tag("bbb-logo.png", :alt => "BigBlueButton", :class => "logo"), root_path %>
</span> </span>
<% unless params[:controller] == 'sessions' && params[:action] == 'new' %>
<%= render 'shared/signup' %>
<% end %>
</div> </div>
<!-- End of Header --> <!-- End of Header -->

View File

@ -1,10 +1,39 @@
<% content_for :title do %>
<div class="title">
<h2><%= t('log_in') %></h2>
</div>
<% end %>
<div class="page-wrapper login"> <div class="page-wrapper login">
<div class="container-fluid"> <div class="container-fluid">
<div class="center-panel-wrapper"> <div class="center-panel-wrapper">
<%= render layout: 'shared/center_panel' do %> <%= render layout: 'shared/center_panel' do %>
<div class="center-block center-panel-content-size col-xs-12"> <div class="center-block center-panel-content-size col-xs-12">
<%= render 'shared/signup' %> <% if omniauth_providers_configured(:twitter) %>
<%= link_to '/auth/twitter', class: "signin-link signin-link-twitter" do %>
<div class="signin-button center-block">
<div class="signin-icon-wrapper">
<%= image_tag("twitter_signin_logo.png", alt: "T", class: "signin-icon") %>
</div>
<div class="signin-text-wrapper text-center">
<span class="signin-text"><%= t('signin_text', provider: 'Twitter') %></span>
</div>
</div>
<% end %>
<% end %>
<% if omniauth_providers_configured(:google) %>
<%= link_to '/auth/google', class: "signin-link signin-link-google" do %>
<div class="signin-button center-block">
<div class="signin-icon-wrapper">
<%= image_tag("g-normal.png", alt: "G", class: "signin-icon") %>
</div>
<div class="signin-text-wrapper text-center">
<span class="signin-text"><%= t('signin_text', provider: 'Google') %></span>
</div>
</div>
<% end %>
<% end %>
</div> </div>
<% end %> <% end %>
</div> </div>

View File

@ -1,4 +1,4 @@
<span class="signup"> <span class="signup pull-right">
<% if current_user %> <% if current_user %>
<% if !@user %> <% if !@user %>
<%= link_to current_user.name, current_user.room_url %> | <%= link_to current_user.name, current_user.room_url %> |
@ -9,21 +9,5 @@
<% elsif @user %> <% elsif @user %>
<%= t('are_you', name: @user.username) %> | <%= t('are_you', name: @user.username) %> |
<%= link_to t('login'), "/auth/#{@user.provider}" %> <%= link_to t('login'), "/auth/#{@user.provider}" %>
<% else %>
<% if omniauth_providers_configured.present? %>
<span class="signup-description hidden-xs">
<%= t('oauth_signup') %>
</span>
<% end %>
<% if omniauth_providers_configured(:twitter) %>
<%= link_to('/auth/twitter', :class => "btn icon btn-lg btn-social-icon btn-twitter") do %>
<span class="fa fa-twitter"></span>
<% end %>
<% end %>
<% if omniauth_providers_configured(:google) %>
<%= link_to('/auth/google', :class => "btn icon btn-lg btn-social-icon btn-google") do %>
<span class="fa fa-google"></span>
<% end %>
<% end %>
<% end %> <% end %>
</span> </span>

View File

@ -89,7 +89,6 @@ en-US:
phrase1: "One of your recordings has just been made available." phrase1: "One of your recordings has just been made available."
phrase2: "Access the following website to view it and publish to other users: %{url}" phrase2: "Access the following website to view it and publish to other users: %{url}"
subject: "Your recording is ready!" subject: "Your recording is ready!"
oauth_signup: Signup for customized meetings
past_recordings: Past Recordings past_recordings: Past Recordings
footer_html: "%{greenlight_link} build %{version}, Powered by %{bbb_link}" footer_html: "%{greenlight_link} build %{version}, Powered by %{bbb_link}"
presentation: Presentation presentation: Presentation
@ -97,6 +96,7 @@ en-US:
published: Published published: Published
return_to_room: Return to your personal room return_to_room: Return to your personal room
session_url_explanation: The meeting will be taking place using the following URL session_url_explanation: The meeting will be taking place using the following URL
signin_text: Log in with %{provider}
signup_description: Login for customized sessions signup_description: Login for customized sessions
start: Start start: Start
start_meeting: Start Meeting start_meeting: Start Meeting