OpenProject is the leading open source project management software.
You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
openproject/app/assets/stylesheets/content/_attributes_group.lsg

192 lines
6.6 KiB

# Attributes Groups
## Attribute Lists
```
<div class="attributes-group">
<div class="attributes-group--header">
<div class="attributes-group--header-container">
<h3 class="attributes-group--header-text">System</h3>
</div>
</div>
<div class="attributes-key-value">
<div class="attributes-key-value--key">Catdoc available (optional)</div>
<div class="attributes-key-value--value-container">
<div class="attributes-key-value--value -text">
<span>
<i class="icon-context icon-bug"></i>
</span>
</div>
</div>
<div class="attributes-key-value--key">Attachments directory writable</div>
<div class="attributes-key-value--value-container">
<div class="attributes-key-value--value -text">
<span>
<i class="icon-context icon-checkmark"></i>
</span>
</div>
</div>
</div>
</div>
<div class="attributes-group">
<div class="attributes-group--header">
<div class="attributes-group--header-container">
<h3 class="attributes-group--header-text">Storage filesystem 1</h3>
</div>
</div>
<div class="attributes-key-value">
<div class="attributes-key-value--key">Encompasses storage for</div>
<div class="attributes-key-value--value-container">
<div class="attributes-key-value--value -text">
<span>Attachments</span>
</div>
</div>
<div class="attributes-key-value--key">Remaining disk space</div>
<div class="attributes-key-value--value-container">
<div class="attributes-key-value--value -text">
<span>120 GB</span>
</div>
</div>
</div>
</div>
```
## Attribute Lists with Inline Edit
```
<div class="attributes-group">
<div class="attributes-group--header">
<div class="attributes-group--header-container">
<h3 class="attributes-group--header-text">People</h3>
</div>
</div>
<div class="attributes-key-value">
<div class="attributes-key-value--key">Assignee</div>
<div class="attributes-key-value--value-container">
[31023] Preparation for project edit fields: Generalize edit and display fields currently work package specific (#7726) * Check edit fields for Work package dependencies * Make EditForm, NotificationService, EditContext indepenedent of Work Packages * Make EventsService independent of WorkPackages * Start renaming WpNotificationService (WiP) * Fix more references * Fix typescript errors * Add basic halEditingService * Rename to global halResourceEditingService (WiP) * Move typing from class to methods (WiP) * Fix typescript errors * Remove space in type * Add test project widget && generalize the editFieldGroup * Rename editing portal service [ci skip] * Rename WpEditFieldComponent * Rename WpDisplayFields * Rename display-XX-field to XX-display-field [ci skip] * Add WP specific ID field to distinguish between resources * Re-add state in work package resource * Generalize display field renderer * Rename spent-time to wp-spent-time and fix highlight specifics [ci skip] * Actually load the project schema and make field editable * Make edit-field-group.component an edit-form.component and subclass EditForm * Remove edit context in favor of specialized EditForm * Add special cases for work package editing * Fix edit actions bar * Fix codeclimate issues * Use WorkPackageNotificationService if necessary * Override NotificationService for WPs to allow WP specififc notifications (WiP) * Correctly provide wpNotification service Because the ui-router doesn't seem to correctly use the parent element's injector, we need to provide the wpNotification service not in the wp-base, but rather the wp-list component as well as in the isolated query space. * Allow to filter halEvents for specific resourceTypes (e.g. WorkPackage) * Remove superfluous cell class constant * Start renaming selectors for wp-edit-field into generics * Remove wp-table--cell-span in favor of display field selector * Consolidate other display and edit field styles * Provide specialized service for transitions in active edit forms * Remove superfluous overflowSelector * Accept that date field contains some work package specifics * Ignore unreadable files * Provide the changeset for work packages as a hook Since hal resource editing service is provided per query space, we cannot register them once (would only work globally) * Fix dangerfile * Remove another todo in halResourceNotification service * Fix npm TestBed for changed dependencies * Show inplace edit field in project details widget * Fix highlighting in single view * Provide HalResourceEditingService outside of project context * Used typedState for single-view * Also provide wpNotification service in split view * Correct check for resource type in eventsService * Fix getSchemaName in display field renderer * Fix passing ids into `halEditing.stopEditing` * Do not globally inject the halResourceEditingService There's a bug(?) in ui-router that gives you the global service before the parent injected service for a ui-view * Fix wpCreate service on copying and parallel creation * Remove test project widget * Revert changes for project details widget
5 years ago
<div class="inline-edit--container">
<span class="inline-edit--display-field inline-edit--display-field inplace-edit -editable" title="Jane Doe">Jane Doe</span>
</div>
</div>
<div class="attributes-key-value--key">
<wp-replacement-label>
<span class="wp-replacement-label"> Accountable </span>
</wp-replacement-label>
<attribute-help-text>
<a href="#" class="icon icon-help1">
</a>
</attribute-help-text>
</div>
<div class="attributes-key-value--value-container">
[31023] Preparation for project edit fields: Generalize edit and display fields currently work package specific (#7726) * Check edit fields for Work package dependencies * Make EditForm, NotificationService, EditContext indepenedent of Work Packages * Make EventsService independent of WorkPackages * Start renaming WpNotificationService (WiP) * Fix more references * Fix typescript errors * Add basic halEditingService * Rename to global halResourceEditingService (WiP) * Move typing from class to methods (WiP) * Fix typescript errors * Remove space in type * Add test project widget && generalize the editFieldGroup * Rename editing portal service [ci skip] * Rename WpEditFieldComponent * Rename WpDisplayFields * Rename display-XX-field to XX-display-field [ci skip] * Add WP specific ID field to distinguish between resources * Re-add state in work package resource * Generalize display field renderer * Rename spent-time to wp-spent-time and fix highlight specifics [ci skip] * Actually load the project schema and make field editable * Make edit-field-group.component an edit-form.component and subclass EditForm * Remove edit context in favor of specialized EditForm * Add special cases for work package editing * Fix edit actions bar * Fix codeclimate issues * Use WorkPackageNotificationService if necessary * Override NotificationService for WPs to allow WP specififc notifications (WiP) * Correctly provide wpNotification service Because the ui-router doesn't seem to correctly use the parent element's injector, we need to provide the wpNotification service not in the wp-base, but rather the wp-list component as well as in the isolated query space. * Allow to filter halEvents for specific resourceTypes (e.g. WorkPackage) * Remove superfluous cell class constant * Start renaming selectors for wp-edit-field into generics * Remove wp-table--cell-span in favor of display field selector * Consolidate other display and edit field styles * Provide specialized service for transitions in active edit forms * Remove superfluous overflowSelector * Accept that date field contains some work package specifics * Ignore unreadable files * Provide the changeset for work packages as a hook Since hal resource editing service is provided per query space, we cannot register them once (would only work globally) * Fix dangerfile * Remove another todo in halResourceNotification service * Fix npm TestBed for changed dependencies * Show inplace edit field in project details widget * Fix highlighting in single view * Provide HalResourceEditingService outside of project context * Used typedState for single-view * Also provide wpNotification service in split view * Correct check for resource type in eventsService * Fix getSchemaName in display field renderer * Fix passing ids into `halEditing.stopEditing` * Do not globally inject the halResourceEditingService There's a bug(?) in ui-router that gives you the global service before the parent injected service for a ui-view * Fix wpCreate service on copying and parallel creation * Remove test project widget * Revert changes for project details widget
5 years ago
<div class="inline-edit--container">
<span class="inline-edit--display-field inline-edit--display-field inplace-edit -editable" title="John Doe">John Doe</span>
</div>
</div>
</div>
</div>
<div class="attributes-group">
<div class="attributes-group--header">
<div class="attributes-group--header-container">
<h3 class="attributes-group--header-text">Details</h3>
</div>
</div>
<div class="attributes-key-value">
<div class="attributes-key-value--key">Progress (%)</div>
<div class="attributes-key-value--value-container">
[31023] Preparation for project edit fields: Generalize edit and display fields currently work package specific (#7726) * Check edit fields for Work package dependencies * Make EditForm, NotificationService, EditContext indepenedent of Work Packages * Make EventsService independent of WorkPackages * Start renaming WpNotificationService (WiP) * Fix more references * Fix typescript errors * Add basic halEditingService * Rename to global halResourceEditingService (WiP) * Move typing from class to methods (WiP) * Fix typescript errors * Remove space in type * Add test project widget && generalize the editFieldGroup * Rename editing portal service [ci skip] * Rename WpEditFieldComponent * Rename WpDisplayFields * Rename display-XX-field to XX-display-field [ci skip] * Add WP specific ID field to distinguish between resources * Re-add state in work package resource * Generalize display field renderer * Rename spent-time to wp-spent-time and fix highlight specifics [ci skip] * Actually load the project schema and make field editable * Make edit-field-group.component an edit-form.component and subclass EditForm * Remove edit context in favor of specialized EditForm * Add special cases for work package editing * Fix edit actions bar * Fix codeclimate issues * Use WorkPackageNotificationService if necessary * Override NotificationService for WPs to allow WP specififc notifications (WiP) * Correctly provide wpNotification service Because the ui-router doesn't seem to correctly use the parent element's injector, we need to provide the wpNotification service not in the wp-base, but rather the wp-list component as well as in the isolated query space. * Allow to filter halEvents for specific resourceTypes (e.g. WorkPackage) * Remove superfluous cell class constant * Start renaming selectors for wp-edit-field into generics * Remove wp-table--cell-span in favor of display field selector * Consolidate other display and edit field styles * Provide specialized service for transitions in active edit forms * Remove superfluous overflowSelector * Accept that date field contains some work package specifics * Ignore unreadable files * Provide the changeset for work packages as a hook Since hal resource editing service is provided per query space, we cannot register them once (would only work globally) * Fix dangerfile * Remove another todo in halResourceNotification service * Fix npm TestBed for changed dependencies * Show inplace edit field in project details widget * Fix highlighting in single view * Provide HalResourceEditingService outside of project context * Used typedState for single-view * Also provide wpNotification service in split view * Correct check for resource type in eventsService * Fix getSchemaName in display field renderer * Fix passing ids into `halEditing.stopEditing` * Do not globally inject the halResourceEditingService There's a bug(?) in ui-router that gives you the global service before the parent injected service for a ui-view * Fix wpCreate service on copying and parallel creation * Remove test project widget * Revert changes for project details widget
5 years ago
<div class="inline-edit--container">
<span title="-" class="inline-edit--display-field inline-edit--display-field inplace-edit -placeholder -editable">
<span style="width: 80px" class="progress-bar">
<span style="width: 60%" class="inner-progress closed"></span>
<span style="width: 0%" class="inner-progress done"></span>
</span>
<span class="progress-bar-legend">60%</span>
</span>
</div>
</div>
<div class="attributes-key-value--key">Date</div>
<div class="attributes-key-value--value-container">
[31023] Preparation for project edit fields: Generalize edit and display fields currently work package specific (#7726) * Check edit fields for Work package dependencies * Make EditForm, NotificationService, EditContext indepenedent of Work Packages * Make EventsService independent of WorkPackages * Start renaming WpNotificationService (WiP) * Fix more references * Fix typescript errors * Add basic halEditingService * Rename to global halResourceEditingService (WiP) * Move typing from class to methods (WiP) * Fix typescript errors * Remove space in type * Add test project widget && generalize the editFieldGroup * Rename editing portal service [ci skip] * Rename WpEditFieldComponent * Rename WpDisplayFields * Rename display-XX-field to XX-display-field [ci skip] * Add WP specific ID field to distinguish between resources * Re-add state in work package resource * Generalize display field renderer * Rename spent-time to wp-spent-time and fix highlight specifics [ci skip] * Actually load the project schema and make field editable * Make edit-field-group.component an edit-form.component and subclass EditForm * Remove edit context in favor of specialized EditForm * Add special cases for work package editing * Fix edit actions bar * Fix codeclimate issues * Use WorkPackageNotificationService if necessary * Override NotificationService for WPs to allow WP specififc notifications (WiP) * Correctly provide wpNotification service Because the ui-router doesn't seem to correctly use the parent element's injector, we need to provide the wpNotification service not in the wp-base, but rather the wp-list component as well as in the isolated query space. * Allow to filter halEvents for specific resourceTypes (e.g. WorkPackage) * Remove superfluous cell class constant * Start renaming selectors for wp-edit-field into generics * Remove wp-table--cell-span in favor of display field selector * Consolidate other display and edit field styles * Provide specialized service for transitions in active edit forms * Remove superfluous overflowSelector * Accept that date field contains some work package specifics * Ignore unreadable files * Provide the changeset for work packages as a hook Since hal resource editing service is provided per query space, we cannot register them once (would only work globally) * Fix dangerfile * Remove another todo in halResourceNotification service * Fix npm TestBed for changed dependencies * Show inplace edit field in project details widget * Fix highlighting in single view * Provide HalResourceEditingService outside of project context * Used typedState for single-view * Also provide wpNotification service in split view * Correct check for resource type in eventsService * Fix getSchemaName in display field renderer * Fix passing ids into `halEditing.stopEditing` * Do not globally inject the halResourceEditingService There's a bug(?) in ui-router that gives you the global service before the parent injected service for a ui-view * Fix wpCreate service on copying and parallel creation * Remove test project widget * Revert changes for project details widget
5 years ago
<div class="inline-edit--container">
[32880] Display scheduling mode in work package view (full, split & table) (#8410) * Show icon next to start date depending on the scheduling mode * Show modal when opening date edit fields which shall be able to change the dates and the scheduling mode * Introduce flatpickr as a datepicker for the modal of the dateEditField * Use new datepicker within opDatePickerComponent * Reuse existing Datepicker class for better code abstraction * Set dates only when Instance is ready * Let augmentedDatePicker use generic DatePicker class, too. * Remove jQuery UI datepicker specific styles as they do not apply any more. * Use localized strings in new datepicker * Close datepicker only on click outside * Allow single and multi selection of dates and save changes * Update schedulingMode button correctly && remove unused method * Show combined field for start and end date within the WP single view * Show normal datepicker for most date fields and the modal with the extended datepicker only for startDate * Add datepicker edit field and component helper * Correctly save start and end date * Show correct default value for dateEditFields && Adapt some tests to new datepicker and combined date field * Fix date editor spec * Fix expecting datepicker for start/due date as milestone * Prevent overflow on body by using modal-portal class && make edit input for combinedDates visible again to show something in a create form * Only output one debounced change event for op datepicker * Show combined datepickerModal for dueDate in table, too && save correct scheduling value * Hide modal if the showing component gets destroyed * Correctly check for closed datepicker * Add spec for toggling scheduling mode * Fix setting dates to modal * Avoid too many (unnecessary) close events and use keydown instead * Fix date setting and add custom field date spec * Change layout of combined date picker modal * Switch from a range date picker to a multiple selection in order to be able to set only start or due date && Highlight date field that is changed next * Highlight range manually * Highlight dueDate initially when the user clicked on the due date field && handle special case that one of the values is not set yet. In this case we don't want to keep both values but only the newly clicked. * Move helper functions to own class && Improve the range selection to be able highlight ranges over multiple months && Prevent that a start date > due date can be chosen by setting minDate and maxDate * Adapt test to new way of changing the scheduling mode * Handle case that the user clicks on a already selected date and thus deselects it Co-authored-by: Oliver Günther <mail@oliverguenther.de>
4 years ago
<span class="inline-edit--display-field inline-edit--display-field inplace-edit -editable" title="12/06/2018 - no end date">12/06/2018 - no end date</span>
</div>
</div>
<div class="attributes-key-value--key">Priority</div>
<div class="attributes-key-value--value-container">
[31023] Preparation for project edit fields: Generalize edit and display fields currently work package specific (#7726) * Check edit fields for Work package dependencies * Make EditForm, NotificationService, EditContext indepenedent of Work Packages * Make EventsService independent of WorkPackages * Start renaming WpNotificationService (WiP) * Fix more references * Fix typescript errors * Add basic halEditingService * Rename to global halResourceEditingService (WiP) * Move typing from class to methods (WiP) * Fix typescript errors * Remove space in type * Add test project widget && generalize the editFieldGroup * Rename editing portal service [ci skip] * Rename WpEditFieldComponent * Rename WpDisplayFields * Rename display-XX-field to XX-display-field [ci skip] * Add WP specific ID field to distinguish between resources * Re-add state in work package resource * Generalize display field renderer * Rename spent-time to wp-spent-time and fix highlight specifics [ci skip] * Actually load the project schema and make field editable * Make edit-field-group.component an edit-form.component and subclass EditForm * Remove edit context in favor of specialized EditForm * Add special cases for work package editing * Fix edit actions bar * Fix codeclimate issues * Use WorkPackageNotificationService if necessary * Override NotificationService for WPs to allow WP specififc notifications (WiP) * Correctly provide wpNotification service Because the ui-router doesn't seem to correctly use the parent element's injector, we need to provide the wpNotification service not in the wp-base, but rather the wp-list component as well as in the isolated query space. * Allow to filter halEvents for specific resourceTypes (e.g. WorkPackage) * Remove superfluous cell class constant * Start renaming selectors for wp-edit-field into generics * Remove wp-table--cell-span in favor of display field selector * Consolidate other display and edit field styles * Provide specialized service for transitions in active edit forms * Remove superfluous overflowSelector * Accept that date field contains some work package specifics * Ignore unreadable files * Provide the changeset for work packages as a hook Since hal resource editing service is provided per query space, we cannot register them once (would only work globally) * Fix dangerfile * Remove another todo in halResourceNotification service * Fix npm TestBed for changed dependencies * Show inplace edit field in project details widget * Fix highlighting in single view * Provide HalResourceEditingService outside of project context * Used typedState for single-view * Also provide wpNotification service in split view * Correct check for resource type in eventsService * Fix getSchemaName in display field renderer * Fix passing ids into `halEditing.stopEditing` * Do not globally inject the halResourceEditingService There's a bug(?) in ui-router that gives you the global service before the parent injected service for a ui-view * Fix wpCreate service on copying and parallel creation * Remove test project widget * Revert changes for project details widget
5 years ago
<div class="inline-edit--container">
<span class="inline-edit--display-field inline-edit--display-field inplace-edit -editable" title="Normal">Normal</span>
</div>
</div>
</div>
</div>
```
## Attribute Lists with Toggler
```
<div class="attributes-group">
<div class="attributes-group--header">
<div class="attributes-group--header-container">
<h3 class="attributes-group--header-text">Related To</h3>
</div>
<div class="attributes-group--header-toggle">
<a href="#" class="button -small -transparent -with-icon icon-group-by icon-small">Group by work package type</a>
</div>
</div>
<div class="content">
<wp-relation-row>
<div class="relation-row">
<div class="grid-block">
<div class="grid-content collapse">
<span class="relation-row--type">
<span>Task</span>
</span>
</div>
<div class="grid-content collapse">
<a href="">Task: Fix bug (#34)</a>
</div>
<div class="grid-content collapse">
[31023] Preparation for project edit fields: Generalize edit and display fields currently work package specific (#7726) * Check edit fields for Work package dependencies * Make EditForm, NotificationService, EditContext indepenedent of Work Packages * Make EventsService independent of WorkPackages * Start renaming WpNotificationService (WiP) * Fix more references * Fix typescript errors * Add basic halEditingService * Rename to global halResourceEditingService (WiP) * Move typing from class to methods (WiP) * Fix typescript errors * Remove space in type * Add test project widget && generalize the editFieldGroup * Rename editing portal service [ci skip] * Rename WpEditFieldComponent * Rename WpDisplayFields * Rename display-XX-field to XX-display-field [ci skip] * Add WP specific ID field to distinguish between resources * Re-add state in work package resource * Generalize display field renderer * Rename spent-time to wp-spent-time and fix highlight specifics [ci skip] * Actually load the project schema and make field editable * Make edit-field-group.component an edit-form.component and subclass EditForm * Remove edit context in favor of specialized EditForm * Add special cases for work package editing * Fix edit actions bar * Fix codeclimate issues * Use WorkPackageNotificationService if necessary * Override NotificationService for WPs to allow WP specififc notifications (WiP) * Correctly provide wpNotification service Because the ui-router doesn't seem to correctly use the parent element's injector, we need to provide the wpNotification service not in the wp-base, but rather the wp-list component as well as in the isolated query space. * Allow to filter halEvents for specific resourceTypes (e.g. WorkPackage) * Remove superfluous cell class constant * Start renaming selectors for wp-edit-field into generics * Remove wp-table--cell-span in favor of display field selector * Consolidate other display and edit field styles * Provide specialized service for transitions in active edit forms * Remove superfluous overflowSelector * Accept that date field contains some work package specifics * Ignore unreadable files * Provide the changeset for work packages as a hook Since hal resource editing service is provided per query space, we cannot register them once (would only work globally) * Fix dangerfile * Remove another todo in halResourceNotification service * Fix npm TestBed for changed dependencies * Show inplace edit field in project details widget * Fix highlighting in single view * Provide HalResourceEditingService outside of project context * Used typedState for single-view * Also provide wpNotification service in split view * Correct check for resource type in eventsService * Fix getSchemaName in display field renderer * Fix passing ids into `halEditing.stopEditing` * Do not globally inject the halResourceEditingService There's a bug(?) in ui-router that gives you the global service before the parent injected service for a ui-view * Fix wpCreate service on copying and parallel creation * Remove test project widget * Revert changes for project details widget
5 years ago
<span class="inline-edit--display-field inplace-edit -editable" title="new">new</span>
</div>
<div class="grid-content collapse wp-relations-controls-section">
<a href="" title="Set or update description of this relation">
<i class="icon-info1 -padded wp-relations--icon"></i>
</a>
<a href="" title="Remove relation">
<i class="icon-remove -padded wp-relations--icon"></i>
</a>
</div>
</div>
</div>
</wp-relation-row>
</div>
</div>
```
## with Single Attribute
```
<div class="attributes-group">
<div class="attributes-group--header">
<div class="attributes-group--header-container">
<h3 class="attributes-group--header-text">Description</h3>
</div>
</div>
<div class="single-attribute wiki-text">
<h2>Capítulo uno</h2>
<p>En un lugar <em>de la Mancha</em>, de cuyo nombre no quiero acordarme,
no ha mucho tiempo que vivía un hidalgo de los de lanza en astillero,
adarga antigua, rocín flaco y galgo corredor. Una olla de algo más vaca que
carnero, salpicón las más noches, duelos y quebrantos los sábados, lantejas
los viernes, algún palomino de añadidura los domingos, consumían las tres
partes de su hacienda. El resto della concluían sayo de velarte, calzas de
velludo para las fiestas, con sus pantuflos de lo mesmo, y los días de
entresemana se honraba con su vellorí de lo <strong>más fino</strong>.</p>
</div>
</div>
```