codeStyle(column-desc): create separate iconTooltip for column description

This commit is contained in:
Camille
2023-02-01 13:55:41 +01:00
parent 95f1a41618
commit bd9c9aa8f9
9 changed files with 115 additions and 112 deletions

View File

@@ -244,6 +244,7 @@
.detail_theme_field_form .info_toggle_icon {
width: 13px;
height: 13px;
margin-bottom: 3px;
}
/* TODO want to style better the values themselves (e.g. more padding, rounded corners, move label

View File

@@ -15,7 +15,7 @@ const RecordLayout = require('./RecordLayout');
const commands = require('./commands');
const {RowContextMenu} = require('../ui/RowContextMenu');
const {parsePasteForView} = require("./BaseView2");
const {withInfoTooltip} = require('../ui/tooltips');
const {columnInfoTooltip} = require("../ui/tooltips");
/**
* DetailView component implements a list of record layouts.
@@ -228,12 +228,10 @@ DetailView.prototype.buildFieldDom = function(field, row) {
if (field.isNewField) {
return dom('div.g_record_detail_el.flexitem',
kd.cssClass(function() { return 'detail_theme_field_' + self.viewSection.themeDef(); }),
field.description.peek() ?
withInfoTooltip(
dom('div.g_record_detail_label', kd.text(field.displayLabel)),
dom('div.g_record_detail_description', kd.text(field.description)),
) : dom('div.g_record_detail_label', kd.text(field.displayLabel)),
dom('div.g_record_detail_value', field.value)
dom('div.g_record_detail_label',
kd.text(field.displayLabel),
kd.scope(field.description, desc => desc ? columnInfoTooltip(kd.text(field.description)) : null)
),
);
}
@@ -262,11 +260,10 @@ DetailView.prototype.buildFieldDom = function(field, row) {
dom.autoDispose(isCellSelected),
dom.autoDispose(isCellActive),
kd.cssClass(function() { return 'detail_theme_field_' + self.viewSection.themeDef(); }),
field.description.peek() ?
withInfoTooltip(
dom('div.g_record_detail_label', kd.text(field.displayLabel)),
dom('div.g_record_detail_description', kd.text(field.description)),
) : dom('div.g_record_detail_label', kd.text(field.displayLabel)),
dom('div.g_record_detail_label',
kd.text(field.displayLabel),
kd.scope(field.description, desc => desc ? columnInfoTooltip(kd.text(field.description)) : null)
),
dom('div.g_record_detail_value',
kd.toggleClass('scissors', isCopyActive),
kd.toggleClass('record-add', row._isAddRow),

View File

@@ -2,7 +2,7 @@ import {DocPageModel} from 'app/client/models/DocPageModel';
import {urlState} from 'app/client/models/gristUrlState';
import {docListHeader} from 'app/client/ui/DocMenuCss';
import {GristTooltips, TooltipContentFunc} from 'app/client/ui/GristTooltips';
import { withQuestionMarkTooltip } from 'app/client/ui/tooltips';
import {withInfoTooltip} from 'app/client/ui/tooltips';
import {mediaXSmall, theme} from 'app/client/ui2018/cssVars';
import {icon} from 'app/client/ui2018/icons';
import {loadingDots, loadingSpinner} from 'app/client/ui2018/loaders';
@@ -284,7 +284,7 @@ function buildUsageMetric(options: MetricOptions, ...domArgs: DomElementArg[]) {
return cssUsageMetric(
cssMetricName(
tooltipContentFunc
? withQuestionMarkTooltip(
? withInfoTooltip(
cssOverflowableText(name, testId('name')),
tooltipContentFunc()
)