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

Improve styling of edge case devtools state keys (#7794)

Browse source
This commit is contained in:
Michael Telatynski 2022-02-14 23:37:45 +00:00 committed by GitHub
parent 401e5127f4
commit 8d3c2eddd6
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
3 changed files with 27 additions and 2 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

12
res/css/views/dialogs/_DevtoolsDialog.scss
View file

@ -27,6 +27,18 @@ limitations under the License.
margin-bottom: 10px;
}
.mx_DevTools_RoomStateExplorer_button {
font-family: monospace;
}
.mx_DevTools_RoomStateExplorer_button_hasSpaces {
text-decoration: underline;
}
.mx_DevTools_RoomStateExplorer_button.mx_DevTools_RoomStateExplorer_button_emptyString {
font-style: italic;
}
.mx_DevTools_RoomStateExplorer_button, .mx_DevTools_ServersInRoomList_button {
margin-bottom: 10px;
width: 100%;

14
src/components/views/dialogs/DevtoolsDialog.tsx
View file

@ -28,6 +28,7 @@ import {
import { Room } from "matrix-js-sdk/src/models/room";
import { MatrixEvent } from "matrix-js-sdk/src/models/event";
import { logger } from "matrix-js-sdk/src/logger";
import classNames from 'classnames';
import SyntaxHighlight from '../elements/SyntaxHighlight';
import { _t } from '../../../languageHandler';
@ -538,8 +539,17 @@ class RoomStateExplorer extends React.PureComponent<IExplorerProps, IRoomStateEx
list = <FilteredList query={this.state.queryStateKey} onChange={this.onQueryStateKey}>
{
Array.from(stateGroup.entries()).map(([stateKey, ev]) => {
return <button className={classes} key={stateKey} onClick={this.onViewSourceClick(ev)}>
{ stateKey }
const trimmed = stateKey.trim();
return <button
className={classNames(classes, {
mx_DevTools_RoomStateExplorer_button_hasSpaces: trimmed.length !== stateKey.length,
mx_DevTools_RoomStateExplorer_button_emptyString: !trimmed,
})}
key={stateKey}
onClick={this.onViewSourceClick(ev)}
>
{ trimmed ? stateKey : _t("<%(count)s spaces>", { count: stateKey.length }) }
</button>;
})
}

3
src/i18n/strings/en_EN.json
View file

@ -2515,6 +2515,9 @@
"Send Account Data": "Send Account Data",
"Filter results": "Filter results",
"Explore Room State": "Explore Room State",
"<%(count)s spaces>|other": "<%(count)s spaces>",
"<%(count)s spaces>|one": "<space>",
"<%(count)s spaces>|zero": "<empty string>",
"Explore Account Data": "Explore Account Data",
"View Servers in Room": "View Servers in Room",
"Verification Requests": "Verification Requests",