scinote-eln/scinote-web
1
1
Fork 0
mirror of https://github.com/scinote-eln/scinote-web.git synced 2024-12-27 10:14:17 +08:00
Code Issues Projects Releases Packages Wiki Activity

Fixed overflowing text, breaking buttons in new line, figuring out how header stacking works (flickering bug) [SCI-9435]

Browse source 
Fixed header stack stuttering [SCI-9435]

PR fix 01 [SCI-9435]
This commit is contained in:
Gregor Lasnibat 2023-10-06 15:04:28 +02:00
parent 5265312125
commit cce02b29ed
4 changed files with 16 additions and 6 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

16
app/assets/stylesheets/my_modules/protocol.scss
View file

@ -13,7 +13,9 @@
.protocol-buttons-group { .protocol-buttons-group {
align-items: center; align-items: center;
display: flex; display: flex;
gap: 1rem; flex-wrap: wrap;
column-gap: 1rem;
row-gap: .4rem;
} }
.portocol-header-left-part { .portocol-header-left-part {
@ -47,7 +49,6 @@
background-position: top; background-position: top;
background-size: 10px 1px; background-size: 10px 1px;
background-repeat: repeat-x; background-repeat: repeat-x;
border-bottom: 1px dotted transparent; border-bottom: 1px dotted transparent;
content: ""; content: "";
display: inline-block; display: inline-block;
@ -102,3 +103,14 @@
color: var(--sn-grey); color: var(--sn-grey);
} }
} }
@media screen and (max-width: 1395px) {
.task-section-header {
height: 7.44rem;
}
.protocol-buttons-group {
flex-wrap: wrap;
margin: 1rem;
}
}

1
app/javascript/vue/mixins/stackableHeadersMixin.js
View file

@ -95,7 +95,6 @@ export default {
'top', 'top',
stickyNavigationHeight + parseInt($(this.secondaryNavigation).css('top'), 10) stickyNavigationHeight + parseInt($(this.secondaryNavigation).css('top'), 10)
); );
this.lastScrollTop = window.scrollY; // Save last scroll position to when user scroll up/down this.lastScrollTop = window.scrollY; // Save last scroll position to when user scroll up/down
}, },
}, },

3
app/javascript/vue/protocol/container.vue
View file

@ -5,7 +5,7 @@
<div class="portocol-header-left-part grow"> <div class="portocol-header-left-part grow">
<template v-if="headerSticked && moduleName"> <template v-if="headerSticked && moduleName">
<i class="sn-icon sn-icon-navigator sci--layout--navigator-open cursor-pointer p-1.5 border rounded border-sn-light-grey mr-4"></i> <i class="sn-icon sn-icon-navigator sci--layout--navigator-open cursor-pointer p-1.5 border rounded border-sn-light-grey mr-4"></i>
<div @click="scrollTop" class="task-section-title w-[calc(100%_-_4rem)] cursor-pointer"> <div @click="scrollTop" class="task-section-title w-[calc(100%_-_4rem)] min-w-[5rem] cursor-pointer">
<h2 class="truncate leading-6">{{ moduleName }}</h2> <h2 class="truncate leading-6">{{ moduleName }}</h2>
</div> </div>
</template> </template>
@ -428,7 +428,6 @@
$.post(this.urls.publish_url, {version_comment: comment, view: 'show'}) $.post(this.urls.publish_url, {version_comment: comment, view: 'show'})
}, },
scrollTop() { scrollTop() {
console.log("clicekd")
window.scrollTo(0, 0); window.scrollTo(0, 0);
setTimeout(() => { setTimeout(() => {
$('.my_module-name .view-mode').trigger('click'); $('.my_module-name .view-mode').trigger('click');

2
app/views/my_modules/protocols/_protocol_status_bar.html.erb
View file

@ -1,4 +1,4 @@
<div class="flex items-center dropdown my-module-protocol-status"> <div class="flex items-center dropdown my-module-protocol-status whitespace-nowrap">
<% if @protocol.linked? %> <% if @protocol.linked? %>
<span class="status-label linked"> <span class="status-label linked">
[<%= t("my_modules.protocols.protocol_status_bar.linked") %>] [<%= t("my_modules.protocols.protocol_status_bar.linked") %>]