Skip to content

Commit 76d8df8

Browse files
luka-nextcloudluka-nextcloud
committed
fix: design review issues
Signed-off-by: Luka Trovic <luka@nextcloud.com>
1 parent a072cc0 commit 76d8df8

22 files changed

Lines changed: 73 additions & 44 deletions

‎css/deck.css‎

Lines changed: 10 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -11,3 +11,13 @@
1111
background-image: url(../img/deck.svg);
1212
filter: var(--background-invert-if-dark);
1313
}
14+
15+
input[type=submit].icon-confirm {
16+
border-color: var(--color-border-maxcontrast) !important;
17+
border-left: none;
18+
}
19+
20+
input[type=text]:focus+input[type=submit].icon-confirm,
21+
input[type=text]:hover+input[type=submit].icon-confirm {
22+
border-color: var(--color-main-text) !important;
23+
}

‎src/components/ActivityEntry.vue‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -120,7 +120,7 @@ export default {
120120
margin-left: 10px;
121121
}
122122
.activity--message {
123-
margin-left: 44px;
123+
margin-left: var(--default-clickable-area);
124124
color: var(--color-text-light);
125125
margin-bottom: 10px;
126126
}

‎src/components/Controls.vue‎

Lines changed: 6 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -476,8 +476,8 @@ export default {
476476
.controls {
477477
display: flex;
478478
margin: 5px;
479-
height: 44px;
480-
padding-left: 44px;
479+
height: var(--default-clickable-area);
480+
padding-left: var(--default-clickable-area);
481481
482482
.board-title {
483483
display: flex;
@@ -507,8 +507,8 @@ export default {
507507
508508
#app-navigation-toggle-custom {
509509
position: static;
510-
width: 44px;
511-
height: 44px;
510+
width: var(--default-clickable-area);
511+
height: var(--default-clickable-area);
512512
cursor: pointer;
513513
opacity: 1;
514514
display: inline-block !important;
@@ -567,8 +567,8 @@ export default {
567567
.filter-button {
568568
padding: 0;
569569
border-radius: 50%;
570-
width: 44px;
571-
height: 44px;
570+
width: var(--default-clickable-area);
571+
height: var(--default-clickable-area);
572572
573573
&[data-popper-shown] {
574574
background-color: var(--color-background-hover);

‎src/components/SessionList.vue‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -56,7 +56,7 @@ export default {
5656
<style scoped lang="scss">
5757
5858
.avatar-list {
59-
min-height: 44px;
59+
min-height: var(--default-clickable-area);
6060
align-items: center;
6161
padding-right: 0.5em;
6262
border: none;

‎src/components/board/Board.vue‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -250,7 +250,7 @@ export default {
250250
.board {
251251
padding-left: $board-spacing;
252252
position: relative;
253-
max-height: calc(100% - 44px);
253+
max-height: calc(100% - var(--default-clickable-area));
254254
overflow: hidden;
255255
overflow-x: auto;
256256
flex-grow: 1;

‎src/components/board/BoardSidebar.vue‎

Lines changed: 11 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
<!--
2-
- SPDX-FileCopyrightText: 2018 Nextcloud GmbH and Nextcloud contributors
3-
- SPDX-License-Identifier: AGPL-3.0-or-later
2+
- SPDX-FileCopyrightText: 2018 Nextcloud GmbH and Nextcloud contributors
3+
- SPDX-License-Identifier: AGPL-3.0-or-later
44
-->
55

66
<template>
@@ -100,3 +100,12 @@ export default {
100100
},
101101
}
102102
</script>
103+
104+
<style scoped lang="scss">
105+
:deep {
106+
.app-sidebar-tabs__tab-caption,
107+
.app-sidebar-tabs__nav .checkbox-content__text {
108+
white-space: normal !important;
109+
}
110+
}
111+
</style>

‎src/components/board/DeletedTabSidebar.vue‎

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -4,7 +4,7 @@
44
-->
55
<template>
66
<div>
7-
<h3>{{ t('deck', 'Deleted lists') }}</h3>
7+
<h5>{{ t('deck', 'Deleted lists') }}</h5>
88
<ul>
99
<li v-for="deletedStack in deletedStacks" :key="deletedStack.id">
1010
<span class="icon icon-deck" />
@@ -18,7 +18,7 @@
1818
</li>
1919
</ul>
2020

21-
<h3>{{ t('deck', 'Deleted cards') }}</h3>
21+
<h5>{{ t('deck', 'Deleted cards') }}</h5>
2222
<ul>
2323
<li v-for="deletedCard in deletedCards" :key="deletedCard.id">
2424
<div class="icon icon-deck" />
@@ -102,7 +102,7 @@ export default {
102102
}
103103
104104
* {
105-
flex-basis: 44px;
105+
flex-basis: var(--default-clickable-area);
106106
}
107107
108108
.title {

‎src/components/board/Stack.vue‎

Lines changed: 13 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
<!--
2-
- SPDX-FileCopyrightText: 2018 Nextcloud GmbH and Nextcloud contributors
3-
- SPDX-License-Identifier: AGPL-3.0-or-later
2+
- SPDX-FileCopyrightText: 2018 Nextcloud GmbH and Nextcloud contributors
3+
- SPDX-License-Identifier: AGPL-3.0-or-later
44
-->
55

66
<template>
@@ -261,7 +261,7 @@ export default {
261261
},
262262
startEditing(stack) {
263263
if (this.dragging) {
264-
return
264+
return
265265
}
266266
267267
this.copiedStack = Object.assign({}, stack)
@@ -322,7 +322,7 @@ export default {
322322
padding-left: $card-spacing;
323323
padding-right: $card-spacing;
324324
cursor: grab;
325-
min-height: 44px;
325+
min-height: var(--default-clickable-area);
326326
327327
// Smooth fade out of the cards at the top
328328
&:before {
@@ -374,6 +374,7 @@ export default {
374374
border-radius: 3px;
375375
margin: 6px;
376376
padding: 4px 4px;
377+
font-size: 120%;
377378
378379
&:focus-visible {
379380
outline: 2px solid var(--color-border-dark);
@@ -384,10 +385,17 @@ export default {
384385
form {
385386
margin: 2px 0;
386387
}
388+
389+
:deep {
390+
.action-item,
391+
.v-popper--theme-dropdown {
392+
display: flex;
393+
}
394+
}
387395
}
388396
389397
.stack__card-add {
390-
height: 44px;
398+
height: var(--default-clickable-area);
391399
flex-shrink: 0;
392400
z-index: 100;
393401
display: flex;

‎src/components/board/TagsTabSidebar.vue‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -173,7 +173,7 @@ export default {
173173
}
174174
</script>
175175
<style scoped lang="scss">
176-
$clickable-area: 44px;
176+
$clickable-area: var(--default-clickable-area);
177177
178178
.labels li {
179179
display: flex;

‎src/components/boards/Boards.vue‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -62,7 +62,7 @@ export default {
6262

6363
<style lang="scss">
6464
.board-list {
65-
margin-top: -44px;
65+
margin-top: - var(--default-clickable-area); //@TODO
6666
6767
.board-list-row {
6868
align-items: center;
@@ -77,7 +77,7 @@ export default {
7777
7878
.board-list-header-row {
7979
color: var(--color-text-lighter);
80-
height: 44px;
80+
height: var(--default-clickable-area);
8181
}
8282
8383
.board-list-bullet-cell,

0 commit comments

Comments
 (0)
⚡