@conduction/nextcloud-vue 2.135.0 → 2.136.0

package/src/css/look-board-detail.css

@@ -91,7 +91,7 @@
 }
 
 .cn-look-board .cn-detail-page .cn-detail-page__header-actions > .button-vue--secondary:hover,
-.cn-look-board .cn-detail-page .cn-detail-page__header-actions .action-item--secondary .action-item__menutoggle:hover {
+.cn-look-board .cn-detail-page .cn-detail-page__header-actions .action-item--secondary:not(.action-item--open) .action-item__menutoggle:hover {
 	background: var(--color-background-hover) !important;
 }
 
@@ -1317,6 +1317,25 @@
 	font-size: 15px;
 }
 
+/* A card with actions holds them at its end, beside the title and meta (the
+   board's "···" on each task). */
+.cn-look-board .cn-grouped-cards__item.cn-grouped-cards__item:has(> .cn-grouped-cards__item-actions):not(.cn-look-nextcloud *) {
+	display: grid;
+	grid-template-columns: minmax(0, 1fr) auto;
+	column-gap: 12px;
+	align-items: center;
+}
+
+.cn-look-board .cn-grouped-cards__item:has(> .cn-grouped-cards__item-actions) > :not(.cn-grouped-cards__item-actions):not(.cn-look-nextcloud *) {
+	grid-column: 1;
+}
+
+.cn-look-board .cn-grouped-cards__item:has(> .cn-grouped-cards__item-actions) > .cn-grouped-cards__item-actions:not(.cn-look-nextcloud *) {
+	grid-column: 2;
+	grid-row: 1 / span 3;
+	margin: 0;
+}
+
 /* ---- A file's side card (CnFilesBrowser) --------------------------------- */
 /* The board's side card: radius 12, 20px 22px of padding, the title a 15px
    muted heading at 600, the facts 8px 16px apart with the values at 500
@@ -1501,3 +1520,30 @@
 	border-radius: var(--cn-board-control-radius);
 	overflow: hidden;
 }
+
+/* ---- A record list drawn as a data table (CnRecordListWidget) ----------- */
+/* `tableLook: "data"` (DqZaaktype "Berichten aan de aanvrager"): the board's
+   card table rather than the compact grid, a near-white header band at
+   14px/600 in the muted ink, 10px 12px, and 14px cells, 11px 12px, a
+   hairline above each row. Two classes more than the compact grid's rule.
+   @spec openspec/changes/record-list-data-table-and-notice-footnote/specs/record-list/spec.md#requirement-a-record-list-table-can-be-drawn-as-a-data-table */
+.cn-look-board .cn-record-list.cn-record-list--table.cn-record-list--data-table .cn-record-list__table th:not(.cn-look-nextcloud *) {
+	--nldesign-component-table-header-background-color: var(--cn-board-table-head-bg, color-mix(in srgb, var(--color-background-hover) 40%, var(--color-main-background)));
+	--nldesign-component-table-header-color: var(--color-text-maxcontrast);
+	--nldesign-component-table-header-font-weight: 600;
+	padding: 10px 12px;
+	border-bottom: 0;
+	background: var(--cn-board-table-head-bg, color-mix(in srgb, var(--color-background-hover) 40%, var(--color-main-background)));
+	color: var(--color-text-maxcontrast);
+	font-size: 14px;
+	font-weight: 600;
+	line-height: 1.2;
+}
+
+.cn-look-board .cn-record-list.cn-record-list--table.cn-record-list--data-table .cn-record-list__table td:not(.cn-look-nextcloud *) {
+	padding: 11px 12px;
+	border-top: 1px solid var(--cn-board-hairline);
+	border-bottom: 0;
+	font-size: 14px;
+	line-height: 1.2;
+}

package/src/css/look-board-index.css

@@ -89,7 +89,7 @@
 }
 
 .cn-look-board .cn-index-page .cn-index-page__header-buttons > .button-vue--secondary:hover,
-.cn-look-board .cn-index-page .cn-index-page__header-buttons > .action-item .button-vue:hover {
+.cn-look-board .cn-index-page .cn-index-page__header-buttons > .action-item:not(.action-item--open) .button-vue:hover {
 	background: var(--color-background-hover) !important;
 }
 
@@ -1943,6 +1943,31 @@
 	border-radius: 50%;
 }
 
