IT4Change/Ocelot-Social
3
0
Fork 0
mirror of https://github.com/IT4Change/Ocelot-Social.git synced 2025-12-13 07:45:56 +00:00
Code Issues Packages Projects Releases Wiki Activity

improve user search results styling

Browse Source
This commit is contained in:
Alina Beck 2020-03-23 14:21:41 +01:00
parent e03260d28d
commit 72d979de55
3 changed files with 23 additions and 8 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
webapp/assets/_new/styles/resets.scss
View File

@ -26,3 +26,7 @@ ul {
margin: 0;
padding: 0;
}
li {
margin: 0;
}

24
webapp/components/_new/features/SearchResults/SearchResults.vue
View File

@ -8,8 +8,8 @@
<post-teaser :post="resource" />
</masonry-grid-item>
</masonry-grid>
<ul v-else-if="activeTab === 'User'">
<li v-for="resource in activeResources" :key="resource.key" class="list">
<ul v-else-if="activeTab === 'User'" class="user-list">
<li v-for="resource in activeResources" :key="resource.key" class="item">
<base-card :wideContent="true">
<user-teaser :user="resource" />
</base-card>
@ -98,15 +98,25 @@ export default {
</script>
<style lang="scss">
.search-results {
// width: 40%;
> section {
display: inline-block;
width: 100%;
max-width: 600px;
padding: $space-small;
background-color: $color-neutral-80;
border-radius: 0 $border-radius-base $border-radius-base $border-radius-base;
}
}
.search-results .list {
margin: $space-xxx-small 0 $space-small 0;
.user-list > .item {
transition: opacity .1s;
&:not(:last-child) {
margin-bottom: $space-small;
}
&:hover {
opacity: 0.8;
}
}
}
</style>

3
webapp/components/_new/generic/TabNavigation/TabNavigation.vue
View File

@ -46,7 +46,8 @@ export default {
&.--disabled {
background: $background-color-disabled;
border: 1px solid $color-neutral-80;
border: $border-size-base solid $color-neutral-80;
border-bottom: none;
pointer-events: none;
cursor: default;
}