mirror of
https://github.com/Foundry376/Mailspring.git
synced 2024-09-22 00:06:06 +08:00
e69da22e5e
Summary: Fix label sorting... apparently we just synced them in creation date order Allow labels / folders to be nested using separators `.`, `/`, and `\` Allow collapsing of nested labels in sidebar Add overflow hidden to some core flexboxes, which dramatically reduces repaints because it knows columns will not overflow into other columns Prevent scroll region contents from re-rendering all the time, not sure why this works Add test for account sidebar store Test Plan: Run new test of AccountSidebarStore Reviewers: evan Reviewed By: evan Differential Revision: https://phab.nylas.com/D2181
130 lines
2.6 KiB
Plaintext
130 lines
2.6 KiB
Plaintext
@import "ui-variables";
|
|
|
|
@tooltipBorderColor: rgba(54, 56, 57, 0.9);
|
|
@tooltipBackground: -webkit-gradient(linear, left top, left bottom, from(rgba(99, 102, 103, 0.9)), to(rgba(82, 85, 86, 0.9)));
|
|
|
|
.scroll-tooltip {
|
|
background: @tooltipBackground;
|
|
color: white;
|
|
box-shadow: 0 2px 7px rgba(0, 0, 0, 0.25);
|
|
padding: @padding-base-vertical @padding-base-horizontal @padding-base-vertical @padding-base-horizontal;
|
|
border: 1px solid @tooltipBorderColor;
|
|
border-radius: @border-radius-base;
|
|
transform: translate(-15px, 0);
|
|
position: relative;
|
|
white-space:nowrap;
|
|
pointer-events: none;
|
|
}
|
|
.scroll-tooltip:after, .scroll-tooltip:before {
|
|
left: 100%;
|
|
top: 50%;
|
|
border: solid transparent;
|
|
content: " ";
|
|
height: 0;
|
|
width: 0;
|
|
position: absolute;
|
|
pointer-events: none;
|
|
}
|
|
.scroll-tooltip:after {
|
|
border-color: transparent;
|
|
border-left-color: lighten(rgba(99, 102, 103, 1), 3%);
|
|
border-width: 8px;
|
|
margin-top: -8px;
|
|
}
|
|
.scroll-tooltip:before {
|
|
border-color: transparent;
|
|
border-left-color: darken(@tooltipBorderColor, 20%);
|
|
border-width: 9px;
|
|
margin-top: -9px;
|
|
}
|
|
|
|
|
|
.scroll-region {
|
|
::-webkit-scrollbar {
|
|
display: none;
|
|
}
|
|
|
|
position:relative;
|
|
|
|
.scroll-region-content {
|
|
position: absolute;
|
|
height: 100%;
|
|
width: 100%;
|
|
overflow-y: scroll;
|
|
z-index: 1; // Important so that content does not repaint with container
|
|
}
|
|
|
|
.scroll-region-content-inner {
|
|
transform:translate3d(0,0,0);
|
|
}
|
|
}
|
|
|
|
.scroll-region.scrolling {
|
|
.scroll-region-content-inner {
|
|
pointer-events: none;
|
|
}
|
|
}
|
|
|
|
.scrollbar-track {
|
|
opacity: 0;
|
|
transition: opacity 0.3s;
|
|
transition-delay: 0.5s;
|
|
padding:3px;
|
|
width:17px;
|
|
background: @list-bg;
|
|
border-left: 1px solid @border-color-divider;
|
|
|
|
&:hover {
|
|
opacity: 1;
|
|
transition-delay: 0s;
|
|
}
|
|
|
|
&.scrolling {
|
|
opacity: 1;
|
|
transition-delay: 0s;
|
|
}
|
|
|
|
&.dragging {
|
|
opacity: 1;
|
|
.scrollbar-handle {
|
|
cursor: default;
|
|
background-color: lighten(@gray, 30%);
|
|
border:1px solid lighten(@gray, 20%);
|
|
.tooltip {
|
|
opacity: 1;
|
|
display:block;
|
|
}
|
|
}
|
|
}
|
|
|
|
/* Used to read the track height with padding applied. */
|
|
.scrollbar-track-inner {
|
|
height:100%;
|
|
}
|
|
|
|
.scrollbar-handle {
|
|
background-color: lighten(@gray, 40%);
|
|
border:1px solid lighten(@gray, 30%);
|
|
border-radius:8px;
|
|
.tooltip {
|
|
opacity: 0;
|
|
display:none;
|
|
transition: opacity 0.3s;
|
|
top: 50%;
|
|
transform: translate(-100%, -50%);
|
|
position: absolute;
|
|
pointer-events: none;
|
|
}
|
|
}
|
|
}
|
|
body.platform-win32 {
|
|
.scroll-tooltip {
|
|
border-radius: 0;
|
|
}
|
|
.scrollbar-track {
|
|
.scrollbar-handle {
|
|
border-radius: 0;
|
|
}
|
|
}
|
|
}
|