github-mirror/discourse
2
0
Fork 0
mirror of https://github.com/discourse/discourse.git synced 2025-01-16 03:42:41 +08:00
Code Issues Actions 1 Packages Projects Releases Wiki Activity

UX: improve table hover states, fix table button margin issue (#30585)

Browse Source
This commit is contained in:
Kris 2025-01-06 13:59:48 -05:00 committed by GitHub
parent 3dfe1a9fda
commit 116c3f7f8d
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
2 changed files with 10 additions and 4 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
app/assets/javascripts/discourse/app/instance-initializers/post-decorations.js
View File

@ -119,7 +119,7 @@ export default {
"btn-default",
"btn",
"btn-icon",
...(props.label ? ["no-text"] : []),
...(props.label ? [] : ["no-text"]),
];
openPopupBtn.classList.add(...defaultClasses);
@ -197,7 +197,6 @@ export default {
const tableEditorBtn = _createButton({
classes: ["btn-edit-table"],
title: "table_builder.edit.btn_edit",
label: "table_builder.edit.btn_edit",
icon: {
name: "pencil",
class: "edit-table-icon",
@ -208,6 +207,7 @@ export default {
table.parentNode.classList.add("fullscreen-table-wrapper");
if (attrs.canEdit) {
table.parentNode.classList.add("--editable");
buttonWrapper.append(tableEditorBtn);
tableEditorBtn.addEventListener(
"click",
@ -229,6 +229,8 @@ export default {
return;
}
table.parentNode.classList.add("--has-overflow");
const expandTableBtn = _createButton({
classes: ["btn-expand-table"],
title: "fullscreen_table.expand_btn",

8
app/assets/stylesheets/common/base/topic-post.scss
View File

@ -1596,12 +1596,16 @@ iframe {
html.discourse-no-touch .fullscreen-table-wrapper:hover {
border-radius: 5px;
box-shadow: 0 2px 5px 0 rgba(var(--always-black-rgb), 0.1),
0 2px 10px 0 rgba(var(--always-black-rgb), 0.1);
.open-popup-link {
opacity: 100%;
}
&.--has-overflow,
&.--editable {
box-shadow: 0 2px 5px 0 rgba(var(--always-black-rgb), 0.1),
0 2px 10px 0 rgba(var(--always-black-rgb), 0.1);
}
}
.read-state {