mirror of
https://github.com/scinote-eln/scinote-web.git
synced 2024-12-24 08:43:13 +08:00
UI CSS fixes
This commit is contained in:
parent
e82338be70
commit
8fac4c1b7c
20 changed files with 54 additions and 50 deletions
|
@ -12,14 +12,11 @@
|
|||
|
||||
.dashboard-view {
|
||||
--dashboard-widgets-gap: 30px;
|
||||
padding: 15px
|
||||
var(--dashboard-widgets-gap)
|
||||
15px
|
||||
var(--dashboard-widgets-gap);
|
||||
padding: 1.5rem 0;
|
||||
}
|
||||
|
||||
.dashboard-header {
|
||||
padding-bottom: 15px;
|
||||
padding-bottom: 1.5rem;
|
||||
}
|
||||
|
||||
.dashboard-container {
|
||||
|
|
|
@ -48,9 +48,9 @@
|
|||
}
|
||||
|
||||
.badge-indicator {
|
||||
background: $brand-accent;
|
||||
border-radius: $border-radius-tag;
|
||||
color: $color-black;
|
||||
background: var(--sn-science-blue);
|
||||
border-radius: 50%;
|
||||
color: var(--sn-white);
|
||||
font-size: 10px;
|
||||
margin-left: -8px;
|
||||
}
|
||||
|
|
|
@ -63,7 +63,7 @@
|
|||
}
|
||||
.protocol-description {
|
||||
margin-bottom: 2em;
|
||||
padding-left: 1.5em;
|
||||
padding-left: 2.5rem;
|
||||
}
|
||||
|
||||
.protocol-steps {
|
||||
|
|
|
@ -78,7 +78,7 @@
|
|||
color: var(--sn-black);
|
||||
display: inline-flex;
|
||||
gap: .5rem;
|
||||
padding: .5em;
|
||||
padding: .5rem;
|
||||
text-decoration: none;
|
||||
|
||||
.fas {
|
||||
|
@ -183,6 +183,8 @@
|
|||
}
|
||||
|
||||
.task-details {
|
||||
padding-left: 2.5rem;
|
||||
|
||||
.fas.block-icon {
|
||||
margin-right: 8px;
|
||||
}
|
||||
|
@ -406,6 +408,7 @@
|
|||
|
||||
.task-notes {
|
||||
display: inline-block;
|
||||
padding-left: 2rem;
|
||||
position: relative;
|
||||
width: 100%;
|
||||
|
||||
|
|
|
@ -11,6 +11,7 @@
|
|||
}
|
||||
|
||||
#assigned-items-container {
|
||||
padding-left: 2.5rem;
|
||||
padding-top: 10px;
|
||||
|
||||
.assigned-repository {
|
||||
|
|
|
@ -42,7 +42,7 @@
|
|||
padding: 1.5rem;
|
||||
position: absolute;
|
||||
right: 0;
|
||||
top: calc(var(--top-navigation-height) - .5em);
|
||||
top: calc(var(--top-navigation-height) - 1.5rem);
|
||||
width: 400px;
|
||||
|
||||
.sci--navigation--notificaitons-flyout-title {
|
||||
|
|
|
@ -50,14 +50,15 @@
|
|||
align-items: center;
|
||||
color: $color-volcano;
|
||||
display: inline-flex;
|
||||
padding: .5em;
|
||||
gap: .5rem;
|
||||
padding: .5rem;
|
||||
text-decoration: none;
|
||||
|
||||
.fas {
|
||||
margin-right: 5px;
|
||||
}
|
||||
|
||||
&:not(.collapsed) .fas {
|
||||
&:not(.collapsed) .sn-icon {
|
||||
@include rotate(90deg);
|
||||
}
|
||||
}
|
||||
|
@ -104,7 +105,7 @@
|
|||
}
|
||||
|
||||
.protocol-details {
|
||||
padding-left: 20px;
|
||||
padding-left: 2.5rem;
|
||||
}
|
||||
}
|
||||
|
||||
|
|
|
@ -113,11 +113,12 @@
|
|||
width: calc(100% + 2em);
|
||||
|
||||
&.selected::after {
|
||||
@include font-awesome;
|
||||
content: $font-fas-check;
|
||||
@include font-sn-icon;
|
||||
content: $sn-icon-check;
|
||||
margin-left: auto;
|
||||
position: absolute;
|
||||
right: 1em;
|
||||
right: .5rem;
|
||||
top: 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
@ -138,7 +139,7 @@
|
|||
|
||||
.dropdown-menu {
|
||||
@include font-button;
|
||||
min-width: 200px;
|
||||
min-width: 160px;
|
||||
padding: .5em 0;
|
||||
|
||||
a {
|
||||
|
@ -152,11 +153,12 @@
|
|||
}
|
||||
|
||||
&.selected::after {
|
||||
@include font-awesome;
|
||||
content: $font-fas-check;
|
||||
@include font-sn-icon;
|
||||
content: $sn-icon-check;
|
||||
margin-left: auto;
|
||||
position: absolute;
|
||||
right: 1em;
|
||||
right: .5rem;
|
||||
top: 0;
|
||||
}
|
||||
}
|
||||
|
||||
|
|
|
@ -344,7 +344,6 @@
|
|||
}
|
||||
|
||||
.sn-icon-down {
|
||||
margin-right: -6px;
|
||||
transform: rotate(180deg);
|
||||
}
|
||||
}
|
||||
|
|
|
@ -29,6 +29,7 @@ $font-fas-plus: "\f02b";
|
|||
|
||||
$sn-icon-left: "\e932";
|
||||
$sn-icon-right: "\e931";
|
||||
$sn-icon-check: "\e95f";
|
||||
|
||||
|
||||
/// Hack for old icons
|
||||
|
|
|
@ -4,7 +4,7 @@
|
|||
@import "components/*";
|
||||
|
||||
.step-container {
|
||||
--left-component-padding: 24px;
|
||||
--left-component-padding: 2rem;
|
||||
border: $border-transparent;
|
||||
margin: 6px 0 6px -1.5em;
|
||||
padding: 8px 24px 8px 0;
|
||||
|
|
|
@ -152,7 +152,8 @@ body {
|
|||
}
|
||||
|
||||
.badge {
|
||||
background-color: $brand-primary;
|
||||
background-color: var(--sn-science-blue);
|
||||
border-radius: 50% !important;
|
||||
font-size: 11px;
|
||||
border-radius: 5px;
|
||||
}
|
||||
|
|
|
@ -14,8 +14,8 @@
|
|||
@change="switchTeam"
|
||||
></Select>
|
||||
</div>
|
||||
<div v-if="user" class="dropdown" :title="i18n.t('nav.support')">
|
||||
<button class="btn btn-light icon-btn btn-black" data-toggle="dropdown">
|
||||
<div v-if="user" class="dropdown" >
|
||||
<button class="btn btn-light icon-btn btn-black" data-toggle="dropdown" :title="i18n.t('nav.support')">
|
||||
<i class="sn-icon sn-icon-help"></i>
|
||||
</button>
|
||||
<ul v-if="user" class="dropdown-menu dropdown-menu-right">
|
||||
|
@ -26,8 +26,8 @@
|
|||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
<div v-if="user" class="dropdown" :title="i18n.t('nav.settings')">
|
||||
<button class="btn btn-light icon-btn btn-black" data-toggle="dropdown">
|
||||
<div v-if="user" class="dropdown">
|
||||
<button class="btn btn-light icon-btn btn-black" data-toggle="dropdown" :title="i18n.t('nav.settings')">
|
||||
<i class="sn-icon sn-icon-settings"></i>
|
||||
</button>
|
||||
<ul class="dropdown-menu dropdown-menu-right">
|
||||
|
@ -43,8 +43,9 @@
|
|||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
<div v-if="user" class="sci--navigation--notificaitons-flyout-container" :title="i18n.t('nav.notifications.title')">
|
||||
<div v-if="user" class="sci--navigation--notificaitons-flyout-container" >
|
||||
<button class="btn btn-light icon-btn btn-black"
|
||||
:title="i18n.t('nav.notifications.title')"
|
||||
:class="{ 'has-unseen': unseenNotificationsCount > 0 }"
|
||||
:data-unseen="unseenNotificationsCount"
|
||||
data-toggle="dropdown"
|
||||
|
|
|
@ -5,13 +5,13 @@
|
|||
</div>
|
||||
<div v-else class="step-element-grip-placeholder"></div>
|
||||
<div class="buttons-container">
|
||||
<button v-if="element.attributes.orderable.urls.update_url" class="btn icon-btn btn-light" tabindex="0" @click="enableEditMode($event)">
|
||||
<button v-if="element.attributes.orderable.urls.update_url" class="btn icon-btn btn-light btn-sm" tabindex="0" @click="enableEditMode($event)">
|
||||
<i class="sn-icon sn-icon-edit"></i>
|
||||
</button>
|
||||
<button v-if="element.attributes.orderable.urls.duplicate_url" class="btn icon-btn btn-light" tabindex="0" @click="duplicateElement">
|
||||
<button v-if="element.attributes.orderable.urls.duplicate_url" class="btn icon-btn btn-light btn-sm" tabindex="0" @click="duplicateElement">
|
||||
<i class="sn-icon sn-icon-duplicate"></i>
|
||||
</button>
|
||||
<button v-if="element.attributes.orderable.urls.delete_url" class="btn icon-btn btn-light" @click="showDeleteModal" tabindex="0">
|
||||
<button v-if="element.attributes.orderable.urls.delete_url" class="btn icon-btn btn-light btn-sm" @click="showDeleteModal" tabindex="0">
|
||||
<i class="sn-icon sn-icon-delete"></i>
|
||||
</button>
|
||||
</div>
|
||||
|
|
|
@ -14,7 +14,7 @@
|
|||
<input id="calendarDueDate<%= my_module.id %>"
|
||||
type="datetime"
|
||||
data-toggle='date-time-picker'
|
||||
class="form-control calendar-input calendar-due-date"
|
||||
class="form-control calendar-input calendar-due-date "
|
||||
readonly
|
||||
placeholder="<%= t('my_modules.details.no_due_date_placeholder') %>"
|
||||
data-date-format="<%= datetime_picker_format_full %>"
|
||||
|
|
|
@ -1,6 +1,4 @@
|
|||
<% content_for :content do %>
|
||||
<div class="container <%= yield :container_class %>">
|
||||
<%= yield %>
|
||||
</div>
|
||||
<%= yield %>
|
||||
<% end %>
|
||||
<%= render template: 'layouts/application' %>
|
||||
|
|
|
@ -2,7 +2,7 @@
|
|||
|
||||
<div class="flex-block date-block">
|
||||
<div class="flex-block-label">
|
||||
<span class="sn-icon block-icon sn-icon-calendar"></span>
|
||||
<span class="sn-icon block-icon sn-icon-calendar mr-2.5"></span>
|
||||
<span class="hidden-xs hidden-sm hidden-md"><%= t('my_modules.details.start_date') %></span>
|
||||
</div>
|
||||
<div id="startDateContainer" class="datetime-container" data-update-url="<%= my_module_path(@my_module, format: :json) %>">
|
||||
|
@ -12,7 +12,7 @@
|
|||
|
||||
<div class="flex-block date-block" >
|
||||
<div class="flex-block-label">
|
||||
<span class="sn-icon block-icon sn-icon-calendar"></span>
|
||||
<span class="sn-icon block-icon sn-icon-calendar mr-2.5"></span>
|
||||
<span class="hidden-xs hidden-sm hidden-md"><%= t('my_modules.details.due_date') %></span>
|
||||
</div>
|
||||
<div id="dueDateContainer" class="datetime-container" data-update-url="<%= my_module_path(@my_module, format: :json) %>">
|
||||
|
|
|
@ -1,7 +1,7 @@
|
|||
<div class="dropdown view-switch" >
|
||||
<div href="#" class="btn btn-light view-switch-button prevent-shrink <%= "disabled" if disabled %>" id="viewSwitchButton" data-toggle="dropdown" aria-haspopup="true" aria-expanded="true">
|
||||
<span class="state-view-switch-btn-name"><%= archived ? t('toolbar.archived_state') : t('toolbar.active_state') %></span>
|
||||
<span class="caret pull-right"></span>
|
||||
<span class="sn-icon sn-icon-down"></span>
|
||||
</div>
|
||||
<ul class="dropdown-menu dropdown-menu-right" aria-labelledby="viewSwitchButton">
|
||||
<% if switchable %>
|
||||
|
|
|
@ -1,7 +1,7 @@
|
|||
<div class="dropdown view-switch" >
|
||||
<div href="#" class="btn btn-light view-switch-button prevent-shrink <%= "disabled" if disabled %>" id="viewSwitchButton" data-toggle="dropdown" aria-haspopup="true" aria-expanded="true">
|
||||
<span class="view-switch-btn-name"><%= name %></span>
|
||||
<span class="caret pull-right"></span>
|
||||
<span class="sn-icon sn-icon-down"></span>
|
||||
</div>
|
||||
<ul class="dropdown-menu dropdown-menu-right" aria-labelledby="viewSwitchButton">
|
||||
<%= yield %>
|
||||
|
|
|
@ -3485,16 +3485,16 @@ en:
|
|||
archived: "Archived"
|
||||
sort:
|
||||
title: "Sorting"
|
||||
new_html: "<i class=\"fas fa-sort-numeric-down-alt\"></i> Started last"
|
||||
old_html: "<i class=\"fas fa-sort-numeric-down\"></i> Started first"
|
||||
atoz_html: "<i class=\"fas fa-sort-alpha-down\"></i> Name A to Z"
|
||||
ztoa_html: "<i class=\"fas fa-sort-alpha-down-alt\"></i> Name Z to A"
|
||||
archived_new_html: "<i class=\"fas fa-sort-numeric-down-alt\"></i> Archived last"
|
||||
archived_old_html: "<i class=\"fas fa-sort-numeric-down\"></i> Archived first"
|
||||
id_asc_html: "<i class=\"fas fa-sort-numeric-down\"></i> ID ascending"
|
||||
id_desc_html: "<i class=\"fas fa-sort-numeric-down-alt\"></i> ID descending"
|
||||
due_first_html: "<i class=\"fas fa-sort-numeric-down\"></i> Due first"
|
||||
due_last_html: "<i class=\"fas fa-sort-numeric-down-alt\"></i> Due last"
|
||||
new_html: "Started last"
|
||||
old_html: "Started first"
|
||||
atoz_html: "Name A to Z"
|
||||
ztoa_html: "Name Z to A"
|
||||
archived_new_html: "Archived last"
|
||||
archived_old_html: "Archived first"
|
||||
id_asc_html: "ID ascending"
|
||||
id_desc_html: "ID descending"
|
||||
due_first_html: "Due first"
|
||||
due_last_html: "Due last"
|
||||
sort_new:
|
||||
new: "Added last"
|
||||
old: "Added first"
|
||||
|
|
Loading…
Reference in a new issue