Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Fixes #136 UI design mismatch fix bug #138

Merged
merged 12 commits into from
Feb 9, 2022
Merged

Fixes #136 UI design mismatch fix bug #138

Show file tree
Hide file tree
Changes from 10 commits
Commits
Show all changes
12 commits
Select commit Hold shift + click to select a range
e4a3ae8
team new user / edit user modal max margin fixed
Feb 9, 2022
28524db
adnew user input box design fix
Feb 9, 2022
554e170
new user invite employee selected by default
Feb 9, 2022
82f57ae
show hand icon when hover over role
Feb 9, 2022
1e698dd
minor fix
Feb 9, 2022
a8e3731
letter spacing in team page for header and invitation pending fixed
Feb 9, 2022
e39da7e
close button in new and edit modal radius and colour changed
Feb 9, 2022
29c8344
close button backgroung color changed
Feb 9, 2022
49e975e
moved placeholder to en.yml
Feb 9, 2022
2eb5322
added background hover effect to edit and delete icon
Feb 9, 2022
4c46732
removed extra code
Feb 9, 2022
62fa689
changed placeholder in en.yml
Feb 9, 2022
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
20 changes: 10 additions & 10 deletions app/views/devise/invitations/_new.html.erb
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -4,7 +4,7 @@
<div class="mt-4">
<div class="field">
<div class="field_with_errors">
<label class="tracking-wider block text-xs font-semibold text-miru-dark-purple-1000"><%= t('team.form_name') %></label>
<label class="tracking-wider block text-xs font-normal text-miru-dark-purple-1000"><%= t('team.form_name') %></label>
<%=
if f.object.errors.include?(:first_name)
error_message_on(f.object, :first_name)
Expand All @@ -15,10 +15,10 @@
</div>
<div class="mt-1 flex -space-x-px">
<div class="mr-4 w-1/2 flex-1 min-w-0">
<%= f.text_field :first_name, class: "#{error_message_class(f.object, :first_name)}" %>
<%= f.text_field :first_name, placeholder: t('team.placeholder_firstname'), class: "rounded tracking-wider appearance-none border block w-full px-3 py-2 bg-miru-gray-100 h-8 shadow-sm font-medium text-sm text-miru-dark-purple-1000 focus:outline-none sm:text-base #{error_message_class(f.object, :first_name)}" %>
</div>
<div class="w-1/2 flex-1 min-w-0">
<%= f.text_field :last_name, class: "#{error_message_class(f.object, :last_name)}" %>
<%= f.text_field :last_name, placeholder: t('team.placeholder_lastname'), class: "rounded tracking-wider appearance-none border block w-full px-3 py-2 bg-miru-gray-100 h-8 shadow-sm font-medium text-sm text-miru-dark-purple-1000 focus:outline-none sm:text-base #{error_message_class(f.object, :last_name)}" %>
</div>
</div>
</div>
Expand All @@ -27,33 +27,33 @@
<div class="mt-4">
<div class="field">
<div class="field_with_errors">
<label class="tracking-wider block text-xs font-semibold text-miru-dark-purple-1000">
<label class="tracking-wider block text-xs font-normal text-miru-dark-purple-1000">
<%= t('team.form_email') %>
</label>
<%= error_message_on(f.object, field) %>
</div>
<div class="mt-1">
<%= f.text_field field, class: "#{error_message_class(f.object, field)}" %>
<%= f.text_field field, placeholder: t('team.placeholder_email'), class: "rounded tracking-wider appearance-none border block w-full px-3 py-2 bg-miru-gray-100 h-8 shadow-sm font-medium text-sm text-miru-dark-purple-1000 focus:outline-none sm:text-base #{error_message_class(f.object, field)}" %>
</div>
</div>
</div>
<% end -%>

<div class="mt-4">
<div class="field">
<label class="tracking-wider block text-xs font-semibold text-miru-dark-purple-1000"><%= t('team.form_role') %></label>
<label class="tracking-wider block text-xs font-normal text-miru-dark-purple-1000"><%= t('team.form_role') %></label>
<div class="mt-1">
<div class="space-y-4 sm:flex sm:items-center sm:space-y-0 sm:space-x-10">
<div class="flex items-center">
<%= f.radio_button :roles, 'Admin', class: "focus:ring-miru-han-purple-1000 h-4 w-4 border-miru-han-purple-1000 text-miru-dark-purple-1000" %>
<label for="admin" class="ml-3 block text-sm font-semibold text-miru-dark-purple-1000">
<%= f.radio_button :roles, 'Admin', class: "focus:ring-miru-han-purple-1000 h-4 w-4 border-miru-han-purple-1000 text-miru-dark-purple-1000 cursor-pointer" %>
<label for="admin" class="ml-3 block text-sm font-medium text-miru-dark-purple-1000">
<%= t('team.form_admin') %>
</label>
</div>

