Archives/gristlabs_grist-core
1
0
Fork 0
mirror of https://github.com/gristlabs/grist-core.git synced 2024-10-27 20:44:07 +00:00
Code Issues Projects Releases Wiki Activity

(core) Show sigma next to summary table titles

Browse Source 
Summary:
The sigma icon appears to the left of the table title
if the table is a summary table.

Test Plan: Updated browser tests.

Reviewers: jarek

Reviewed By: jarek

Subscribers: jarek

Differential Revision: https://phab.getgrist.com/D2895
This commit is contained in:
George Gevoian 2021-07-08 11:52:51 -07:00
parent 9592e3610b
commit 5d461a4df2
2 changed files with 16 additions and 5 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
app/client/components/ViewLayout.css
View File

@ -9,7 +9,6 @@
.viewsection_title {
flex-shrink: 0;
align-items: baseline;
cursor: default;
height: 24px;
margin-left: -16px; /* to include drag handle that shows up on hover */
@ -24,6 +23,9 @@
cursor: text;
overflow: hidden;
}
.viewsection_titletext_container {
height: max-content;
}
.viewsection_content {
background-color: #ffffff;
@ -42,7 +44,7 @@
/* TODO should be switched to use new icon */
.viewsection_drag_indicator {
visibility: hidden;
top: 0px;
top: 1px;
width: 16px;
height: 16px;
margin: 0;

15
app/client/components/ViewLayout.ts
View File

@ -22,6 +22,7 @@ import {computedArray, Disposable, dom, fromKo, Holder, IDomComponent, styled, s
import {Observable} from 'grainjs';
import * as ko from 'knockout';
import * as _ from 'underscore';
import {icon} from 'app/client/ui2018/icons';
// tslint:disable:no-console
@ -187,18 +188,20 @@ export class ViewLayout extends DisposableWithEvents implements IDomComponent {
cssViewLeafInactive.cls('', (use) => !vs.isDisposed() && !use(vs.hasFocus)),
dom.cls('active_section', vs.hasFocus),
dom.maybe((use) => use(vs.viewInstance) !== null, () => dom('div.viewsection_title.flexhbox',
dom.maybe<BaseView|null>((use) => use(vs.viewInstance), (viewInstance) => dom('div.viewsection_title.flexhbox',
dom('span.viewsection_drag_indicator.glyphicon.glyphicon-option-vertical',
// Makes element grabbable only if grist is not readonly.
dom.cls('layout_grabbable', (use) => !use(this.gristDoc.isReadonlyKo))),
dom('div.flexitem.flexhbox',
dom.maybe((use) => use(use(viewInstance.viewSection.table).summarySourceTable), () =>
cssSigmaIcon('Pivot', testId('sigma'))),
dom('div.viewsection_titletext_container.flexitem.flexhbox',
dom('span.viewsection_titletext', editableLabel(
fromKo(vs.titleDef),
(val) => vs.titleDef.saveOnly(val),
testId('viewsection-title'),
)),
),
dom.maybe<BaseView|null>(vs.viewInstance, (viewInstance: BaseView) => viewInstance.buildTitleControls()),
viewInstance.buildTitleControls(),
dom('span.viewsection_buttons',
dom.create(viewSectionMenu, this.docModel, vs, this.viewModel, this.gristDoc.isReadonly)
)
@ -299,6 +302,12 @@ export class ViewLayout extends DisposableWithEvents implements IDomComponent {
}
}
const cssSigmaIcon = styled(icon, `
bottom: 1px;
margin-right: 5px;
background-color: ${colors.slate}
`);
const cssViewLeaf = styled('div', `
@media ${mediaSmall} {
& {