muerwre/vault-frontend
1
0
Fork 0
mirror of https://github.com/muerwre/vault-frontend.git synced 2025-05-05 01:27:46 +07:00
Code Packages Activity Actions

added flow context

Browse source
This commit is contained in:
Fedor Katurov 2022-01-04 13:44:51 +07:00
parent 31e433af3e
commit 5f3accee48
6 changed files with 105 additions and 87 deletions
Download patch file Download diff file Expand all files Collapse all files

129
src/components/flow/FlowStamp/styles.module.scss
View file

@ -1,129 +0,0 @@
@import "src/styles/variables";
.wrap {
display: flex;
flex-direction: column;
width: 100%;
border-radius: $radius;
}
.grid {
@include outer_shadow();
display: flex;
justify-content: stretch;
flex-direction: column;
flex: 1;
border-radius: $radius;
position: relative;
background: $content_bg;
overflow: hidden;
&::after {
content: '';
position: absolute;
bottom: 0;
left: 0;
height: 60px;
width: 100%;
background: linear-gradient(transparentize($content_bg, 1), $content_bg 90%);
pointer-events: none;
touch-action: none;
@include tablet {
display: none;
}
}
}
.items {
padding: 0 $gap 0 $gap;
flex: 1;
display: flex;
flex-direction: column;
overflow: hidden;
}
.label {
display: flex;
flex-direction: row;
min-width: 0;
padding: $gap;
border-radius: $radius;
@include title_with_line();
color: transparentize(white, $amount: 0.8);
&_search {
color: white;
padding-left: $gap * 1.2;
}
& > :global(.line) {
margin-right: $gap;
}
}
.label_text {
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
.search {
@include outer_shadow();
background: lighten($content_bg, 3%);
padding: $gap;
border-radius: $radius;
}
.search_icon {
fill: lighten($content_bg, 8%);
stroke: lighten($content_bg, 8%);
stroke-width: 0.5;
pointer-events: none;
touch-action: none;
}
.close_icon {
cursor: pointer;
stroke: white;
stroke-width: 0.5;
opacity: 0.5;
transition: opacity 0.25s;
&:hover {
opacity: 0.7;
}
}
.toggles {
& > div {
padding: $gap;
font: $font_14_semibold;
}
&__label {
cursor: pointer;
}
}
.fluid_toggle {
@include desktop {
display: none;
}
}
.whatsnew {
@media (max-width: $flow_hide_recents) {
display: none;
}
}
.search_results {
@include tablet {
margin-top: $gap;
}
}