<div class="flex items-center">
<%= f.radio_button :roles, 'Employee', class: "focus:ring-miru-han-purple-1000 h-4 w-4 border-miru-han-purple-1000 text-miru-dark-purple-1000" %>
<label for="Employee" class="ml-3 block text-sm font-semibold text-miru-dark-purple-1000">
<%= f.radio_button :roles, 'Employee', :checked=>true , class: "focus:ring-miru-han-purple-1000 h-4 w-4 border-miru-han-purple-1000 text-miru-dark-purple-1000 cursor-pointer" %>
<label for="Employee" class="ml-3 block text-sm font-medium text-miru-dark-purple-1000">
<%= t('team.form_employee') %>
</label>
</div>
Expand Down
6 changes: 3 additions & 3 deletions app/views/team/_form.html.erb
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -29,15 +29,15 @@
<div class="mt-1">
<div class="space-y-4 sm:flex sm:items-center sm:space-y-0 sm:space-x-10">
<div class="flex items-center">
<%= f.radio_button :roles, "admin", :checked=>(@user.primary_role.titlecase == "Admin"), class: "focus:ring-miru-han-purple-1000 h-4 w-4 border-miru-han-purple-1000 text-miru-dark-purple-1000" %>
<%= f.radio_button :roles, "admin", :checked=>(@user.primary_role.titlecase == "Admin"), class: "focus:ring-miru-han-purple-1000 h-4 w-4 border-miru-han-purple-1000 text-miru-dark-purple-1000 cursor-pointer" %>
<label for="admin" class="ml-3 block text-sm font-medium text-miru-dark-purple-1000">
<%= t('team.form_admin') %>
</label>
</div>

<div class="flex items-center">
<%= f.radio_button :roles, "employee", :checked=>(@user.primary_role.titlecase == "Employee"), class: "focus:ring-miru-han-purple-1000 h-4 w-4 border-miru-han-purple-1000 text-miru-dark-purple-1000" %>
<label for="Employee" class="ml-3 block text-sm font-medium text-miru-dark-purple-1000">
<%= f.radio_button :roles, "employee", :checked=>(@user.primary_role.titlecase == "Employee"), class: "focus:ring-miru-han-purple-1000 h-4 w-4 border-miru-han-purple-1000 text-miru-dark-purple-1000 cursor-pointer" %>
<label for="Employee" class="ml-3 block text-sm font-medium text-miru-dark-purple-1000">
<%= t('team.form_employee') %>
</label>
</div>
Expand Down
10 changes: 6 additions & 4 deletions app/views/team/_team.html.erb
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -22,13 +22,13 @@
<td id="pending-<%= member.id %>" class="px-3 py-3 whitespace-nowrap">
<% if current_user.has_any_role?(:owner, :admin) %>
<% if member.unconfirmed_email? %>
<span class="px-2 inline-flex text-xs leading-5 tracking-wider font-semibold rounded-full bg-miru-han-purple-100 text-miru-han-purple-1000">
<span class="px-2 inline-flex text-xs leading-5 tracking-widest font-semibold rounded-full bg-miru-han-purple-100 text-miru-han-purple-1000">
<%= t('team.reconfirmation') %>
</span>
<% else %>
<% unless member.invitation_accepted? %>
<% if (member.id != current_user.id) %>
<span class="px-2 inline-flex text-xs leading-5 tracking-wider font-semibold rounded-full bg-miru-han-purple-100 text-miru-han-purple-1000">
<span class="px-2 inline-flex text-xs leading-5 tracking-widest font-semibold rounded-full bg-miru-han-purple-100 text-miru-han-purple-1000">
<%= t('team.invitation') %>
</span>
<% end %>
Expand All @@ -39,12 +39,14 @@
<td id="full_name-<%= member.id %>" class="px-3 py-3 whitespace-nowrap text-right text-sm font-medium">
<% if current_user.has_any_role?(:owner, :admin) %>
<%= link_to edit_team_path(member), remote: true do %>
<img id="mid-<%= member.id %>" class="bottom h-6 w-6" src="<%= image_url 'edit_image_button.svg' %>" onclick="openModal('another-modal')">
<img id="mid-<%= member.id %>" class="bottom h-6 w-6p-2 rounded hover:bg-opacity-20 hover:bg-miru-gray-1000" src="<%= image_url 'edit_image_button.svg' %>" onclick="openModal('another-modal')">
<% end %>
<% end %>
</td>
<td class="px-4 py-4 whitespace-nowrap text-right text-sm font-medium">
<% if current_user.has_any_role?(:owner, :admin) %>
<%= link_to image_tag("#{image_url 'delete_image_button.svg'}", class:" h-6 w-6"),team_path(member), method: :delete, class: ""%>
<%= link_to team_path(member), method: :delete do %>
<img class="bottom h-6 w-6p-2 rounded hover:bg-opacity-20 hover:bg-miru-gray-1000" src="<%= image_url 'delete_image_button.svg' %>">
<% end %>
<% end %>
</td>
20 changes: 10 additions & 10 deletions app/views/team/index.html.erb
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -35,19 +35,19 @@
<table class="min-w-full divide-y divide-gray-200 mt-4">
<thead class="">
<tr>
<th scope="col" class="px-3 py-5 text-left text-xs font-normal text-miru-dark-purple-600 tracking-wider">
<th scope="col" class="px-3 py-5 text-left text-xs font-normal text-miru-dark-purple-600 tracking-widest">
<%= t('team.profile_picture') %>
</th>
<th scope="col" class="px-3 py-5 text-left text-xs font-normal text-miru-dark-purple-600 tracking-wider">
<th scope="col" class="px-3 py-5 text-left text-xs font-normal text-miru-dark-purple-600 tracking-widest">
<%= t('team.name') %>
</th>
<th scope="col" class="px-3 py-5 text-left text-xs font-normal text-miru-dark-purple-600 tracking-wider">
<th scope="col" class="px-3 py-5 text-left text-xs font-normal text-miru-dark-purple-600 tracking-widest">
<%= t('team.email_id') %>
</th>
<th scope="col" class="px-3 py-5 text-left text-xs font-normal text-miru-dark-purple-600 tracking-wider">
<th scope="col" class="px-3 py-5 text-left text-xs font-normal text-miru-dark-purple-600 tracking-widest">
<%= t('team.role') %>
</th>
<th scope="col" class="px-3 py-5 text-left text-xs font-normal text-miru-dark-purple-600 tracking-wider">
<th scope="col" class="px-3 py-5 text-left text-xs font-normal text-miru-dark-purple-600 tracking-widest">

