forked from External/greenlight
shared components for redesigned layout
This commit is contained in:
Zachary Chai
parent
3529e97a08
commit
551b64bb59
|
|
@ -1,15 +1,3 @@
|
|||
// Place all the styles related to the landing controller here.
|
||||
// They will automatically be included in application.css.
|
||||
// You can use Sass (SCSS) here: http://sass-lang.com/
|
||||
|
||||
// Bootstrap
|
||||
@import "bootstrap-sprockets";
|
||||
@import "bootstrap";
|
||||
@import "bootstrap-social";
|
||||
@import "font-awesome";
|
||||
|
||||
.room {
|
||||
.room-link {
|
||||
margin: 0 auto;
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,79 +0,0 @@
|
|||
/* Space out content a bit */
|
||||
body {
|
||||
padding-top: 1.5rem;
|
||||
padding-bottom: 1.5rem;
|
||||
}
|
||||
|
||||
/* Everything but the jumbotron gets side spacing for mobile first views */
|
||||
.header,
|
||||
.marketing,
|
||||
.footer {
|
||||
padding-right: 1rem;
|
||||
padding-left: 1rem;
|
||||
}
|
||||
|
||||
/* Custom page header */
|
||||
.header {
|
||||
padding-bottom: 1rem;
|
||||
border-bottom: .05rem solid #e5e5e5;
|
||||
}
|
||||
/* Make the masthead heading the same height as the navigation */
|
||||
.header h3 {
|
||||
margin-top: 0;
|
||||
margin-bottom: 0;
|
||||
line-height: 3rem;
|
||||
}
|
||||
|
||||
/* Custom page footer */
|
||||
.footer {
|
||||
padding-top: 1.5rem;
|
||||
color: #777;
|
||||
border-top: .05rem solid #e5e5e5;
|
||||
}
|
||||
|
||||
/* Customize container */
|
||||
@media (min-width: 48em) {
|
||||
.container {
|
||||
max-width: 72rem;
|
||||
}
|
||||
}
|
||||
.container-narrow > hr {
|
||||
margin: 2rem 0;
|
||||
}
|
||||
|
||||
/* Main marketing message and sign up button */
|
||||
.jumbotron {
|
||||
text-align: center;
|
||||
border-bottom: .05rem solid #e5e5e5;
|
||||
}
|
||||
.jumbotron .btn {
|
||||
padding: .75rem 1.5rem;
|
||||
font-size: 1.5rem;
|
||||
}
|
||||
|
||||
/* Supporting marketing content */
|
||||
.marketing {
|
||||
margin: 3rem 0;
|
||||
}
|
||||
.marketing p + h4 {
|
||||
margin-top: 1.5rem;
|
||||
}
|
||||
|
||||
/* Responsive: Portrait tablets and up */
|
||||
@media screen and (min-width: 48em) {
|
||||
/* Remove the padding we set earlier */
|
||||
.header,
|
||||
.marketing,
|
||||
.footer {
|
||||
padding-right: 0;
|
||||
padding-left: 0;
|
||||
}
|
||||
/* Space out the masthead */
|
||||
.header {
|
||||
margin-bottom: 2rem;
|
||||
}
|
||||
/* Remove the bottom border on the jumbotron for visual effect */
|
||||
.jumbotron {
|
||||
border-bottom: 0;
|
||||
}
|
||||
}
|
||||
|
|
@ -10,7 +10,7 @@ html, body {
|
|||
}
|
||||
|
||||
.header {
|
||||
margin: 20px 40px;
|
||||
padding: 20px 40px;
|
||||
|
||||
.logo {
|
||||
max-width: 150px;
|
||||
|
|
@ -19,20 +19,14 @@ html, body {
|
|||
}
|
||||
|
||||
.footer {
|
||||
margin: 20px;
|
||||
padding: 20px;
|
||||
}
|
||||
|
||||
.page-header {
|
||||
margin-top: 60px;
|
||||
margin-top: 100px;
|
||||
border: 0;
|
||||
}
|
||||
|
||||
.vertical-center {
|
||||
display: inline-block;
|
||||
vertical-align: middle;
|
||||
float: none;
|
||||
}
|
||||
|
||||
.content-box {
|
||||
.center-block {
|
||||
float: none;
|
||||
|
|
|
|||
|
|
@ -1,3 +0,0 @@
|
|||
<div id="landing_page_footer_message">
|
||||
<p>Bookmark this page to reuse this meeting URL<% if @resource == "meetings" %>, or click refresh button to generate a new meeting URL<% end %></p>
|
||||
</div>
|
||||
|
|
@ -1,15 +0,0 @@
|
|||
<div id="landing_page_footer_oauth_append">
|
||||
<% if current_user.nil? %>
|
||||
<p>You can have a personal URL (with recordings) by signing in below</p>
|
||||
|
||||
<div class="text-center">
|
||||
<%= link_to('/auth/twitter', :class => "btn icon btn-lg btn-social-icon btn-twitter") do %>
|
||||
<span class="fa fa-twitter"></span>
|
||||
<% end %>
|
||||
<%= link_to('/auth/google', :class => "btn icon btn-lg btn-social-icon btn-google") do %>
|
||||
<span class="fa fa-google"></span>
|
||||
<% end %>
|
||||
</div>
|
||||
<% end %>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -1,32 +0,0 @@
|
|||
<div class="jumbotron">
|
||||
<!-- Meeting URL -->
|
||||
<h4 class="display-3">
|
||||
<div id="landing_page_url" class="center-block">
|
||||
<form id="url_form" class="form-inline">
|
||||
<div class="form-group">
|
||||
<span id="meeting_url"><%= resource_url(@resource, @meeting_token) %></span>
|
||||
</div>
|
||||
<% if @refreshable %>
|
||||
<button id="url_form_button" type="button" class="btn btn-default" data-url="<%= new_meeting_path() %>">
|
||||
<span class="glyphicon glyphicon-refresh"></span>
|
||||
</button>
|
||||
<% end %>
|
||||
</form>
|
||||
</div>
|
||||
</h4>
|
||||
|
||||
<!-- Join form -->
|
||||
<div id="landing_page_join">
|
||||
<form id="join_form" class="form-inline">
|
||||
<% if current_user.nil? %>
|
||||
<div class="form-group">
|
||||
<label for="join_form_name" class="sr-only">Name</label>
|
||||
<input id="join_form_name" type="text" class="form-control input" placeholder="Your name" required>
|
||||
</div>
|
||||
<% else %>
|
||||
<input id="join_form_name" type="hidden" value="<%= current_user.name %>">
|
||||
<% end %>
|
||||
<button id="join_form_button" type="button" class="btn btn-success" data-url="<%= bbb_join_path(@resource, @meeting_token) %>">Join</button>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -0,0 +1,14 @@
|
|||
<div class="content-box">
|
||||
<div class="row">
|
||||
<div class="center-block col-sm-4">
|
||||
<div class="panel panel-default">
|
||||
<div class="panel-body">
|
||||
<h3 class="title-wrapper text-center">
|
||||
<%= yield :title %>
|
||||
</h3>
|
||||
<%= yield %>
|
||||
</div>
|
||||
<%= yield :footer %>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -0,0 +1,9 @@
|
|||
<div class="input-group input-spacing">
|
||||
<% @current_user = user %>
|
||||
<%= text_field :current_user, :name, class: 'form-control meeting-user-name', placeholder: 'Enter your name' %>
|
||||
<span class="input-group-btn">
|
||||
<button type="button" class="btn btn-primary meeting-join">
|
||||
Join
|
||||
</button>
|
||||
</span>
|
||||
</div>
|
||||
|
|
@ -0,0 +1,13 @@
|
|||
<div <%= "hidden" if hidden %> class="meetin-url-wrapper">
|
||||
<div class="input-group">
|
||||
<input type="text" readonly="readonly" class="form-control meeting-url" data-path="<%= @user.room_url if @user %>"/>
|
||||
<span class="input-group-btn">
|
||||
<button type="button" class="btn btn-default meeting-url-copy">
|
||||
<i class="fa fa-paperclip" aria-hidden="true"></i>
|
||||
</button>
|
||||
</span>
|
||||
</div>
|
||||
<small>
|
||||
<em>Copy this URL to invite others to the meeting</em>
|
||||
</small>
|
||||
</div>
|
||||
|
|
@ -0,0 +1,7 @@
|
|||
<div class="row">
|
||||
<div class="page-header">
|
||||
<h1 class="text-center">
|
||||
<%= title %>
|
||||
</h1>
|
||||
</div>
|
||||
</div>
|
||||
Loading…
Reference in New Issue