fix(teams): more layout tweakage

This commit is contained in:
Sabe Jones
2021-07-27 11:25:31 -05:00
committed by SabreCat
parent f233c511cc
commit 61d396204f
3 changed files with 18 additions and 13 deletions

View File

@@ -6,10 +6,17 @@
align-items: center; align-items: center;
.dropdown { .dropdown {
width: 140px;
border-radius: 2px; border-radius: 2px;
box-shadow: 0 3px 6px 0 rgba(26, 24, 29, 0.16), 0 3px 6px 0 rgba(26, 24, 29, 0.24); box-shadow: 0 3px 6px 0 rgba(26, 24, 29, 0.16), 0 3px 6px 0 rgba(26, 24, 29, 0.24);
background-color: $white; background-color: $white;
margin-top: 2px; margin-top: 2px;
position: absolute;
right: 0px;
.task-icon {
width: 35%;
}
.dropdown-item:hover { .dropdown-item:hover {
.svg-icon { .svg-icon {
@@ -17,13 +24,11 @@
} }
} }
.svg-icon { .svg-icon {
width: 20px;
height: 20px;
color: $gray-200; color: $gray-200;
&.icon-habit { &.icon-habit {
width: 24px; width: 30px;
height: 16px; height: 20px;
} }
&.icon-daily { &.icon-daily {
@@ -37,8 +42,8 @@
} }
&.icon-reward { &.icon-reward {
width: 24px; width: 26px;
height: 18px; height: 20px;
} }
} }
} }

View File

@@ -28,7 +28,7 @@
> >
</div> </div>
<div <div
class="create-task-area d-flex align-items-top" class="create-task-area ml-auto d-flex align-items-top"
> >
<div <div
class="day-start mb-auto d-flex align-items-center" class="day-start mb-auto d-flex align-items-center"
@@ -39,7 +39,7 @@
<div <div
id="create-task-btn" id="create-task-btn"
v-if="canCreateTasks" v-if="canCreateTasks"
class="create-btn btn-primary diamond-btn btn" class="create-btn ml-2 btn-primary diamond-btn btn"
:class="{open: openCreateBtn}" :class="{open: openCreateBtn}"
@click.stop.prevent="openCreateBtn = !openCreateBtn" @click.stop.prevent="openCreateBtn = !openCreateBtn"
@keypress.enter="openCreateBtn = !openCreateBtn" @keypress.enter="openCreateBtn = !openCreateBtn"
@@ -61,14 +61,14 @@
@click="createTask(type)" @click="createTask(type)"
class="dropdown-item d-flex pl-2 py-1" class="dropdown-item d-flex pl-2 py-1"
> >
<div class="w-25 d-flex align-items-center justify-content-center"> <div class="d-flex align-items-center justify-content-center task-icon">
<div <div
class="svg-icon m-auto" class="svg-icon m-auto"
:class="`icon-${type}`" :class="`icon-${type}`"
v-html="icons[type]" v-html="icons[type]"
></div> ></div>
</div> </div>
<div class="w-75 ml-1"> <div class="ml-1">
{{ $t(type) }} {{ $t(type) }}
</div> </div>
</div> </div>

View File

@@ -166,7 +166,7 @@
<div class="create-task-area"> <div class="create-task-area">
<div <div
id="create-task-btn" id="create-task-btn"
class="create-btn diamond-btn btn" class="create-btn ml-auto btn-primary diamond-btn btn"
:class="{open: openCreateBtn}" :class="{open: openCreateBtn}"
@click.stop.prevent="openCreateBtn = !openCreateBtn" @click.stop.prevent="openCreateBtn = !openCreateBtn"
@keypress.enter="openCreateBtn = !openCreateBtn" @keypress.enter="openCreateBtn = !openCreateBtn"
@@ -188,14 +188,14 @@
@click="createTask(type)" @click="createTask(type)"
class="dropdown-item d-flex pl-2 py-1" class="dropdown-item d-flex pl-2 py-1"
> >
<div class="w-25 d-flex align-items-center justify-content-center"> <div class="d-flex align-items-center justify-content-center task-icon">
<div <div
class="svg-icon m-auto" class="svg-icon m-auto"
:class="`icon-${type}`" :class="`icon-${type}`"
v-html="icons[type]" v-html="icons[type]"
></div> ></div>
</div> </div>
<div class="w-75 ml-1"> <div class="ml-1">
{{ $t(type) }} {{ $t(type) }}
</div> </div>
</div> </div>