Small CSS task fixes [SCI-7032]

This commit is contained in:
Anton 2022-08-02 11:00:13 +02:00
parent 89a3bc8072
commit c7b0d1d6f8
7 changed files with 20 additions and 8 deletions

View file

@ -490,7 +490,7 @@
.task-details-button { .task-details-button {
@include font-h2; @include font-h2;
color: inherit; color: inherit;
margin: 0 3px; margin-left: -5px;
text-decoration: none; text-decoration: none;
} }

View file

@ -364,9 +364,21 @@
.file-name { .file-name {
text-align: center; text-align: center;
div { &:not(.one-line) div {
margin-bottom: .5em; margin-bottom: .5em;
} }
&.one-line {
align-items: center;
display: flex;
.file-name-text {
margin-left: .25em;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
}
} }
.remove-button { .remove-button {

View file

@ -313,7 +313,7 @@
opacity: 0; opacity: 0;
} }
&:hover:not(.locked) { &:hover:not(.locked):not(.no-hover) {
background: $color-concrete; background: $color-concrete;
.step-element-grip, .step-element-grip,

View file

@ -11,7 +11,7 @@
<StorageUsage v-if="showStorageUsage()" :step="step"/> <StorageUsage v-if="showStorageUsage()" :step="step"/>
</div> </div>
<div class="step-header"> <div class="step-header">
<div class="step-element-header"> <div class="step-element-header" :class="{ 'no-hover': !urls.update_url }">
<div class="step-controls"> <div class="step-controls">
<div v-if="reorderStepUrl" class="step-element-grip" @click="$emit('reorder')" :class="{ 'step-element--locked': !urls.update_url }"> <div v-if="reorderStepUrl" class="step-element-grip" @click="$emit('reorder')" :class="{ 'step-element--locked': !urls.update_url }">
<i class="fas fas-rotated-90 fa-exchange-alt"></i> <i class="fas fas-rotated-90 fa-exchange-alt"></i>

View file

@ -6,9 +6,9 @@
<i v-if="!attachment.error" class="fas fa-file"></i> <i v-if="!attachment.error" class="fas fa-file"></i>
<i v-if="attachment.error" class="fas fa-exclamation-triangle"></i> <i v-if="attachment.error" class="fas fa-exclamation-triangle"></i>
</div> </div>
<div class="file-name"> <div class="file-name" :class="{'one-line': attachmentViewMode == 'list-attachment-container' }">
<div v-if="!attachment.error">{{ i18n.t("protocols.steps.attachments.new.uploading") }}</div> <div v-if="!attachment.error">{{ i18n.t("protocols.steps.attachments.new.uploading") }}</div>
<div>{{ attachment.attributes.file_name }}</div> <div class="file-name-text">{{ attachment.attributes.file_name }}</div>
</div> </div>
<div v-if="!attachment.error" class="progress-container"> <div v-if="!attachment.error" class="progress-container">
<div class="progress-bar" :style="`width: ${attachment.attributes.progress}%`"></div> <div class="progress-bar" :style="`width: ${attachment.attributes.progress}%`"></div>

View file

@ -1,6 +1,6 @@
<template> <template>
<div class="step-checklist-container" > <div class="step-checklist-container" >
<div class="step-element-header" :class="{ 'editing-name': editingName }"> <div class="step-element-header" :class="{ 'editing-name': editingName, 'no-hover': !element.attributes.orderable.urls.update_url }">
<div v-if="reorderElementUrl" class="step-element-grip" @click="$emit('reorder')"> <div v-if="reorderElementUrl" class="step-element-grip" @click="$emit('reorder')">
<i class="fas fas-rotated-90 fa-exchange-alt"></i> <i class="fas fas-rotated-90 fa-exchange-alt"></i>
</div> </div>

View file

@ -37,7 +37,7 @@
</span> </span>
<span class="caret pull-right"></span> <span class="caret pull-right"></span>
</button> </button>
<ul class="dropdown-menu" aria-labelledby="dropdownTaskFlow" id="dropdownTaskFlowList" data-link-url="<%= update_state_my_module_url(my_module) %>"> <ul class="dropdown-menu pull-right" aria-labelledby="dropdownTaskFlow" id="dropdownTaskFlowList" data-link-url="<%= update_state_my_module_url(my_module) %>">
<% if can_update_my_module_status?(@my_module) %> <% if can_update_my_module_status?(@my_module) %>
<% unless status.initial_status? %> <% unless status.initial_status? %>
<% previous_s = status.previous_status %> <% previous_s = status.previous_status %>