mirror of
https://github.com/gitbutlerapp/gitbutler.git
synced 2024-12-26 19:15:25 +03:00
CSS fixes: branch (#4715)
* fix with on drag * fix draggable handle for collapsed lines * remove left border for the folded line when dragging
This commit is contained in:
parent
c9b5aa7c26
commit
4e23be18d8
@ -102,6 +102,8 @@
|
|||||||
onGenerateBranchName={generateBranchName}
|
onGenerateBranchName={generateBranchName}
|
||||||
{isLaneCollapsed}
|
{isLaneCollapsed}
|
||||||
/>
|
/>
|
||||||
|
|
||||||
|
<div class="collapsed-lane-divider" data-remove-from-draggable></div>
|
||||||
</div>
|
</div>
|
||||||
{:else}
|
{:else}
|
||||||
<div class="resizer-wrapper" bind:this={scrollViewport}>
|
<div class="resizer-wrapper" bind:this={scrollViewport}>
|
||||||
@ -264,10 +266,19 @@
|
|||||||
|
|
||||||
/* COLLAPSED LANE */
|
/* COLLAPSED LANE */
|
||||||
.collapsed-lane-container {
|
.collapsed-lane-container {
|
||||||
|
position: relative;
|
||||||
display: flex;
|
display: flex;
|
||||||
flex-direction: column;
|
flex-direction: column;
|
||||||
padding: 12px;
|
padding: 12px;
|
||||||
height: 100%;
|
height: 100%;
|
||||||
border-right: 1px solid var(--clr-border-2);
|
}
|
||||||
|
|
||||||
|
.collapsed-lane-divider {
|
||||||
|
position: absolute;
|
||||||
|
top: 0;
|
||||||
|
right: 0;
|
||||||
|
width: 1px;
|
||||||
|
height: 100%;
|
||||||
|
background-color: var(--clr-border-2);
|
||||||
}
|
}
|
||||||
</style>
|
</style>
|
||||||
|
@ -129,7 +129,7 @@
|
|||||||
role="button"
|
role="button"
|
||||||
>
|
>
|
||||||
<div class="collapsed-lane__actions">
|
<div class="collapsed-lane__actions">
|
||||||
<div class="collapsed-lane__draggable" data-drag-handle>
|
<div class="draggable" data-drag-handle>
|
||||||
<Icon name="draggable" />
|
<Icon name="draggable" />
|
||||||
</div>
|
</div>
|
||||||
<Button style="ghost" outline icon="unfold-lane" help="Expand lane" onclick={expandLane} />
|
<Button style="ghost" outline icon="unfold-lane" help="Expand lane" onclick={expandLane} />
|
||||||
@ -403,20 +403,7 @@
|
|||||||
display: flex;
|
display: flex;
|
||||||
flex-direction: column;
|
flex-direction: column;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
gap: 2px;
|
gap: 10px;
|
||||||
}
|
|
||||||
|
|
||||||
.collapsed-lane__draggable {
|
|
||||||
cursor: grab;
|
|
||||||
transform: rotate(90deg);
|
|
||||||
margin-bottom: 4px;
|
|
||||||
opacity: 0.4;
|
|
||||||
transition: opacity var(--transition-fast);
|
|
||||||
color: var(--clr-scale-ntrl-0);
|
|
||||||
|
|
||||||
&:hover {
|
|
||||||
opacity: 1;
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
|
|
||||||
/* */
|
/* */
|
||||||
|
@ -240,6 +240,7 @@
|
|||||||
|
|
||||||
.branch {
|
.branch {
|
||||||
height: 100%;
|
height: 100%;
|
||||||
|
width: fit-content;
|
||||||
}
|
}
|
||||||
|
|
||||||
.draggable-branch {
|
.draggable-branch {
|
||||||
|
Loading…
Reference in New Issue
Block a user