+/* The panel's words (DqFilterBeheren): a group heading at 15px/700 in the
+   main ink, the group's note and a view's description at 13px in the muted
+   ink, never bold.
+   @spec openspec/changes/board-saved-views-panel-type/specs/board-saved-views-panel-type/spec.md */
+.cn-look-board .cn-saved-views-panel:not(.cn-look-nextcloud *) .cn-saved-views-panel__section {
+	margin: 12px 0 0;
+	font-size: 15px;
+	font-weight: 700;
+	line-height: 1.2;
+	color: var(--color-main-text);
+}
+
+.cn-look-board .cn-saved-views-panel:not(.cn-look-nextcloud *) .cn-saved-views-panel__note {
+	font-size: 13px;
+	font-weight: 400;
+	line-height: 1.3;
+	color: var(--color-text-maxcontrast);
+}
+
+.cn-look-board .cn-saved-views-panel:not(.cn-look-nextcloud *) .cn-saved-views-panel__subline {
+	font-size: 13px;
+	font-weight: 400;
+	color: var(--color-text-maxcontrast);
+}
+
 /* ---- A saved view row's menu ------------------------------------------- */
 /* The menu trigger on a saved view row ("Beheer Termijn deze week") is a
    round 34px button (DqFilterBeheren, DqFilterInMenu); NcActions drew the

package/src/css/look-board.css

@@ -582,6 +582,31 @@
 	background: var(--color-background-hover);
 }
 
+/* ---- An ordered list field ----------------------------------------------- */
+/* DqPersoonlijkeInstellingen "Weergaven in mijn menu": a row's labelled remove
+   button ("Uit menu halen") is an outlined secondary button, and the select
+   that adds a row runs the field's full width.
+   @spec openspec/changes/board-ordered-list-field/specs/board-ordered-list-field/spec.md */
+.cn-look-board .cn-ordered-list-field__button--text:not(.cn-look-nextcloud *) {
+	box-sizing: border-box;
+	height: 34px;
+	min-height: 34px;
+	padding: 0 14px;
+	border: 1px solid var(--cn-board-control-border);
+	background: var(--color-main-background);
+	color: var(--color-main-text);
+	font-size: 14px;
+}
+
+.cn-look-board .cn-ordered-list-field__button--text:not(.cn-look-nextcloud *):hover:not(:disabled) {
+	background: var(--color-background-hover);
+}
+
+.cn-look-board .cn-ordered-list-field__add .v-select:not(.cn-look-nextcloud *) {
+	width: 100%;
+	max-width: none;
+}
+
 /* ---- A secondary button --------------------------------------------------- */
 /* The boards draw every secondary button neutral: the main background, a 1px
    control border, the main text, the hover ground on hover (DqFlow "Testen
@@ -1407,6 +1432,15 @@ body:has(.cn-look-board):not(:has(.cn-look-nextcloud)) .v-popper__popper.action-
 	color: var(--color-text-maxcontrast);
 }
 
+/* A linked cell in a settings card's table reads in the text ink, as the index
+   tables do, not in the settings page's link blue (DqInstellingen: a
+   connection's name opens its settings card). The underline marks the link.
+   @spec openspec/changes/settings-table-link-ink/specs/settings-board-look/spec.md */
+.cn-look-board .settings-section .cn-data-table a.cn-cell-renderer__link:not(.cn-look-nextcloud *) {
+	color: var(--color-main-text);
+	text-decoration: underline;
+}
+
 /* Section actions sit at the end of the title row. The row is a grid, so a
    long title wraps beside the buttons instead of running under them. A
    half-width card keeps them there (DqVthInstellingen "Inspectiechecklists",
@@ -1801,14 +1835,16 @@ body:has(.cn-look-board):not(:has(.cn-look-nextcloud)) .v-popper__popper.action-
 	line-height: 1.5;
 }
 
+/* `!important` on the size: a theme that sizes every paragraph with
+   `!important` (thematiq's paragraph token, 15px) would win otherwise. */
 .cn-look-board .notecard.notecard--info:not(.cn-look-nextcloud *) p {
 	color: var(--color-primary-element-light-text) !important;
-	font-size: inherit;
+	font-size: inherit !important;
 	line-height: inherit;
 }
 
 .cn-look-board .notecard.notecard--info:not(.cn-look-nextcloud *) .notecard__heading {
-	font-size: inherit;
+	font-size: inherit !important;
 	font-weight: 700 !important;
 }
 
@@ -2886,9 +2922,16 @@ body:has(.cn-look-board):not(:has(.cn-look-nextcloud)) .v-popper__popper.action-
    gives the second pixel back so the words stay put. The board draws no
    option icon, only the radio and the words.
    @spec openspec/changes/board-setup-choice-rows/specs/board-setup-choice-rows/spec.md */
+/* The radio sits 21px inside the option's edge (DqInstellen): 1px border and
+   20px padding, or 2px and 19px on the chosen option.
+   @spec openspec/changes/board-setup-choice-inset/specs/board-setup-choice-rows/spec.md */
+.cn-look-board .cn-setup-step .cn-choice-cards .cn-choice-cards__row:not(.cn-look-nextcloud *) {
+	padding: 12px 20px;
+}
+
 .cn-look-board .cn-setup-step .cn-choice-cards .cn-choice-cards__row--selected:not(.cn-look-nextcloud *),
 .cn-look-board .cn-setup-step .cn-choice-cards .cn-choice-cards__row--selected:hover:not(.cn-look-nextcloud *) {
-	padding: 11px 13px;
+	padding: 11px 19px;
 	border-width: 2px;
 	box-shadow: none;
 }

package/src/utils/widgetDispatch.js

@@ -55,10 +55,12 @@ import { canonicalWidgetType } from './widgetTypeAliases.js'
  * and its title come from the host, and the catalog Add does not apply.
  * `handoff` is one action on one record; the card and title come from the host.
  * `macros` lists a record's macros with their buttons; the card and title come from the host.
+ * `grouped-cards` draws groups of cards (DqZaaktype "Fasen en taken") with no card of
+ * its own; the card, title and subtitle come from the host, and it has no Add.
  *
  * @type {string[]}
  */
-export const CONTENT_ONLY_TYPES = Object.freeze(['object-list', 'table', 'files', 'flow-runs', 'tasks', 'events', 'facts', 'linked', 'field-list', 'record-list', 'parties', 'map', 'settings-form', 'switch-rows', 'radio-cards', 'chips-field', 'toggle-table', 'choice-picker', 'checklist', 'object-translations', 'row-mark-list', 'slot-grid', 'handoff', 'macros', 'ai-chat'])
+export const CONTENT_ONLY_TYPES = Object.freeze(['object-list', 'table', 'files', 'flow-runs', 'tasks', 'events', 'facts', 'linked', 'field-list', 'record-list', 'parties', 'map', 'settings-form', 'switch-rows', 'radio-cards', 'chips-field', 'toggle-table', 'choice-picker', 'checklist', 'object-translations', 'row-mark-list', 'slot-grid', 'handoff', 'macros', 'ai-chat', 'grouped-cards'])
 
 /**
  * The stored content/config blob for a widget definition.