made settings page responsive and edited route from connections/new to add_contact
This commit is contained in:
parent
6a1992a29f
commit
da9e799436
|
@ -14,7 +14,7 @@ $gray-base: $gray;
|
||||||
$brand-primary: $primary;
|
$brand-primary: $primary;
|
||||||
$brand-success: $green;
|
$brand-success: $green;
|
||||||
$brand-info: $yellow;
|
$brand-info: $yellow;
|
||||||
$brand-danger: $red;
|
$brand-danger: $warn;
|
||||||
$brand-warning: $orange;
|
$brand-warning: $orange;
|
||||||
$brand-secondary: $secondary;
|
$brand-secondary: $secondary;
|
||||||
|
|
||||||
|
@ -52,3 +52,4 @@ $border-radius-small: 2px;
|
||||||
}
|
}
|
||||||
|
|
||||||
// Override other variables below!
|
// Override other variables below!
|
||||||
|
$input-border-focus: $primary;
|
||||||
|
|
|
@ -8,6 +8,7 @@ $orange: #E67E22;
|
||||||
$green: #32B796;
|
$green: #32B796;
|
||||||
$gray: #000000;
|
$gray: #000000;
|
||||||
$light-gray: #F4F4F4;
|
$light-gray: #F4F4F4;
|
||||||
|
$warn: #3d63cc;
|
||||||
|
|
||||||
$primary: #F55E4F;
|
$primary: #F55E4F;
|
||||||
$secondary: #5ED17E;
|
$secondary: #5ED17E;
|
||||||
|
|
|
@ -91,3 +91,22 @@ input:checked + .slider:before {
|
||||||
.padding-right {
|
.padding-right {
|
||||||
padding-right: 10px;
|
padding-right: 10px;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.margin-right {
|
||||||
|
margin-right: 10px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.flex-inline {
|
||||||
|
display: flex;
|
||||||
|
flex-direction: row;
|
||||||
|
align-items: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
.center-screen {
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
justify-content: center;
|
||||||
|
align-items: center;
|
||||||
|
text-align: center;
|
||||||
|
min-height: 80vh;
|
||||||
|
}
|
||||||
|
|
|
@ -4,6 +4,7 @@
|
||||||
display:flex;
|
display:flex;
|
||||||
flex-direction: column;
|
flex-direction: column;
|
||||||
justify-content: center;
|
justify-content: center;
|
||||||
|
text-align: center;
|
||||||
|
|
||||||
h2 {
|
h2 {
|
||||||
font-size: 1.5em;
|
font-size: 1.5em;
|
||||||
|
@ -21,20 +22,14 @@
|
||||||
margin-right: .5em;
|
margin-right: .5em;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
.profile-pic {
|
|
||||||
display: flex;
|
|
||||||
align-items: center;
|
|
||||||
margin-right: 3em;
|
|
||||||
img {
|
|
||||||
width: 10em;
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
|
}
|
||||||
|
|
||||||
.profile-text {
|
.profile-text {
|
||||||
display: flex;
|
display: flex;
|
||||||
flex-direction: column;
|
flex-direction: column;
|
||||||
justify-content: center;
|
justify-content: center;
|
||||||
color: #f2321f;
|
color: $primary;
|
||||||
h1 {
|
h1 {
|
||||||
margin: 0 0 .5em 0 ;
|
margin: 0 0 .5em 0 ;
|
||||||
}
|
}
|
||||||
|
@ -45,9 +40,20 @@
|
||||||
font-style: italic;
|
font-style: italic;
|
||||||
color: white;
|
color: white;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
|
||||||
|
|
||||||
}
|
.vcenter {
|
||||||
|
display: inline-block;
|
||||||
|
vertical-align: middle;
|
||||||
|
float: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
.vertical-padding {
|
||||||
|
padding-top: 5px;
|
||||||
|
padding-bottom: 5px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.vertical-margin {
|
||||||
|
margin-top: 5px;
|
||||||
|
margin-bottom: 5px;
|
||||||
|
}
|
||||||
|
|
|
@ -1,6 +1,5 @@
|
||||||
class ConnectionsController < ApplicationController
|
class ConnectionsController < ApplicationController
|
||||||
def new
|
def new
|
||||||
|
|
||||||
end
|
end
|
||||||
|
|
||||||
def create
|
def create
|
||||||
|
@ -10,9 +9,17 @@ class ConnectionsController < ApplicationController
|
||||||
@connection.contact = contact_user
|
@connection.contact = contact_user
|
||||||
|
|
||||||
if @connection.save
|
if @connection.save
|
||||||
|
contact_message = nil
|
||||||
|
if contact_user.first_name.nil? || contact_user.last_name.nil?
|
||||||
|
contact_message = "#{contact_user.email}"
|
||||||
|
else
|
||||||
|
contact_message = "#{contact_user.first_name} #{contact_user.last_name}"
|
||||||
|
end
|
||||||
|
flash[:notice] = "Added #{contact_message} to contacts"
|
||||||
redirect_to contacts_path
|
redirect_to contacts_path
|
||||||
else
|
else
|
||||||
|
flash[:alert] = "Invalid email address!"
|
||||||
|
render 'new'
|
||||||
end
|
end
|
||||||
end
|
end
|
||||||
end
|
end
|
||||||
|
|
|
@ -1,9 +1,23 @@
|
||||||
<div class="align-center">
|
<% params["action"] = "Add contact" %>
|
||||||
<h2>Add a new contact:</h2>
|
|
||||||
<%= form_for User.new, url: connections_path do |f| %>
|
|
||||||
<%= f.label :email, class: "email_label_color" %>:
|
|
||||||
<%= f.text_field :email %>
|
|
||||||
|
|
||||||
<%= f.submit %>
|
<div class="center-screen">
|
||||||
|
<div class="align-center">
|
||||||
|
<div class="container">
|
||||||
|
<div class="row">
|
||||||
|
<div class="col-xs-offset-2 col-xs-8 col-xs-offset-2">
|
||||||
|
<h2>Enter an email address:</h2>
|
||||||
|
</div>
|
||||||
|
<%= simple_form_for User.new, url: connections_path, class: "input-group" do |f| %>
|
||||||
|
<div class="col-xs-offset-2 col-xs-8 col-xs-offset-2 ">
|
||||||
|
<div class="flex-inline">
|
||||||
|
<%= f.input_field :email, class: "form-control margin-right" %>
|
||||||
|
<div class="input-group-append">
|
||||||
|
<%= f.button :submit, value: "Add Contact" , class: "btn btn-primary" %>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
<% end %>
|
<% end %>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
|
@ -8,7 +8,7 @@
|
||||||
<div class="contacts">
|
<div class="contacts">
|
||||||
<div class="contacts-header">
|
<div class="contacts-header">
|
||||||
<h2>Contacts</h2>
|
<h2>Contacts</h2>
|
||||||
<%= link_to new_connection_path do %>
|
<%= link_to add_contact_path do %>
|
||||||
<i class="fas fa-plus-square"></i>
|
<i class="fas fa-plus-square"></i>
|
||||||
<% end %>
|
<% end %>
|
||||||
</div>
|
</div>
|
||||||
|
|
|
@ -60,15 +60,15 @@
|
||||||
<div>
|
<div>
|
||||||
<div class="card card-form card-form-no-hover">
|
<div class="card card-form card-form-no-hover">
|
||||||
<%= t.label :language, class:'padding-right no-margin font-weight-normal' %>
|
<%= t.label :language, class:'padding-right no-margin font-weight-normal' %>
|
||||||
<%= t.input_field :language, collection: languages.sort, class:'input-field-text-black input-dropdown' %>
|
<%= t.input_field :language, collection: languages.sort, class:'input-field-text-black input-dropdown form-control' %>
|
||||||
</div>
|
</div>
|
||||||
<div class="card card-form card-form-no-hover">
|
<div class="card card-form card-form-no-hover">
|
||||||
<%= t.label :caption_font, class:'padding-right no-margin font-weight-normal' %>
|
<%= t.label :caption_font, class:'padding-right no-margin font-weight-normal' %>
|
||||||
<%= t.input_field :caption_font, collection: fonts.sort, class:'input-field-text-black input-dropdown' %>
|
<%= t.input_field :caption_font, collection: fonts.sort, class:'input-field-text-black input-dropdown form-control' %>
|
||||||
</div>
|
</div>
|
||||||
<div class="card card-form card-form-no-hover">
|
<div class="card card-form card-form-no-hover">
|
||||||
<%= t.label :caption_font_size, class:'padding-right no-margin font-weight-normal' %>
|
<%= t.label :caption_font_size, class:'padding-right no-margin font-weight-normal' %>
|
||||||
<%= t.input_field :caption_font_size, class:'input-field-text-black' %>
|
<%= t.input_field :caption_font_size, class:'input-field-text-black input-dropdown form-control' %>
|
||||||
</div>
|
</div>
|
||||||
<div class="card card-form card-form-no-hover">
|
<div class="card card-form card-form-no-hover">
|
||||||
<%= t.label :enable_transcript, class:'padding-right no-margin font-weight-normal' %>
|
<%= t.label :enable_transcript, class:'padding-right no-margin font-weight-normal' %>
|
||||||
|
|
|
@ -1,27 +1,28 @@
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
<div class="user-container">
|
<div class="user-container">
|
||||||
<div class="profile">
|
<div class="row">
|
||||||
<div class="profile-pic">
|
<div class="col-xs-12 col-md-3 vcenter">
|
||||||
|
<div class="profile-pic vertical-padding">
|
||||||
<% if @user.photo.url.nil? %>
|
<% if @user.photo.url.nil? %>
|
||||||
<%= image_tag "https://upload.wikimedia.org/wikipedia/commons/8/89/Portrait_Placeholder.png", class: "img-circle"%>
|
<%= image_tag "https://upload.wikimedia.org/wikipedia/commons/8/89/Portrait_Placeholder.png", class: "img-circle"%>
|
||||||
<% else %>
|
<% else %>
|
||||||
<%= cl_image_tag @user.photo, class: "img-circle"%>
|
<%= cl_image_tag @user.photo, class: "img-circle"%>
|
||||||
<% end %>
|
<% end %>
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
<div class="profile-text">
|
</div>
|
||||||
|
<div class="col-xs-12 col-md-4 vcenter">
|
||||||
|
<div class="profile-text vertical-padding">
|
||||||
<h1><%= @user.first_name %> <%= @user.last_name %></h1>
|
<h1><%= @user.first_name %> <%= @user.last_name %></h1>
|
||||||
<h2 class="italics" ><%= @user.email %></h2>
|
<h2 class="italics" ><%= @user.email %></h2>
|
||||||
</div>
|
</div>
|
||||||
|
</div>
|
||||||
<div class="flex-end">
|
<div class="col-xs-12 col-md-4 vcenter">
|
||||||
<%= link_to "Edit Information", user_edit_path(@user), class: "btn btn-primary" %>
|
<div class="flex-end vertical-padding">
|
||||||
<%= link_to "Delete Account", user_path(@user), class: "btn btn-danger", method: :delete, data: {
|
<%= link_to "Edit Information", user_edit_path(@user), class: "btn btn-primary vertical-margin" %>
|
||||||
|
<%= link_to "Delete Account", user_path(@user), class: "btn btn-danger vertical-margin", method: :delete, data: {
|
||||||
confirm: "Are you sure?"
|
confirm: "Are you sure?"
|
||||||
} %>
|
} %>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
|
|
@ -36,12 +36,11 @@ Rails.application.routes.draw do
|
||||||
# For details on the DSL available within this file, see http://guides.rubyonrails.org/routing.html
|
# For details on the DSL available within this file, see http://guides.rubyonrails.org/routing.html
|
||||||
get '/home', to: 'pages#home'
|
get '/home', to: 'pages#home'
|
||||||
|
|
||||||
|
|
||||||
get '/users/:id', to: 'users#show', as: :user
|
get '/users/:id', to: 'users#show', as: :user
|
||||||
get '/users/:id/edit', to: 'users#edit', as: :user_edit
|
get '/users/:id/edit', to: 'users#edit', as: :user_edit
|
||||||
patch '/users/:id', to: 'users#update'
|
patch '/users/:id', to: 'users#update'
|
||||||
delete '/users/:id', to: 'users#destroy'
|
delete '/users/:id', to: 'users#destroy'
|
||||||
|
|
||||||
resources :connections, only: [:create, :new]
|
resources :connections, only: [:create]
|
||||||
#get '/add_contact', to: 'connections#create'
|
get '/add_contact', to: 'connections#new', as: :add_contact
|
||||||
end
|
end
|
||||||
|
|
Loading…
Reference in New Issue