sorb/ThreadNet-Web
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases 4 Wiki Activity

Make shared-components tiles render identically outside Element Web - #4 (#33622)

Browse Source 
* Use shared MessageTimestampView in edit history

* Move timestamp typography into shared component

* Updated snapshots

* Update comments after clean up

* Fixed sonar issue and added tests for improved coverage

* Fix Prettier issue

* Fix font-size on timestamps and toolbar button sizing

* Updated snapshots

* Updated Storybook screenshots

* Updated screenshots

* Clean up app/web unused/redundant styling for disambiguated profile

* Fix merge error

* Fixes after merge

* Fixes after merge
This commit is contained in:
rbondesson
2026-06-01 05:47:59 +00:00
committed by GitHub
parent 32b66747f4
commit fc23fcad47
16 changed files with 322 additions and 70 deletions
Download Patch File Download Diff File Expand all files Collapse all files
apps/web/res/css/_common.pcss
+7 -13
View File
@@ -163,10 +163,10 @@ b {
font-weight: bold;
}
/* Keep the legacy link colour without overriding Compound anchors. */
a:where(:not([data-kind])):hover,
a:where(:not([data-kind])):link,
a:where(:not([data-kind])):visited {
/* Keep the legacy link colour without overriding Compound anchors or shared timestamp styling. */
a:where(:not([data-kind]):not(.mx_MessageTimestamp)):hover,
a:where(:not([data-kind]):not(.mx_MessageTimestamp)):link,
a:where(:not([data-kind]):not(.mx_MessageTimestamp)):visited {
color: $accent-alt;
}
@@ -600,6 +600,8 @@ legend {
.mx_InviteDialog_section button,
.mx_InviteDialog_editor button,
.mx_UnknownIdentityUsersWarningDialog button,
.mx_ThreadActionBar button,
.mx_HistoryActionBar button,
[class|="maplibregl"]
),
.mx_Dialog_buttons button:not(.mx_Dialog_nonDialogButton, .mx_AccessibleButton),
@@ -907,16 +909,8 @@ legend {
overflow: hidden;
}
/* This class is used extensively in element-web and are included here for compatibility with the existing timeline and layout.
/* TODO: Review mx_MessageTimestamp usage after finishing migration of timeline tiles to shared components. */
/* https://github.com/element-hq/element-web/issues/31651 */
/* Layout compatibility hook for timestamp placement in existing app/web timeline surfaces. */
.mx_MessageTimestamp {
color: var(--cpd-color-text-secondary) !important; /* override anchor color */
font-size: $font-10px;
font-variant-numeric: tabular-nums;
display: block; /* enable the width setting below */
width: var(--MessageTimestamp-width);
white-space: nowrap;
user-select: none;
text-decoration: none;
}