Merge pull request #5750 from aignatov-bio/ai-sci-8762-css-bugs

CSS fixes [SCI-8762]
This commit is contained in:
aignatov-bio 2023-07-11 10:59:27 +02:00 committed by GitHub
commit 3de911d714
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
17 changed files with 90 additions and 58 deletions

View file

@ -26,15 +26,16 @@ var DataTableHelpers = (function() {
var tableFilterInput = $(dataTableWraper).find('.dataTables_filter input');
tableFilterInput.attr('placeholder', searchText)
.addClass('sci-input-field search-field')
.removeClass('form-control input-sm')
.css('margin', 0);
$('.dataTables_filter').append(`
<button class="btn btn-light icon-btn search-icon btn-black"
<button class="btn btn-light btn-lg icon-btn search-icon btn-black"
title="${I18n.t('repositories.show.button_tooltip.search')}">
<i class="sn-icon sn-icon-search"></i>
</button>
<div class="sci-input-container right-icon search-container">
<div class="sci-input-container-v2 w-48 right-icon search-container">
<i class="sn-icon sn-icon-search"></i>
</div>`).find('.sci-input-container').prepend(tableFilterInput);
</div>`).find('.sci-input-container-v2').prepend(tableFilterInput);
$('.dataTables_filter').find('label').remove();
$('.dataTables_filter').on('click', '.search-icon', function() {

View file

@ -499,14 +499,6 @@
opacity: 0;
}
}
&:hover {
.date-text[data-editable=true] {
background-color: $color-concrete;
border-radius: 4px;
}
}
}
.open-comments-sidebar {

View file

@ -73,6 +73,13 @@
.dataTables_scrollHead {
flex-shrink: 0;
thead {
.sci-checkbox-container {
margin-left: .125rem;
}
}
th:first-child {
text-align: center;
vertical-align: middle;

View file

@ -124,9 +124,6 @@
}
.repositories-assign-container {
display: flex;
flex-grow: 1;
justify-content: flex-end;
max-width: 150px;
.btn {

View file

@ -21,6 +21,12 @@
.dataTables_scrollHead {
thead {
.sci-checkbox-container {
margin-left: .125rem;
}
}
tbody {
td {
vertical-align: middle;

View file

@ -432,7 +432,6 @@
.search-container {
.search-field {
padding-right: 32px;
&.barcode-mode {
background-color: $brand-primary;

View file

@ -29,12 +29,26 @@
.search-container:not(.expand) {
display: none;
}
input {
width: 100% !important;
}
.sci-input-container-v2 .sn-icon {
margin-right: 10px !important;
}
}
.dataTables_scrollHead {
.dataTable {
margin-top: 0 !important;
}
thead {
.sci-checkbox-container {
margin-left: .25rem;
}
}
}
.pagination-row {

View file

@ -9,6 +9,10 @@
font-size: 13px;
}
.datepicker thead th {
padding: 8px 6px !important;
}
.timepicker-picker {
padding: 0 60px;

View file

@ -1,6 +1,6 @@
@layer components {
.sci-btn-group {
@apply flex items-center gap-2 relative;
@apply inline-flex items-center gap-2 relative;
}
.btn {

View file

@ -4,7 +4,7 @@
}
.sci-input-container-v2 input {
@apply w-full h-full bg-transparent p-0.5 border rounded outline-none absolute top-0;
@apply w-full h-full bg-transparent p-0.5 border rounded outline-none absolute top-0 pl-2;
border-color: var(--sn-sleepy-grey);
}
@ -13,7 +13,8 @@
}
.sci-input-container-v2 input:focus {
border-color: var(--sn-science-blue);
border-color: var(--sn-sleepy-grey);
box-shadow: none;
}
.sci-input-container-v2 .sn-icon {
@ -21,7 +22,15 @@
color: var(--sn-black)
}
.sci-input-container-v2.right-icon .sn-icon {
@apply absolute right-0;
}
.sci-input-container-v2.left-icon input {
@apply pl-10;
}
.sci-input-container-v2.right-icon input {
@apply pr-10;
}
}

View file

@ -10,7 +10,6 @@
aria-expanded="true"
tabindex="0"
>
<span class="sn-icon sn-icon-settings"></span>
<span>{{ i18n.t("my_modules.protocol.options_dropdown.title") }}</span>
<span class="sn-icon sn-icon-down"></span>
</button>

View file

@ -58,7 +58,7 @@
</div>
<div class="step-actions-container">
<div ref="elementsDropdownButton" v-if="urls.update_url" class="dropdown">
<button class="btn btn-light dropdown-toggle insert-button" type="button" :id="'stepInserMenu_' + step.id" data-toggle="dropdown" aria-haspopup="true" aria-expanded="true">
<button class="btn btn-light btn-black dropdown-toggle insert-button" type="button" :id="'stepInserMenu_' + step.id" data-toggle="dropdown" aria-haspopup="true" aria-expanded="true">
{{ i18n.t('protocols.steps.insert.button') }}
<span class="sn-icon sn-icon-down"></span>
</button>
@ -98,7 +98,7 @@
<a href="#"
v-if="!inRepository"
ref="comments"
class="open-comments-sidebar btn icon-btn btn-light"
class="open-comments-sidebar btn icon-btn btn-light btn-black"
data-turbolinks="false"
data-object-type="Step"
@click="openCommentsSidebar"
@ -113,7 +113,7 @@
</a>
<div v-if="urls.update_url" class="step-actions-container">
<div ref="actionsDropdownButton" class="dropdown">
<button class="btn btn-light icon-btn dropdown-toggle insert-button" type="button" :id="'stepOptionsMenu_' + step.id" data-toggle="dropdown" data-display="static" aria-haspopup="true" aria-expanded="true">
<button class="btn btn-light icon-btn btn-black dropdown-toggle insert-button" type="button" :id="'stepOptionsMenu_' + step.id" data-toggle="dropdown" data-display="static" aria-haspopup="true" aria-expanded="true">
<i class="sn-icon sn-icon-more-hori"></i>
</button>
<ul ref="actionsDropdown" class="dropdown-menu dropdown-menu-right insert-element-dropdown" :aria-labelledby="'stepOptionsMenu_' + step.id">

View file

@ -1,10 +1,10 @@
<template>
<div class="flex items-center mr-3 flex-nowrap">
<button v-if="!searchOpened" class="btn btn-light btn-black icon-btn" :title="i18n.t('repositories.show.search_button_tooltip')" @click="openSearch">
<button v-if="!searchOpened" class="btn btn-light btn-lg btn-black icon-btn" :title="i18n.t('repositories.show.search_button_tooltip')" @click="openSearch">
<i class="sn-icon sn-icon-search"></i>
</button>
<div v-if="searchOpened || barcodeSearchOpened" class="w-52 flex">
<div v-if="searchOpened" class="sci-input-container right-icon">
<div v-if="searchOpened" class="sci-input-container-v2 w-full right-icon">
<input
ref="searchInput"
class="sci-input-field"
@ -13,9 +13,9 @@
@keyup="setValue"
@blur="closeSearch"
/>
<i class="sn-icon sn-icon-search"></i>
<i class="sn-icon sn-icon-search !mr-2.5"></i>
</div>
<div v-if="barcodeSearchOpened" class="sci-input-container right-icon ml-2">
<div v-if="barcodeSearchOpened" class="sci-input-container-v2 w-full right-icon ml-2">
<input
ref="barcodeSearchInput"
class="sci-input-field"
@ -24,10 +24,10 @@
@change="setBarcodeValue"
@blur="closeBarcodeSearch"
/>
<i class='sn-icon sn-icon-barcode barcode-scanner'></i>
<i class='sn-icon sn-icon-barcode barcode-scanner !mr-2.5'></i>
</div>
</div>
<button v-if="!barcodeSearchOpened" class="btn btn-light btn-black icon-btn ml-2" :title="i18n.t('repositories.show.ean_search_button_tooltip')" @click="openBarcodeSearch">
<button v-if="!barcodeSearchOpened" class="btn btn-light btn-lg btn-black icon-btn ml-2" :title="i18n.t('repositories.show.ean_search_button_tooltip')" @click="openBarcodeSearch">
<i class='sn-icon sn-icon-barcode barcode-scanner'></i>
</button>
</div>

View file

@ -1,7 +1,7 @@
<div class="panel panel-default panel-archive">
<div class="dropdown pull-right">
<button class="btn dropdown-toggle mt-1 bg-transparent" type="button" id="dropdownMenu1" data-toggle="dropdown" aria-haspopup="true" aria-expanded="true">
<div class="dropdown sci-dropdown pull-right">
<button class="btn btn-light btn-black icon-btn btn-sm dropdown-toggle mt-1 bg-transparent" type="button" id="dropdownMenu1" data-toggle="dropdown" aria-haspopup="true" aria-expanded="true">
<span class="sn-icon sn-icon-down"></span>
</button>
<ul class="dropdown-menu dropdown-menu-right" aria-labelledby="dropdownMenu1">

View file

@ -46,17 +46,19 @@
<% end %>
</div>
<div class="modal-footer">
<a class="btn btn-light hide-assign-repo-modal" data-dismiss="modal">
<i class="sn-icon sn-icon-close"></i>
<%= t('general.cancel') %>
</a>
<% if downstream %>
<a class="btn btn-primary downstream-action">
<%= t('my_modules.modals.assign_repository_record.task_and_downstream') %>
<div class="sci-btn-group">
<a class="btn btn-light hide-assign-repo-modal" data-dismiss="modal">
<i class="sn-icon sn-icon-close"></i>
<%= t('general.cancel') %>
</a>
<% else %>
<a class="btn btn-primary task-action">
<%= t('my_modules.modals.assign_repository_record.task') %>
</a>
<% end %>
<% if downstream %>
<a class="btn btn-primary downstream-action">
<%= t('my_modules.modals.assign_repository_record.task_and_downstream') %>
</a>
<% else %>
<a class="btn btn-primary task-action">
<%= t('my_modules.modals.assign_repository_record.task') %>
</a>
<% end %>
</div>
</div>

View file

@ -77,20 +77,22 @@
<% end %>
</div>
<div class="modal-footer">
<a class="btn btn-light" data-dismiss="modal">
<i class="sn-icon sn-icon-close"></i>
<%= t('general.cancel') %>
</a>
<% if downstream %>
<a class="btn btn-primary next-step" >
<%= t('my_modules.modals.update_repository_record.next') %>
<div class="sci-btn-group">
<a class="btn btn-light" data-dismiss="modal">
<i class="sn-icon sn-icon-close"></i>
<%= t('general.cancel') %>
</a>
<a class="btn btn-primary downstream-action hidden" >
<%= t('my_modules.modals.update_repository_record.task_and_downstream') %>
</a>
<% else %>
<a class="btn btn-primary task-action">
<%= t('my_modules.modals.update_repository_record.task') %>
</a>
<% end %>
<% if downstream %>
<a class="btn btn-primary next-step" >
<%= t('my_modules.modals.update_repository_record.next') %>
</a>
<a class="btn btn-primary downstream-action hidden" >
<%= t('my_modules.modals.update_repository_record.task_and_downstream') %>
</a>
<% else %>
<a class="btn btn-primary task-action">
<%= t('my_modules.modals.update_repository_record.task') %>
</a>
<% end %>
</div>
</div>

View file

@ -120,7 +120,7 @@
<span class="units"><%= repository_stock_value.repository_stock_unit_item&.data %></span>
</div>
<div class="stock-arrow">
<i class="sn-icon sn-icon-move"></i>
<i class="sn-icon sn-icon-arrow-right"></i>
</div>
<div class="stock-final-container <%= 'negative' if repository_stock_value.amount.negative? %> ">
<span class="subtitle"><%= t('repository_stock_values.manage_modal.new_stock') %></span>