self-hosted/focalboard
1
0
Fork 0
mirror of https://github.com/mattermost/focalboard.git synced 2024-12-24 13:43:12 +02:00
Code Issues Releases Activity

Minor UI Changes (#4115)

Browse Source 
* Minor UI Changes

* Updating menu overflow
This commit is contained in:
Asaad Mahmood 2022-11-02 16:11:01 +05:00 committed by GitHub
parent df1b32cdfd
commit bb7b04c78b
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
9 changed files with 67 additions and 56 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

11
mattermost-plugin/webapp/src/components/rhsChannelBoards.scss
View File

@ -7,12 +7,16 @@
&.empty {
display: flex;
justify-content: center;
justify-content: flex-start;
flex-direction: column;
height: 100%;
width: 100%;
overflow: hidden;
overflow: auto;
padding: 60px;
@media screen and (min-height: 800px) {
justify-content: center;
}
}
.rhs-boards-header {
@ -27,8 +31,7 @@
}
.empty-paragraph {
text-align: justify;
text-align-last: center;
text-align: center;
}
.boards-screenshots {

78
webapp/src/components/__snapshots__/centerPanel.test.tsx.snap
View File

@ -311,7 +311,7 @@ exports[`components/centerPanel Clicking on the Hidden card count should open a
type="button"
>
<i
class="CompassIcon icon-menu-down"
class="CompassIcon icon-menu-right"
/>
</button>
<span
@ -371,7 +371,7 @@ exports[`components/centerPanel Clicking on the Hidden card count should open a
type="button"
>
<i
class="CompassIcon icon-menu-down"
class="CompassIcon icon-menu-right"
/>
</button>
<span
@ -571,7 +571,7 @@ exports[`components/centerPanel Clicking on the Hidden card count should open a
type="button"
>
<i
class="CompassIcon icon-menu-down"
class="CompassIcon icon-menu-right"
/>
</button>
<span
@ -1562,7 +1562,7 @@ exports[`components/centerPanel return centerPanel and click on new card to edit
type="button"
>
<i
class="CompassIcon icon-menu-down"
class="CompassIcon icon-menu-right"
/>
</button>
<span
@ -1622,7 +1622,7 @@ exports[`components/centerPanel return centerPanel and click on new card to edit
type="button"
>
<i
class="CompassIcon icon-menu-down"
class="CompassIcon icon-menu-right"
/>
</button>
<span
@ -1822,7 +1822,7 @@ exports[`components/centerPanel return centerPanel and click on new card to edit
type="button"
>
<i
class="CompassIcon icon-menu-down"
class="CompassIcon icon-menu-right"
/>
</button>
<span
@ -2089,7 +2089,7 @@ exports[`components/centerPanel return centerPanel and press touch 1 with readon
type="button"
>
<i
class="CompassIcon icon-menu-down"
class="CompassIcon icon-menu-right"
/>
</button>
<span
@ -2127,7 +2127,7 @@ exports[`components/centerPanel return centerPanel and press touch 1 with readon
type="button"
>
<i
class="CompassIcon icon-menu-down"
class="CompassIcon icon-menu-right"
/>
</button>
<span
@ -2252,7 +2252,7 @@ exports[`components/centerPanel return centerPanel and press touch 1 with readon
type="button"
>
<i
class="CompassIcon icon-menu-down"
class="CompassIcon icon-menu-right"
/>
</button>
<span
@ -2619,7 +2619,7 @@ exports[`components/centerPanel return centerPanel and press touch ctrl+d for on
type="button"
>
<i
class="CompassIcon icon-menu-down"
class="CompassIcon icon-menu-right"
/>
</button>
<span
@ -2679,7 +2679,7 @@ exports[`components/centerPanel return centerPanel and press touch ctrl+d for on
type="button"
>
<i
class="CompassIcon icon-menu-down"
class="CompassIcon icon-menu-right"
/>
</button>
<span
@ -2879,7 +2879,7 @@ exports[`components/centerPanel return centerPanel and press touch ctrl+d for on
type="button"
>
<i
class="CompassIcon icon-menu-down"
class="CompassIcon icon-menu-right"
/>
</button>
<span
@ -3267,7 +3267,7 @@ exports[`components/centerPanel return centerPanel and press touch del for one c
type="button"
>
<i
class="CompassIcon icon-menu-down"
class="CompassIcon icon-menu-right"
/>
</button>
<span
@ -3327,7 +3327,7 @@ exports[`components/centerPanel return centerPanel and press touch del for one c
type="button"
>
<i
class="CompassIcon icon-menu-down"
class="CompassIcon icon-menu-right"
/>
</button>
<span
@ -3527,7 +3527,7 @@ exports[`components/centerPanel return centerPanel and press touch del for one c
type="button"
>
<i
class="CompassIcon icon-menu-down"
class="CompassIcon icon-menu-right"
/>
</button>
<span
@ -3915,7 +3915,7 @@ exports[`components/centerPanel return centerPanel and press touch esc for one c
type="button"
>
<i
class="CompassIcon icon-menu-down"
class="CompassIcon icon-menu-right"
/>
</button>
<span
@ -3975,7 +3975,7 @@ exports[`components/centerPanel return centerPanel and press touch esc for one c
type="button"
>
<i
class="CompassIcon icon-menu-down"
class="CompassIcon icon-menu-right"
/>
</button>
<span
@ -4175,7 +4175,7 @@ exports[`components/centerPanel return centerPanel and press touch esc for one c
type="button"
>
<i
class="CompassIcon icon-menu-down"
class="CompassIcon icon-menu-right"
/>
</button>
<span
@ -4563,7 +4563,7 @@ exports[`components/centerPanel return centerPanel and press touch esc for one c
type="button"
>
<i
class="CompassIcon icon-menu-down"
class="CompassIcon icon-menu-right"
/>
</button>
<span
@ -4623,7 +4623,7 @@ exports[`components/centerPanel return centerPanel and press touch esc for one c
type="button"
>
<i
class="CompassIcon icon-menu-down"
class="CompassIcon icon-menu-right"
/>
</button>
<span
@ -4823,7 +4823,7 @@ exports[`components/centerPanel return centerPanel and press touch esc for one c
type="button"
>
<i
class="CompassIcon icon-menu-down"
class="CompassIcon icon-menu-right"
/>
</button>
<span
@ -5211,7 +5211,7 @@ exports[`components/centerPanel return centerPanel and press touch esc for two c
type="button"
>
<i
class="CompassIcon icon-menu-down"
class="CompassIcon icon-menu-right"
/>
</button>
<span
@ -5271,7 +5271,7 @@ exports[`components/centerPanel return centerPanel and press touch esc for two c
type="button"
>
<i
class="CompassIcon icon-menu-down"
class="CompassIcon icon-menu-right"
/>
</button>
<span
@ -5471,7 +5471,7 @@ exports[`components/centerPanel return centerPanel and press touch esc for two c
type="button"
>
<i
class="CompassIcon icon-menu-down"
class="CompassIcon icon-menu-right"
/>
</button>
<span
@ -5859,7 +5859,7 @@ exports[`components/centerPanel return centerPanel and press touch esc for two c
type="button"
>
<i
class="CompassIcon icon-menu-down"
class="CompassIcon icon-menu-right"
/>
</button>
<span
@ -5919,7 +5919,7 @@ exports[`components/centerPanel return centerPanel and press touch esc for two c
type="button"
>
<i
class="CompassIcon icon-menu-down"
class="CompassIcon icon-menu-right"
/>
</button>
<span
@ -6119,7 +6119,7 @@ exports[`components/centerPanel return centerPanel and press touch esc for two c
type="button"
>
<i
class="CompassIcon icon-menu-down"
class="CompassIcon icon-menu-right"
/>
</button>
<span
@ -6507,7 +6507,7 @@ exports[`components/centerPanel return centerPanel and press touch esc for two c
type="button"
>
<i
class="CompassIcon icon-menu-down"
class="CompassIcon icon-menu-right"
/>
</button>
<span
@ -6567,7 +6567,7 @@ exports[`components/centerPanel return centerPanel and press touch esc for two c
type="button"
>
<i
class="CompassIcon icon-menu-down"
class="CompassIcon icon-menu-right"
/>
</button>
<span
@ -6767,7 +6767,7 @@ exports[`components/centerPanel return centerPanel and press touch esc for two c
type="button"
>
<i
class="CompassIcon icon-menu-down"
class="CompassIcon icon-menu-right"
/>
</button>
<span
@ -7155,7 +7155,7 @@ exports[`components/centerPanel return centerPanel and select one card and click
type="button"
>
<i
class="CompassIcon icon-menu-down"
class="CompassIcon icon-menu-right"
/>
</button>
<span
@ -7215,7 +7215,7 @@ exports[`components/centerPanel return centerPanel and select one card and click
type="button"
>
<i
class="CompassIcon icon-menu-down"
class="CompassIcon icon-menu-right"
/>
</button>
<span
@ -7415,7 +7415,7 @@ exports[`components/centerPanel return centerPanel and select one card and click
type="button"
>
<i
class="CompassIcon icon-menu-down"
class="CompassIcon icon-menu-right"
/>
</button>
<span
@ -7803,7 +7803,7 @@ exports[`components/centerPanel return centerPanel and select one card and click
type="button"
>
<i
class="CompassIcon icon-menu-down"
class="CompassIcon icon-menu-right"
/>
</button>
<span
@ -7863,7 +7863,7 @@ exports[`components/centerPanel return centerPanel and select one card and click
type="button"
>
<i
class="CompassIcon icon-menu-down"
class="CompassIcon icon-menu-right"
/>
</button>
<span
@ -8063,7 +8063,7 @@ exports[`components/centerPanel return centerPanel and select one card and click
type="button"
>
<i
class="CompassIcon icon-menu-down"
class="CompassIcon icon-menu-right"
/>
</button>
<span
@ -9764,7 +9764,7 @@ exports[`components/centerPanel should match snapshot for Table 1`] = `
type="button"
>
<i
class="CompassIcon icon-menu-down"
class="CompassIcon icon-menu-right"
/>
</button>
<span
@ -9824,7 +9824,7 @@ exports[`components/centerPanel should match snapshot for Table 1`] = `
type="button"
>
<i
class="CompassIcon icon-menu-down"
class="CompassIcon icon-menu-right"
/>
</button>
<span
@ -9956,7 +9956,7 @@ exports[`components/centerPanel should match snapshot for Table 1`] = `
type="button"
>
<i
class="CompassIcon icon-menu-down"
class="CompassIcon icon-menu-right"
/>
</button>
<span

8
webapp/src/components/cardBadges.scss
View File

@ -1,12 +1,18 @@
.CardBadges {
display: flex;
align-items: center;
margin-top: 4px;
height: 24px;
span {
margin-right: 8px;
display: flex;
align-items: center;
margin-right: 4px;
.Icon,
.CompassIcon {
color: rgba(var(--center-channel-color-rgb), 0.64);
fill: currentColor;
margin-right: 4px;
}
}

2
webapp/src/components/table/__snapshots__/table.test.tsx.snap
View File

@ -2510,7 +2510,7 @@ exports[`components/table/Table should match snapshot with GroupBy 1`] = `
type="button"
>
<i
class="CompassIcon icon-menu-down"
class="CompassIcon icon-menu-right"
/>
</button>
<span

12
webapp/src/components/table/__snapshots__/tableGroupHeaderRow.test.tsx.snap
View File

@ -16,7 +16,7 @@ exports[`should match snapshot on read only 1`] = `
type="button"
>
<i
class="CompassIcon icon-menu-down"
class="CompassIcon icon-menu-right"
/>
</button>
<span
@ -60,7 +60,7 @@ exports[`should match snapshot with Group 1`] = `
type="button"
>
<i
class="CompassIcon icon-menu-down"
class="CompassIcon icon-menu-right"
/>
</button>
<span
@ -125,7 +125,7 @@ exports[`should match snapshot, add new 1`] = `
type="button"
>
<i
class="CompassIcon icon-menu-down"
class="CompassIcon icon-menu-right"
/>
</button>
<span
@ -190,7 +190,7 @@ exports[`should match snapshot, edit title 1`] = `
type="button"
>
<i
class="CompassIcon icon-menu-down"
class="CompassIcon icon-menu-right"
/>
</button>
<span
@ -255,7 +255,7 @@ exports[`should match snapshot, hide group 1`] = `
type="button"
>
<i
class="CompassIcon icon-menu-down"
class="CompassIcon icon-menu-right"
/>
</button>
<span
@ -320,7 +320,7 @@ exports[`should match snapshot, no groups 1`] = `
type="button"
>
<i
class="CompassIcon icon-menu-down"
class="CompassIcon icon-menu-right"
/>
</button>
<span

4
webapp/src/components/table/table.scss
View File

@ -91,8 +91,8 @@
}
&.expanded {
.icon-menu-down {
transform: rotate(270deg);
.icon-menu-right {
transform: rotate(90deg);
}
}
}

2
webapp/src/components/table/tableGroupHeaderRow.tsx
View File

@ -69,7 +69,7 @@ const TableGroupHeaderRow = (props: Props): JSX.Element => {
<IconButton
icon={
<CompassIcon
icon='menu-down'
icon='menu-right'
/>}
onClick={() => (props.readonly ? {} : props.hideGroup(group.option.id || 'undefined'))}
className={`octo-table-cell__expand ${props.readonly ? 'readonly' : ''}`}

1
webapp/src/widgets/icons/text.scss
View File

@ -1,5 +1,4 @@
.TextIcon {
fill: rgba(var(--center-channel-color-rgb), 0.5);
stroke: none;
width: 1em;
height: 1em;

5
webapp/src/widgets/menu/menu.scss
View File

@ -16,6 +16,7 @@
border: 1px solid rgba(var(--center-channel-color-rgb), 0.16);
border-radius: var(--default-rad);
box-shadow: var(--elevation-4);
max-width: 320px;
cursor: default;
&.fixed {
@ -58,6 +59,7 @@
}
.menu-option__content {
overflow: hidden;
flex: 1;
}
@ -72,6 +74,7 @@
font-weight: 400;
height: 32px;
padding: 4px 20px;
white-space: nowrap;
cursor: pointer;
&.menu-option--disabled {
@ -111,7 +114,7 @@
display: block;
}
> .menu-name {
.menu-name {
overflow: hidden;
text-overflow: ellipsis;
flex-grow: 1;