mirror of
https://github.com/styppo/hamstr.git
synced 2024-10-18 05:23:28 +00:00
Make FollowingBox scrollable
This commit is contained in:
parent
e2e072ec02
commit
946e5a098a
@ -16,6 +16,7 @@
|
|||||||
@click="goToProfile(contact.pubkey)"
|
@click="goToProfile(contact.pubkey)"
|
||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
|
<div class="following-gradient"></div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
@ -54,9 +55,11 @@ export default {
|
|||||||
background-color: rgba($color: $color-dark-gray, $alpha: 0.1);
|
background-color: rgba($color: $color-dark-gray, $alpha: 0.1);
|
||||||
border-radius: 1rem;
|
border-radius: 1rem;
|
||||||
&-wrapper {
|
&-wrapper {
|
||||||
|
position: relative;
|
||||||
}
|
}
|
||||||
&-header {
|
&-header {
|
||||||
padding: 1rem;
|
padding: 1rem;
|
||||||
|
border-bottom: $border-dark;
|
||||||
h3 {
|
h3 {
|
||||||
margin: 0;
|
margin: 0;
|
||||||
font-size: 1.4rem;
|
font-size: 1.4rem;
|
||||||
@ -64,12 +67,28 @@ export default {
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
&-body {
|
&-body {
|
||||||
|
max-height: calc(100vh - 150px);
|
||||||
|
overflow-y: scroll;
|
||||||
|
scrollbar-color: transparent transparent;
|
||||||
|
&::-webkit-scrollbar {
|
||||||
|
width: 0;
|
||||||
|
height: 0;
|
||||||
|
}
|
||||||
|
&::-webkit-scrollbar-thumb { /* Foreground */
|
||||||
|
background: $color-dark-gray;
|
||||||
|
}
|
||||||
|
&::-webkit-scrollbar-track { /* Background */
|
||||||
|
background: transparent;
|
||||||
|
}
|
||||||
&-item {
|
&-item {
|
||||||
margin: 0;
|
margin: 0;
|
||||||
padding: 12px 1rem;
|
padding: 12px 1rem;
|
||||||
border-top: $border-dark;
|
border-top: $border-dark;
|
||||||
transition: 200ms ease;
|
transition: 200ms ease;
|
||||||
cursor: pointer;
|
cursor: pointer;
|
||||||
|
&:first-child {
|
||||||
|
border-top: 0;
|
||||||
|
}
|
||||||
&:last-child {
|
&:last-child {
|
||||||
border-radius: 0 0 1rem 1rem;
|
border-radius: 0 0 1rem 1rem;
|
||||||
}
|
}
|
||||||
@ -78,5 +97,14 @@ export default {
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
&-gradient {
|
||||||
|
position: absolute;
|
||||||
|
bottom: 0;
|
||||||
|
left: 0;
|
||||||
|
right: 0;
|
||||||
|
height: 1.2rem;
|
||||||
|
border-radius: 0 0 1rem 1rem;
|
||||||
|
background: linear-gradient(180deg, rgba(29, 41, 53, 0), rgba(29, 41, 53, 1));
|
||||||
|
}
|
||||||
}
|
}
|
||||||
</style>
|
</style>
|
||||||
|
Loading…
Reference in New Issue
Block a user