ahtlon/deck
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases 1 Wiki Activity

Apply proper BEM syntax

Browse Source 
Signed-off-by: Julius Härtl <jus@bitgrid.net>
This commit is contained in:
Julius Härtl
2020-11-05 17:29:27 +01:00
parent 4b8c811429
commit 78299b3466
1 changed files with 6 additions and 6 deletions
Download Patch File Download Diff File Expand all files Collapse all files

12
src/components/board/Stack.vue
View File

@@ -23,14 +23,14 @@
<template> <template>
<div class="stack"> <div class="stack">
<div v-click-outside="stopCardCreation" class="stack--header" :class="{'stack--header--add': showAddCard }"> <div v-click-outside="stopCardCreation" class="stack__header" :class="{'stack__header--add': showAddCard }">
<transition name="fade" mode="out-in"> <transition name="fade" mode="out-in">
<h3 v-if="!canManage || isArchived"> <h3 v-if="!canManage || isArchived">
{{ stack.title }} {{ stack.title }}
</h3> </h3>
<h3 v-else-if="!editing" <h3 v-else-if="!editing"
v-tooltip="stack.title" v-tooltip="stack.title"
class="stack--title" class="stack__title"
@click="startEditing(stack)"> @click="startEditing(stack)">
{{ stack.title }} {{ stack.title }}
</h3> </h3>
@@ -71,7 +71,7 @@
</Modal> </Modal>
<transition name="slide-top" appear> <transition name="slide-top" appear>
<div v-if="showAddCard" class="stack--card-add"> <div v-if="showAddCard" class="stack__card-add">
<form :class="{ 'icon-loading-small': stateCardCreating }" <form :class="{ 'icon-loading-small': stateCardCreating }"
@submit.prevent.stop="clickAddCard()"> @submit.prevent.stop="clickAddCard()">
<label for="new-stack-input-main" class="hidden-visually">{{ t('deck', 'Add a new card') }}</label> <label for="new-stack-input-main" class="hidden-visually">{{ t('deck', 'Add a new card') }}</label>
@@ -272,7 +272,7 @@ export default {
margin-right: $stack-spacing/2; margin-right: $stack-spacing/2;
} }
.stack--header { .stack__header {
display: flex; display: flex;
position: sticky; position: sticky;
top: 0; top: 0;
@@ -315,14 +315,14 @@ export default {
} }
} }
.stack--title { .stack__title {
white-space: nowrap; white-space: nowrap;
overflow: hidden; overflow: hidden;
text-overflow: ellipsis; text-overflow: ellipsis;
max-width: calc($stack-width - 60px); max-width: calc($stack-width - 60px);
} }
.stack--card-add { .stack__card-add {
height: 52px; height: 52px;
z-index: 100; z-index: 100;
display: flex; display: flex;