mirror of
https://github.com/muerwre/vault-frontend.git
synced 2025-04-24 20:36:40 +07:00
fixed gaps and radiuses
This commit is contained in:
parent
782bafcc60
commit
f63d2d3228
8 changed files with 62 additions and 29 deletions
|
@ -76,9 +76,9 @@ const FlowStamp: FC<IProps> = ({
|
|||
/>
|
||||
</form>
|
||||
|
||||
<div className={styles.grid}>
|
||||
{searchText ? (
|
||||
<>
|
||||
<div className={styles.search_results}>
|
||||
<div className={styles.grid}>
|
||||
<div className={styles.label}>
|
||||
<span className={styles.label_text}>Результаты поиска</span>
|
||||
<span className="line" />
|
||||
|
@ -92,9 +92,10 @@ const FlowStamp: FC<IProps> = ({
|
|||
onLoadMore={onSearchLoadMore}
|
||||
/>
|
||||
</div>
|
||||
</>
|
||||
</div>
|
||||
</div>
|
||||
) : (
|
||||
<>
|
||||
<div className={styles.grid}>
|
||||
<div className={classNames(styles.label, styles.whatsnew)}>
|
||||
<span className={styles.label_text}>Что нового?</span>
|
||||
<span className="line" />
|
||||
|
@ -103,9 +104,8 @@ const FlowStamp: FC<IProps> = ({
|
|||
<div className={styles.items}>
|
||||
<FlowRecent updated={updated} recent={recent} />
|
||||
</div>
|
||||
</>
|
||||
)}
|
||||
</div>
|
||||
)}
|
||||
|
||||
{experimentalFeatures.liquidFlow && (
|
||||
<Superpower>
|
||||
|
|
|
@ -4,19 +4,19 @@
|
|||
display: flex;
|
||||
flex-direction: column;
|
||||
width: 100%;
|
||||
background: lighten($content_bg, 4%);
|
||||
border-radius: $radius;
|
||||
}
|
||||
|
||||
.grid {
|
||||
@include outer_shadow();
|
||||
display: flex;
|
||||
justify-content: stretch;
|
||||
flex-direction: column;
|
||||
flex: 1;
|
||||
border-radius: $radius;
|
||||
overflow: hidden;
|
||||
position: relative;
|
||||
background: $content_bg;
|
||||
overflow: hidden;
|
||||
|
||||
&::after {
|
||||
content: '';
|
||||
|
@ -28,9 +28,11 @@
|
|||
background: linear-gradient(transparentize($content_bg, 1), $content_bg 90%);
|
||||
pointer-events: none;
|
||||
touch-action: none;
|
||||
}
|
||||
|
||||
@include outer_shadow();
|
||||
@include tablet {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.items {
|
||||
|
@ -69,12 +71,12 @@
|
|||
}
|
||||
|
||||
.search {
|
||||
background: lighten($content_bg, 3%);
|
||||
border-radius: $radius $radius 0 0;
|
||||
padding: $gap;
|
||||
|
||||
@include outer_shadow();
|
||||
|
||||
background: lighten($content_bg, 3%);
|
||||
padding: $gap;
|
||||
border-radius: $radius;
|
||||
|
||||
:global(.input_title) {
|
||||
color: lighten($content_bg, 10%);
|
||||
}
|
||||
|
@ -123,3 +125,9 @@
|
|||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
.search_results {
|
||||
@include tablet {
|
||||
margin-top: $gap;
|
||||
}
|
||||
}
|
|
@ -23,13 +23,17 @@
|
|||
}
|
||||
|
||||
.container {
|
||||
@include container;
|
||||
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: flex-end;
|
||||
font-weight: 500;
|
||||
box-sizing: border-box;
|
||||
|
||||
@include container;
|
||||
@include tablet {
|
||||
padding: 0 $gap;
|
||||
}
|
||||
}
|
||||
|
||||
.spacer {
|
||||
|
@ -116,9 +120,8 @@
|
|||
background: lighten($wisegreen, 10%);
|
||||
}
|
||||
|
||||
|
||||
@include tablet {
|
||||
padding: $gap;
|
||||
padding: 0 $gap * 2 0 0;
|
||||
|
||||
&.notifications {
|
||||
flex: 1;
|
||||
|
|
|
@ -4,6 +4,10 @@ div.wrap {
|
|||
display: flex;
|
||||
width: 100%;
|
||||
margin-right: 0;
|
||||
|
||||
@include tablet {
|
||||
padding: 0 $gap / 2;
|
||||
}
|
||||
}
|
||||
|
||||
.column {
|
||||
|
|
|
@ -126,6 +126,10 @@
|
|||
padding: $gap;
|
||||
box-sizing: border-box;
|
||||
flex: 0 0 auto;
|
||||
|
||||
@include tablet {
|
||||
border-radius: 0;
|
||||
}
|
||||
}
|
||||
|
||||
&__title {
|
||||
|
@ -154,6 +158,10 @@
|
|||
position: relative;
|
||||
z-index: 1;
|
||||
flex: 3;
|
||||
|
||||
@include tablet {
|
||||
border-radius: 0;
|
||||
}
|
||||
}
|
||||
|
||||
.super_powers {
|
||||
|
|
|
@ -11,6 +11,10 @@ $cols: $content_width / $cell;
|
|||
|
||||
.container {
|
||||
@include container;
|
||||
|
||||
@include tablet {
|
||||
padding: 0 $gap;
|
||||
}
|
||||
}
|
||||
|
||||
.grid {
|
||||
|
|
|
@ -41,3 +41,9 @@
|
|||
align-items: flex-end;
|
||||
justify-content: stretch;
|
||||
}
|
||||
|
||||
.node {
|
||||
@include tablet {
|
||||
border-radius: 0;
|
||||
}
|
||||
}
|
|
@ -328,7 +328,7 @@ $sidebar_border: transparentize(white, 0.95);
|
|||
padding-right: $gap * 4;
|
||||
|
||||
@include tablet {
|
||||
padding-left: $gap;
|
||||
padding-right: $gap;
|
||||
padding-left: 0;
|
||||
padding-right: 0;
|
||||
}
|
||||
}
|
Loading…
Add table
Add a link
Reference in a new issue