mirror of
https://github.com/scinote-eln/scinote-web.git
synced 2025-02-24 15:54:00 +08:00
Merge pull request #3161 from mlorb/ml-sci-5323
Implement styling for the inventories empty state [SCI-5323]
This commit is contained in:
commit
ea424e4a12
4 changed files with 83 additions and 8 deletions
app
config/locales
public/images
|
@ -519,3 +519,63 @@
|
|||
color: $color-silver-chalice;
|
||||
}
|
||||
}
|
||||
|
||||
.empty-sidebar-container {
|
||||
padding: 1em 2.5em 2em 2em;
|
||||
|
||||
.repo-template {
|
||||
border-radius: $border-radius-modal;
|
||||
box-shadow: $modal-shadow;
|
||||
font-weight: bold;
|
||||
list-style-type: none;
|
||||
padding-inline-start: 0;
|
||||
|
||||
li {
|
||||
padding: 1em;
|
||||
}
|
||||
|
||||
.fas-custom {
|
||||
float: right;
|
||||
}
|
||||
}
|
||||
|
||||
.instructions {
|
||||
@include font-main;
|
||||
padding: .75em .25em;
|
||||
}
|
||||
}
|
||||
|
||||
.empty-repositories {
|
||||
.content-header {
|
||||
align-items: center;
|
||||
border-bottom: $border-tertiary;
|
||||
display: flex;
|
||||
height: 4em;
|
||||
margin-left: -2em;
|
||||
padding-left: 2em;
|
||||
width: calc(100% + 4em);
|
||||
|
||||
h1 {
|
||||
margin: 0;
|
||||
}
|
||||
}
|
||||
|
||||
.content-body {
|
||||
text-align: center;
|
||||
|
||||
.description {
|
||||
@include font-main;
|
||||
color: $color-silver-chalice;
|
||||
margin: auto;
|
||||
margin-bottom: 2em;
|
||||
max-width: 570px;
|
||||
}
|
||||
}
|
||||
|
||||
.empty-inventory-img {
|
||||
display: block;
|
||||
margin: auto;
|
||||
margin-top: 60px;
|
||||
max-height: 290px;
|
||||
}
|
||||
}
|
||||
|
|
|
@ -1,27 +1,38 @@
|
|||
<% provide(:head_title, t('libraries.index.head_title')) %>
|
||||
<% provide(:container_class, 'no-second-nav-container') %>
|
||||
|
||||
<%= render partial: 'sidebar', locals: { repositories: @repositories, archived: false } %>
|
||||
<div class="content-pane flexible repositories-index" data-readonly="<%= !current_user.is_admin_of_team?(current_team) %>">
|
||||
<% provide(:sidebar_url, sidebar_repositories_path) %>
|
||||
<% provide(:sidebar_title, t('sidebar.repositories.sidebar_title')) %>
|
||||
<%= content_for :sidebar do %>
|
||||
<div class="empty-sidebar-container">
|
||||
<ul class="repo-template">
|
||||
<li><%= t('repositories.index.sidebar_repo1') %></li>
|
||||
<li><%= t('repositories.index.sidebar_repo2') %><%= draw_custom_icon('i-shared') %></li>
|
||||
<li><%= t('repositories.index.sidebar_repo3') %></li>
|
||||
</ul>
|
||||
<div class="instructions">
|
||||
<%= t('repositories.index.sidebar_instructions') %>
|
||||
</div>
|
||||
</div>
|
||||
<% end %>
|
||||
|
||||
<div class="content-pane flexible empty-repositories" data-readonly="<%= !current_user.is_admin_of_team?(current_team) %>">
|
||||
<div class="content-header">
|
||||
<h1 data-view-mode="active"><%= t('libraries.index.head_title') %></h1>
|
||||
</div>
|
||||
<div class="content-body">
|
||||
<%= image_tag('/images/empty_inventory_state.png', class: 'empty-inventory-img') %>
|
||||
<h1>
|
||||
<%= t('repositories.index.empty_title') %>
|
||||
</h1>
|
||||
<% if can_create_repositories?(current_team) %>
|
||||
<h5>
|
||||
<%= t('repositories.index.empty_description_with_create') %>
|
||||
</h5>
|
||||
<div class="description"><%= t('repositories.index.empty_description_with_create') %></div>
|
||||
<a id="createRepoBtn" class="btn btn-primary create-new-repository" data-remote="true" href="<%= create_modal_team_repositories_path(current_team) %>">
|
||||
<span class="fas fa-plus"></span>
|
||||
<span class="hidden-xs"><%= t('libraries.index.no_libraries.create_new_button') %></span>
|
||||
</a>
|
||||
<% else %>
|
||||
<h5>
|
||||
<%= t('repositories.index.empty_description_no_create') %>
|
||||
</h5>
|
||||
<div class="description"><%= t('repositories.index.empty_description_no_create') %></div>
|
||||
<% end %>
|
||||
</div>
|
||||
</div>
|
||||
|
|
|
@ -1231,6 +1231,10 @@ en:
|
|||
empty_title: "Your team has no inventories yet"
|
||||
empty_description_no_create: "It would be a shame to waste all this space. Sadly you don’t have permission to add inventories. You can ask your team admin to grant you that permission."
|
||||
empty_description_with_create: "It would be a shame to waste all this space. Create your first inventory now"
|
||||
sidebar_instructions: "This is where a list of inventories will appear once they are created. This list will allow you to quickly jump from one inventory to another"
|
||||
sidebar_repo1: "Reagents"
|
||||
sidebar_repo2: "Samples"
|
||||
sidebar_repo3: "Devices"
|
||||
add_new_repository_tab: "Add inventory"
|
||||
delete_flash: "\"%{name}\" inventory was successfully deleted!"
|
||||
rename_flash: "\"%{old_name}\" inventory was successfully renamed to \"%{new_name}\"!"
|
||||
|
|
BIN
public/images/empty_inventory_state.png
Normal file
BIN
public/images/empty_inventory_state.png
Normal file
Binary file not shown.
After ![]() (image error) Size: 52 KiB |
Loading…
Reference in a new issue