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

Disallow invalid inline style comments in stylesheets (#9099)

Browse Source
This commit is contained in:
Germain
2022-07-27 14:39:29 +01:00
committed by GitHub
parent 8eeeee1aa2
commit 72c24af5c0
193 changed files with 1520 additions and 1518 deletions
Download Patch File Download Diff File Expand all files Collapse all files
res/css/views/elements/_AccessibleButton.pcss
+2 -2
View File
@@ -38,8 +38,8 @@ limitations under the License.
align-items: center;
justify-content: center;
font-size: $font-14px;
border: none; // override default <button /> styles
word-break: keep-all; // prevent button text in Chinese/Japanese/Korean (CJK) from being collapsed
border: none; /* override default <button /> styles */
word-break: keep-all; /* prevent button text in Chinese/Japanese/Korean (CJK) from being collapsed */
&.mx_AccessibleButton_kind_primary_sm,
&.mx_AccessibleButton_kind_danger_sm,
res/css/views/elements/_CopyableText.pcss
+2 -2
View File
@@ -32,13 +32,13 @@ limitations under the License.
.mx_CopyableText_copyButton {
flex-shrink: 0;
// using em here to adapt to the local font size
/* using em here to adapt to the local font size */
width: 1em;
height: 1em;
cursor: pointer;
margin-left: 20px;
display: block;
// center to first line
/* center to first line */
position: relative;
top: .15em;
res/css/views/elements/_Dropdown.pcss
+3 -3
View File
@@ -95,9 +95,9 @@ input.mx_Dropdown_option:focus {
border: 0;
padding-top: 0;
padding-bottom: 0;
// XXX: hack to prevent text box being too big and pushing
// its parent out / overlapping the dropdown arrow. Only really
// works in the Country dropdown.
/* XXX: hack to prevent text box being too big and pushing */
/* its parent out / overlapping the dropdown arrow. Only really */
/* works in the Country dropdown. */
width: 60%;
}
res/css/views/elements/_EditableItemList.pcss
+1 -1
View File
@@ -51,7 +51,7 @@ limitations under the License.
.mx_EditableItem_item {
flex: auto 1 0;
order: 1;
width: calc(100% - 14px); // leave space for the remove button
width: calc(100% - 14px); /* leave space for the remove button */
overflow-x: hidden;
text-overflow: ellipsis;
}
res/css/views/elements/_FacePile.pcss
+2 -2
View File
@@ -23,7 +23,7 @@ limitations under the License.
flex-direction: row-reverse;
vertical-align: middle;
// Overlap the children
/* Overlap the children */
> * + * {
margin-right: -8px;
}
@@ -33,7 +33,7 @@ limitations under the License.
}
.mx_BaseAvatar_initial {
margin: 1px; // to offset the border on the image
margin: 1px; /* to offset the border on the image */
}
.mx_FacePile_more {
res/css/views/elements/_Field.pcss
+6 -6
View File
@@ -42,8 +42,8 @@ limitations under the License.
font-weight: normal;
font-size: $font-14px;
border: none;
// Even without a border here, we still need this avoid overlapping the rounded
// corners on the field above.
/* Even without a border here, we still need this avoid overlapping the rounded */
/* corners on the field above. */
border-radius: 4px;
padding: 8px 9px;
color: $primary-content;
@@ -57,7 +57,7 @@ limitations under the License.
-webkit-appearance: none;
}
// Can't add pseudo-elements to a select directly, so we use its parent.
/* Can't add pseudo-elements to a select directly, so we use its parent. */
.mx_Field_select::before {
content: "";
position: absolute;
@@ -108,11 +108,11 @@ limitations under the License.
left: 0px;
margin: 7px 8px;
padding: 2px;
pointer-events: none; // Allow clicks to fall through to the input
pointer-events: none; /* Allow clicks to fall through to the input */
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
max-width: calc(100% - 20px); // 100% of parent minus margin and padding
max-width: calc(100% - 20px); /* 100% of parent minus margin and padding */
}
.mx_Field_labelAlwaysTopLeft label,
@@ -183,7 +183,7 @@ limitations under the License.
animation: mx_fadeout 1s 2s forwards;
}
// Customise other components when placed inside a Field
/* Customise other components when placed inside a Field */
.mx_Field .mx_Dropdown_input {
border: initial;
res/css/views/elements/_GenericEventListSummary.pcss
+5 -5
View File
@@ -42,12 +42,12 @@ limitations under the License.
margin-block: 0;
&[aria-expanded="false"] {
order: 9; // TODO: Remove
order: 9; /* TODO: Remove */
}
&[aria-expanded="true"] {
margin-inline-start: auto; // reduce clickable area
margin-inline-end: var(--EventTile_bubble-margin-inline-end); // as the parent has zero margin
margin-inline-start: auto; /* reduce clickable area */
margin-inline-end: var(--EventTile_bubble-margin-inline-end); /* as the parent has zero margin */
}
}
@@ -61,8 +61,8 @@ limitations under the License.
column-gap: 5px;
}
// ideally we'd use display=contents here for the layout to all work regardless of the *ELS but
// that breaks ScrollPanel's reliance upon offsetTop so we have to have a bit more finesse.
/* ideally we'd use display=contents here for the layout to all work regardless of the *ELS but */
/* that breaks ScrollPanel's reliance upon offsetTop so we have to have a bit more finesse. */
&[data-expanded="true"] {
flex-direction: column;
margin: 0;
res/css/views/elements/_ImageView.pcss
+1 -1
View File
@@ -135,7 +135,7 @@ $button-gap: 24px;
.mx_ImageView_button_close {
padding: calc($button-size - $button-size);
border-radius: 100%;
background: #21262c; // same on all themes
background: #21262c; /* same on all themes */
&::before {
width: $button-size;
height: $button-size;
res/css/views/elements/_InlineSpinner.pcss
+1 -1
View File
@@ -24,5 +24,5 @@ limitations under the License.
}
.mx_InlineSpinner_icon {
display: inline-block !important; // Override regular mx_Spinner_icon
display: inline-block !important; /* Override regular mx_Spinner_icon */
}
res/css/views/elements/_InteractiveTooltip.pcss
+10 -10
View File
@@ -29,19 +29,19 @@ limitations under the License.
}
.mx_InteractiveTooltip.mx_InteractiveTooltip_withChevron_top {
top: 10px; // 8px chevron + 2px spacing
top: 10px; /* 8px chevron + 2px spacing */
}
.mx_InteractiveTooltip.mx_InteractiveTooltip_withChevron_left {
left: 10px; // 8px chevron + 2px spacing
left: 10px; /* 8px chevron + 2px spacing */
}
.mx_InteractiveTooltip.mx_InteractiveTooltip_withChevron_right {
right: 10px; // 8px chevron + 2px spacing
right: 10px; /* 8px chevron + 2px spacing */
}
.mx_InteractiveTooltip.mx_InteractiveTooltip_withChevron_bottom {
bottom: 10px; // 8px chevron + 2px spacing
bottom: 10px; /* 8px chevron + 2px spacing */
}
.mx_InteractiveTooltip_chevron_top {
@@ -55,8 +55,8 @@ limitations under the License.
border-right: 8px solid transparent;
}
// Adapted from https://codyhouse.co/blog/post/css-rounded-triangles-with-clip-path
// by Sebastiano Guerriero (@guerriero_se)
/* Adapted from https://codyhouse.co/blog/post/css-rounded-triangles-with-clip-path */
/* by Sebastiano Guerriero (@guerriero_se) */
@supports (clip-path: polygon(0% 0%, 100% 100%, 0% 100%)) {
.mx_InteractiveTooltip_chevron_top {
height: 16px;
@@ -66,7 +66,7 @@ limitations under the License.
clip-path: polygon(0% 0%, 100% 100%, 0% 100%);
transform: rotate(135deg);
border-radius: 0 0 0 3px;
top: calc(-8px / 1.414); // sqrt(2) because of rotation
top: calc(-8px / 1.414); /* sqrt(2) because of rotation */
}
}
@@ -81,8 +81,8 @@ limitations under the License.
border-right: 8px solid transparent;
}
// Adapted from https://codyhouse.co/blog/post/css-rounded-triangles-with-clip-path
// by Sebastiano Guerriero (@guerriero_se)
/* Adapted from https://codyhouse.co/blog/post/css-rounded-triangles-with-clip-path */
/* by Sebastiano Guerriero (@guerriero_se) */
@supports (clip-path: polygon(0% 0%, 100% 100%, 0% 100%)) {
.mx_InteractiveTooltip_chevron_bottom {
height: 16px;
@@ -92,6 +92,6 @@ limitations under the License.
clip-path: polygon(0% 0%, 100% 100%, 0% 100%);
transform: rotate(-45deg);
border-radius: 0 0 0 3px;
bottom: calc(-8px / 1.414); // sqrt(2) because of rotation
bottom: calc(-8px / 1.414); /* sqrt(2) because of rotation */
}
}
res/css/views/elements/_LabelledCheckbox.pcss
+1 -1
View File
@@ -19,7 +19,7 @@ limitations under the License.
flex-direction: row;
.mx_Checkbox {
margin-top: 3px; // visually align with label text
margin-top: 3px; /* visually align with label text */
}
.mx_LabelledCheckbox_labels {
res/css/views/elements/_MiniAvatarUploader.pcss
+2 -2
View File
@@ -18,14 +18,14 @@ limitations under the License.
position: relative;
width: min-content;
// this isn't a floating tooltip so override some things to not need to bother with z-index and floating
/* this isn't a floating tooltip so override some things to not need to bother with z-index and floating */
.mx_Tooltip {
display: inline-block;
position: absolute;
z-index: unset;
width: max-content;
left: 72px;
// top edge starting at 50 % of parent - 50 % of itself -> centered vertically
/* top edge starting at 50 % of parent - 50 % of itself -> centered vertically */
top: 50%;
transform: translateY(-50%);
}
res/css/views/elements/_Pill.pcss
+12 -12
View File
@@ -26,47 +26,47 @@ limitations under the License.
overflow: hidden;
cursor: pointer;
color: $accent-fg-color !important; // To override .markdown-body
background-color: $pill-bg-color !important; // To override .markdown-body
color: $accent-fg-color !important; /* To override .markdown-body */
background-color: $pill-bg-color !important; /* To override .markdown-body */
&.mx_UserPill_me,
&.mx_AtRoomPill {
background-color: $alert !important; // To override .markdown-body
background-color: $alert !important; /* To override .markdown-body */
}
&:hover {
background-color: $pill-hover-bg-color !important; // To override .markdown-body
background-color: $pill-hover-bg-color !important; /* To override .markdown-body */
}
&.mx_UserPill_me:hover {
background-color: #ff6b75 !important; // To override .markdown-body | same on both themes
background-color: #ff6b75 !important; /* To override .markdown-body | same on both themes */
}
// We don't want to indicate clickability
/* We don't want to indicate clickability */
&.mx_AtRoomPill:hover {
background-color: $alert !important; // To override .markdown-body
background-color: $alert !important; /* To override .markdown-body */
cursor: unset;
}
&::before,
.mx_BaseAvatar {
margin-inline-start: -0.3em; // Otherwise the gap is too large
margin-inline-start: -0.3em; /* Otherwise the gap is too large */
margin-inline-end: 0.2em;
min-width: $font-16px; // ensure the avatar is not compressed
min-width: $font-16px; /* ensure the avatar is not compressed */
}
.mx_Pill_linkText {
white-space: nowrap; // enforce the pill text to be a single line
white-space: nowrap; /* enforce the pill text to be a single line */
overflow: hidden;
text-overflow: ellipsis;
pointer-events: none; // ensure clicks on the pills go through the anchor
pointer-events: none; /* ensure clicks on the pills go through the anchor */
}
a& {
text-overflow: ellipsis;
white-space: nowrap;
overflow: hidden;
text-decoration: none !important; // To override .markdown-body
text-decoration: none !important; /* To override .markdown-body */
}
}
res/css/views/elements/_ReplyChain.pcss
+2 -2
View File
@@ -16,14 +16,14 @@ limitations under the License.
.mx_ReplyChain {
margin: 0 0 $spacing-8 0;
padding: 0 10px; // TODO: Use a spacing variable
padding: 0 10px; /* TODO: Use a spacing variable */
border-left: 2px solid $accent;
border-radius: 2px;
.mx_ReplyChain_show {
&.mx_AccessibleButton_kind_link_inline {
color: unset;
white-space: nowrap; // Enforce 'In reply to' to be a single line
white-space: nowrap; /* Enforce 'In reply to' to be a single line */
&:hover {
color: $links;
res/css/views/elements/_RichText.pcss
+6 -6
View File
@@ -1,6 +1,6 @@
// XXX: bleurgh, what is this? These classes totally break the component
// naming scheme; it's completely unclear where or how they're being used
// --Matthew
/* XXX: bleurgh, what is this? These classes totally break the component */
/* naming scheme; it's completely unclear where or how they're being used */
/* --Matthew */
.mx_Markdown_BOLD {
font-weight: bold;
@@ -13,7 +13,7 @@
// variant seems yield better results.
// compensate for Nunito italics being terrible
// https://github.com/google/fonts/issues/1726
// https://github.com/google/fonts/issues/172
transform: skewX(-14deg);
display: inline-block;
*/
@@ -37,8 +37,8 @@
}
.mx_Emoji {
// Should be 1.8rem for our default message bodies, and scale with the
// surrounding text
/* Should be 1.8rem for our default message bodies, and scale with the */
/* surrounding text */
font-size: max($font-18px, 1em);
vertical-align: bottom;
}
res/css/views/elements/_RoomAliasField.pcss
+6 -6
View File
@@ -15,8 +15,8 @@ limitations under the License.
*/
.mx_RoomAliasField {
// if parent is a flex container, this allows the
// width to be as wide as needed, and not 100%
/* if parent is a flex container, this allows the */
/* width to be as wide as needed, and not 100% */
flex: 0 1 auto;
display: flex;
align-items: stretch;
@@ -47,10 +47,10 @@ limitations under the License.
text-overflow: ellipsis;
white-space: nowrap;
overflow: hidden;
// this allows the domain name to show
// as long as it doesn't make the input shrink
// if it's too big, it shows an ellipsis
// 180: 28 for prefix, 152 for input
/* this allows the domain name to show */
/* as long as it doesn't make the input shrink */
/* if it's too big, it shows an ellipsis */
/* 180: 28 for prefix, 152 for input */
max-width: calc(100% - 180px);
}
}
res/css/views/elements/_SSOButtons.pcss
+3 -3
View File
@@ -61,9 +61,9 @@ limitations under the License.
.mx_SSOButton_mini {
box-sizing: border-box;
width: 50px; // 48px + 1px border on all sides
height: 50px; // 48px + 1px border on all sides
min-width: 50px; // prevent crushing by the flexbox
width: 50px; /* 48px + 1px border on all sides */
height: 50px; /* 48px + 1px border on all sides */
min-width: 50px; /* prevent crushing by the flexbox */
padding: 12px;
> img {
res/css/views/elements/_SettingsFlag.pcss
+1 -1
View File
@@ -55,7 +55,7 @@ limitations under the License.
line-height: $font-15px;
color: $secondary-content;
// Support code/pre elements in settings flag descriptions
/* Support code/pre elements in settings flag descriptions */
pre, code {
font-family: $monospace-font-family !important;
background-color: $rte-code-bg-color;
res/css/views/elements/_Slider.pcss
+4 -4
View File
@@ -32,7 +32,7 @@ limitations under the License.
position: absolute;
height: 1em;
width: 100%;
padding: 0 0.5em; // half the width of a dot.
padding: 0 0.5em; /* half the width of a dot. */
align-items: center;
}
@@ -46,7 +46,7 @@ limitations under the License.
.mx_Slider_selection {
display: flex;
align-items: center;
width: calc(100% - 1em); // 2 * half the width of a dot
width: calc(100% - 1em); /* 2 * half the width of a dot */
height: 1em;
position: absolute;
pointer-events: none;
@@ -94,8 +94,8 @@ limitations under the License.
color: $slider-background-color;
}
// The following is a hack to center the labels without adding
// any width to the slider's dots.
/* The following is a hack to center the labels without adding */
/* any width to the slider's dots. */
.mx_Slider_labelContainer {
width: 1em;
}
res/css/views/elements/_StyledRadioButton.pcss
+2 -2
View File
@@ -47,7 +47,7 @@ limitations under the License.
}
input[type="radio"] {
// Remove the OS's representation
/* Remove the OS's representation */
margin: 0;
padding: 0;
appearance: none;
@@ -63,7 +63,7 @@ limitations under the License.
box-sizing: border-box;
height: $font-16px;
width: $font-16px;
margin-left: 2px; // For the highlight on focus
margin-left: 2px; /* For the highlight on focus */
border: $font-1-5px solid $radio-circle-color;
border-radius: $font-16px;
res/css/views/elements/_TagComposer.pcss
+6 -6
View File
@@ -20,19 +20,19 @@ limitations under the License.
.mx_Field {
flex: 1;
margin: 0; // override from field styles
margin: 0; /* override from field styles */
}
.mx_AccessibleButton {
min-width: 70px;
padding: 0 8px; // override from button styles
margin-left: 16px; // distance from <Field>
padding: 0 8px; /* override from button styles */
margin-left: 16px; /* distance from <Field> */
}
.mx_Field,
.mx_Field input,
.mx_AccessibleButton {
// So they look related to each other by feeling the same
/* So they look related to each other by feeling the same */
border-radius: 8px;
}
}
@@ -40,7 +40,7 @@ limitations under the License.
.mx_TagComposer_tags {
display: flex;
flex-wrap: wrap;
margin-top: 12px; // this plus 12px from the tags makes 24px from the input
margin-top: 12px; /* this plus 12px from the tags makes 24px from the input */
}
.mx_Tag {
@@ -73,7 +73,7 @@ limitations under the License.
.mx_Tag_delete {
border-radius: 50%;
text-align: center;
width: 1.066666em; // 16px;
width: 1.066666em; /* 16px; */
height: 1.066666em;
line-height: 1em;
color: $secondary-content;
res/css/views/elements/_Tooltip.pcss
+3 -3
View File
@@ -62,7 +62,7 @@ limitations under the License.
display: none;
position: fixed;
border-radius: 8px;
z-index: 6000; // Higher than context menu so tooltips can be used everywhere
z-index: 6000; /* Higher than context menu so tooltips can be used everywhere */
padding: 10px;
pointer-events: none;
line-height: $font-14px;
@@ -71,7 +71,7 @@ limitations under the License.
max-width: 300px;
word-break: break-word;
background-color: #21262C; // Same on both themes
background-color: #21262C; /* Same on both themes */
color: $accent-fg-color;
border: 0;
text-align: center;
@@ -94,7 +94,7 @@ limitations under the License.
}
}
// These tooltips use an older style with a chevron
/* These tooltips use an older style with a chevron */
.mx_Field_tooltip {
background-color: $menu-bg-color;
color: $primary-content;