PrivateCoffee/element-web
4
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions 3

Merge pull request #6447 from matrix-org/gsouquet/fix-18176

Browse source 
Use modern layout in file and notification panel
This commit is contained in:
Germain 2021-07-22 15:11:27 +01:00 committed by GitHub
commit 324037298a
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
4 changed files with 13 additions and 4 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

9
res/css/structures/_FilePanel.scss
View file

@ -45,9 +45,14 @@ limitations under the License.
/* Overrides for the attachment body tiles */ /* Overrides for the attachment body tiles */
.mx_FilePanel .mx_EventTile { .mx_FilePanel .mx_EventTile:not([data-layout=bubble]) {
word-break: break-word; word-break: break-word;
margin-top: 32px; margin-top: 10px;
padding-top: 0;
.mx_EventTile_line {
padding-left: 0;
}
} }
.mx_FilePanel .mx_EventTile .mx_MImageBody { .mx_FilePanel .mx_EventTile .mx_MImageBody {

4
res/css/structures/_NotificationPanel.scss
View file

@ -84,7 +84,7 @@ limitations under the License.
display: inline; display: inline;
} }
.mx_NotificationPanel .mx_EventTile_senderDetails { .mx_NotificationPanel .mx_EventTile:not([data-layout=bubble]) .mx_EventTile_senderDetails {
padding-left: 36px; // align with the room name padding-left: 36px; // align with the room name
position: relative; position: relative;
@ -105,7 +105,7 @@ limitations under the License.
padding-left: 5px; padding-left: 5px;
} }
.mx_NotificationPanel .mx_EventTile_line { .mx_NotificationPanel .mx_EventTile:not([data-layout=bubble]) .mx_EventTile_line {
margin-right: 0px; margin-right: 0px;
padding-left: 36px; // align with the room name padding-left: 36px; // align with the room name
padding-top: 0px; padding-top: 0px;

2
src/components/structures/FilePanel.tsx
View file

@ -36,6 +36,7 @@ import ResizeNotifier from '../../utils/ResizeNotifier';
import TimelinePanel from "./TimelinePanel"; import TimelinePanel from "./TimelinePanel";
import Spinner from "../views/elements/Spinner"; import Spinner from "../views/elements/Spinner";
import { TileShape } from '../views/rooms/EventTile'; import { TileShape } from '../views/rooms/EventTile';
import { Layout } from "../../settings/Layout";
interface IProps { interface IProps {
roomId: string; roomId: string;
@ -267,6 +268,7 @@ class FilePanel extends React.Component<IProps, IState> {
tileShape={TileShape.FileGrid} tileShape={TileShape.FileGrid}
resizeNotifier={this.props.resizeNotifier} resizeNotifier={this.props.resizeNotifier}
empty={emptyState} empty={emptyState}
layout={Layout.Group}
/> />
</BaseCard> </BaseCard>
); );

2
src/components/structures/NotificationPanel.tsx
View file

@ -23,6 +23,7 @@ import { replaceableComponent } from "../../utils/replaceableComponent";
import TimelinePanel from "./TimelinePanel"; import TimelinePanel from "./TimelinePanel";
import Spinner from "../views/elements/Spinner"; import Spinner from "../views/elements/Spinner";
import { TileShape } from "../views/rooms/EventTile"; import { TileShape } from "../views/rooms/EventTile";
import { Layout } from "../../settings/Layout";
interface IProps { interface IProps {
onClose(): void; onClose(): void;
@ -52,6 +53,7 @@ export default class NotificationPanel extends React.PureComponent<IProps> {
tileShape={TileShape.Notif} tileShape={TileShape.Notif}
empty={emptyState} empty={emptyState}
alwaysShowTimestamps={true} alwaysShowTimestamps={true}
layout={Layout.Group}
/> />
); );
} else { } else {