</th>
<th scope="col" class="relative px-3 py-5">
Expand All @@ -71,12 +71,12 @@

<!--Modal 1-->
<div class="px-5 main-modal fixed w-full inset-0 z-50 overflow-hidden flex justify-center items-center animated fadeIn faster" style="background-color: rgba(29, 26, 49,0.6)">
<div class="shadow-lg modal-container bg-white w-full sm:w-4/12 md:max-w-11/12 mx-auto rounded-xl shadow-lg z-50 overflow-y-auto">
<div class="shadow-lg modal-container bg-white w-full sm:max-w-md mx-auto rounded-xl shadow-lg z-50 overflow-y-auto">
<div class="modal-content py-4 text-left px-3">
<div class="flex justify-between items-center mx-3">
<h6 class="text-base font-extrabold"><%= t('team.create_new_user') %></h6>
<div class="modal-close cursor-pointer z-50" onclick="modalClose('main-modal')">
<img src="<%= image_url 'close_button.svg' %>">
<img src="<%= image_url 'close_button.svg' %>" class="p-2 rounded hover:bg-opacity-20 hover:bg-miru-gray-1000">
</div>
</div>
<div class="mb-3 mx-3 flex justify-center">
Expand All @@ -89,12 +89,12 @@

<!--Modal 2-->
<div class="px-5 another-modal fixed w-full inset-0 z-50 overflow-hidden flex justify-center items-center animated fadeIn faster" style="background-color: rgba(29, 26, 49,0.6)">
<div class="shadow-lg modal-container bg-white w-full sm:w-4/12 md:max-w-11/12 mx-auto rounded-xl shadow-lg z-50 overflow-y-auto">
<div class="shadow-lg modal-container bg-white w-full sm:max-w-md mx-auto rounded-xl shadow-lg z-50 overflow-y-auto">
<div class="modal-content py-4 text-left px-3">
<div class="mx-3 flex justify-between items-center">
<div class="flex justify-between items-center mx-3">
<h6 class="text-base font-extrabold"><%= t('team.update_user') %></h6>
<div class="modal-close cursor-pointer z-50 ml-" onclick="modalClose('another-modal')">
<img src="<%= image_url 'close_button.svg', class: "" %>" class="p-1 rounded-full border-2 border-miru-white-1000 hover:border-miru-han-purple-1000">
<img src="<%= image_url 'close_button.svg' %>" class="p-2 rounded hover:bg-opacity-20 hover:bg-miru-gray-1000">
</div>
</div>
<div id="team-modal" class="mb-3 mx-3 flex justify-center">
Expand Down
3 changes: 3 additions & 0 deletions config/locales/en.yml
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -71,3 +71,6 @@ en:
form_role: Role
form_admin: Admin
form_employee: Employee
placeholder_firstname: First Name
placeholder_lastname: Last Name
placeholder_email: Email
aniketkaushik marked this conversation as resolved.
Show resolved Hide resolved