Project:
| View Issue Details[ Jump to Notes ] | [ Issue History ] [ Print ] | |||||||
| ID | ||||||||
| 0057163 | ||||||||
| Type | Category | Severity | Reproducibility | Date Submitted | Last Update | |||
| feature request | [POS2] Core | minor | always | 2024-11-18 17:54 | 2024-11-21 13:45 | |||
| Reporter | dbaz | View Status | public | |||||
| Assigned To | dbaz | |||||||
| Priority | high | Resolution | fixed | Fixed in Version | 25Q1 | |||
| Status | closed | Fix in branch | Fixed in SCM revision | |||||
| Projection | none | ETA | none | Target Version | ||||
| OS | Any | Database | Any | Java version | ||||
| OS Version | Database version | Ant version | ||||||
| Product Version | SCM revision | |||||||
| Review Assigned To | ||||||||
| Regression level | ||||||||
| Regression date | ||||||||
| Regression introduced in release | ||||||||
| Regression introduced by commit | ||||||||
| Triggers an Emergency Pack | No | |||||||
| Summary | 0057163: Add Component-Level Variables for Text Inputs, Comboboxes, and Selectors | |||||||
| Description | Summary: Currently, Openbravo's variable system supports two levels of variables: primitive and semantic, both in design (Figma) and code (CSS). However, component-level variables are not available. This limitation increases complexity in adopting the new design system and creating custom skins. We propose adding component-level variables for text inputs, comboboxes, and selectors as a first step to simplify these processes. Background: In modern design systems, there are typically three levels of variables: Primitive variables: Define base values such as colors, typography, and spacing (e.g., --obc2-green100, …). Semantic variables: Add meaning to primitives by linking them to a specific context (e.g., --obc2-color-primary, --obc2-shape-border-width). Component variables: Tailored to specific UI components, allowing granular customization at the component level (e.g., --obc2-textfield-border-width). While Openbravo has semantic variables in place, the absence of component-level variables creates challenges in: Streamlining Design System Adoption: Component-specific variables reduce the dependency on hardcoded styles, making it easier for developers to align with the design system. Skin Creation: Custom skins often require component-specific overrides, which are currently cumbersome without dedicated component variables. Proposal: Introduce component-level variables to Openbravo's variable system, starting with the following components: Text Inputs Comboboxes Selectors Each component will have its own set of configurable variables for aspects such as borders, backgrounds, sizes, and more. For example: --obc2-textfield-background-color --obc2-textfield-icon-color --obc2-textfield-trailingicon-width Benefits: Simplified Adoption of the New Design System (Orisha): Developers and designers will have a consistent way to define styles specific to each component. Improved Skin Customization: Component variables make it easier to create and manage custom themes without affecting other components or relying heavily on semantic/primitive variables. Future Scalability: Introducing component-level variables now establishes a strong foundation for expanding to other UI components in the future. Conclusion: Adding component-level variables is a critical step towards enhancing the flexibility and scalability of Openbravo’s / Orisha’s design system. It will simplify both the design and implementation processes, making the platform more robust and user-friendly for developers, designers, and end-users. | |||||||
| Steps To Reproduce | . | |||||||
| Tags | No tags attached. | |||||||
| Attached Files | ||||||||
 Relationships [ Relation Graph ]
[ Dependency Graph ]
|
|
 Relationships |
|
Notes |
|
|
(0172191) dbaz (developer) 2024-11-18 17:55 |
https://openbravo.atlassian.net/browse/RM-19210 [^] |
|
(0172194) hgbot (developer) 2024-11-18 18:52 |
Merge Request created: https://gitlab.com/openbravo/product/pmods/org.openbravo.core2/-/merge_requests/1648 [^] |
|
(0172195) hgbot (developer) 2024-11-18 18:55 |
Merge Request created: https://gitlab.com/openbravo/product/pmods/org.openbravo.pos2/-/merge_requests/3110 [^] |
|
(0172196) hgbot (developer) 2024-11-18 18:58 |
Merge Request created: https://gitlab.com/openbravo/product/pmods/org.openbravo.pos2.selfcheckout/-/merge_requests/117 [^] |
|
(0172197) hgbot (developer) 2024-11-18 19:01 |
Merge Request created: https://gitlab.com/openbravo/product/pmods/org.openbravo.pos2.product.label.printing/-/merge_requests/90 [^] |
|
(0172198) hgbot (developer) 2024-11-18 19:04 |
Merge Request created: https://gitlab.com/openbravo/product/pmods/org.openbravo.retail.camerabarcodescanner/-/merge_requests/20 [^] |
|
(0172199) hgbot (developer) 2024-11-18 19:06 |
Merge Request created: https://gitlab.com/openbravo/product/pmods/org.openbravo.ssms/-/merge_requests/350 [^] |
|
(0172402) hgbot (developer) 2024-11-21 13:45 |
Merge request merged: https://gitlab.com/openbravo/product/pmods/org.openbravo.core2/-/merge_requests/1648 [^] |
|
(0172403) hgbot (developer) 2024-11-21 13:45 |
Directly closing issue as related merge request is already approved. Repository: https://gitlab.com/openbravo/product/pmods/org.openbravo.core2 [^] Changeset: 43ab9f23b1e237d47d42c95ea15d30033e72ab57 Author: David Baz <d.baz@orisha.com> Date: 21-11-2024 12:45:06 URL: https://gitlab.com/openbravo/product/pmods/org.openbravo.core2/-/commit/43ab9f23b1e237d47d42c95ea15d30033e72ab57 [^] Fixed ISSUE-57163: Added text field component CSS variables --- A web-jspack/org.openbravo.core2/src/assets/style/component.scss M web-jspack/org.openbravo.core2/src/assets/style/color.scss M web-jspack/org.openbravo.core2/src/assets/style/main.scss M web-jspack/org.openbravo.core2/src/components/AutocompleteFormInput/AutocompleteFormInput.scss M web-jspack/org.openbravo.core2/src/components/BaseChip/BaseChip.scss M web-jspack/org.openbravo.core2/src/components/BaseFormDatePicker/BaseFormDatePicker.jsx M web-jspack/org.openbravo.core2/src/components/BaseFormDatePicker/BaseFormDatePicker.scss M web-jspack/org.openbravo.core2/src/components/BaseFormInput/BaseFormInput.scss M web-jspack/org.openbravo.core2/src/components/BaseFormMultiSelector/BaseFormMultiSelector.scss M web-jspack/org.openbravo.core2/src/components/BaseFormSelector/BaseFormSelector.scss M web-jspack/org.openbravo.core2/src/components/BaseFormTimePicker/BaseFormTimePicker.jsx M web-jspack/org.openbravo.core2/src/components/BaseFormTimePicker/BaseFormTimePicker.scss M web-jspack/org.openbravo.core2/src/components/ComboBox/ComboBox.scss M web-jspack/org.openbravo.core2/src/components/InputPassword/InputPassword.scss M web-jspack/org.openbravo.core2/src/components/Search/AvailableFilterPopover/AvailableFilterPopover.scss M web-jspack/org.openbravo.core2/src/components/Search/SearchInput/SearchInput.scss --- |
|
(0172404) hgbot (developer) 2024-11-21 13:45 |
Directly closing issue as related merge request is already approved. Repository: https://gitlab.com/openbravo/product/pmods/org.openbravo.pos2 [^] Changeset: c0f3754e9da8162d80335153d3001fdd9d71933d Author: David Baz <d.baz@orisha.com> Date: 21-11-2024 12:45:27 URL: https://gitlab.com/openbravo/product/pmods/org.openbravo.pos2/-/commit/c0f3754e9da8162d80335153d3001fdd9d71933d [^] Fixed ISSUE-57163: Added text field component CSS variables --- M web-jspack/org.openbravo.pos2/src/components/Cashup/CountingToolDialog/CountingToolDialog.scss M web-jspack/org.openbravo.pos2/src/components/KeyMapEditor/steps/KeyMapEditorKeymapsGrid/KeyMapEditorKeymapsGrid.scss M web-jspack/org.openbravo.pos2/src/components/ProductScan/ProductScanButtonBar/ProductScanButtonBar.scss M web-jspack/org.openbravo.pos2/src/components/ReceiptDeliveryOptions/BookedReceiptDeliveryOptions/BookedReceiptDeliveryGiftReceiptLineSelector/BookedReceiptDeliveryGiftReceiptLineSelectorGrid/BookedReceiptDeliveryGiftReceiptLineSelectorGrid.scss M web-jspack/org.openbravo.pos2/src/components/Ticket/TicketPropertiesPopover/TicketPropertiesPopover.scss M web-jspack/org.openbravo.pos2/src/components/VerifiedReturns/VerifiedReturnsGrid/VerifiedReturnsGrid.scss --- |
|
(0172405) hgbot (developer) 2024-11-21 13:45 |
Merge request merged: https://gitlab.com/openbravo/product/pmods/org.openbravo.pos2/-/merge_requests/3110 [^] |
|
(0172406) hgbot (developer) 2024-11-21 13:45 |
Directly closing issue as related merge request is already approved. Repository: https://gitlab.com/openbravo/product/pmods/org.openbravo.pos2.selfcheckout [^] Changeset: a6ebd5c48bcdbef2a30bc0e3176c666487b62bed Author: David Baz Fayos <david.baz@openbravo.com> Date: 21-11-2024 12:44:15 URL: https://gitlab.com/openbravo/product/pmods/org.openbravo.pos2.selfcheckout/-/commit/a6ebd5c48bcdbef2a30bc0e3176c666487b62bed [^] Fixed ISSUE-57163: Added text field component CSS variables --- M web-jspack/org.openbravo.pos2.selfcheckout/src/components/EnterCodeManuallyPopup/EnterCodeManuallyPopup.scss --- |
|
(0172407) hgbot (developer) 2024-11-21 13:45 |
Merge request merged: https://gitlab.com/openbravo/product/pmods/org.openbravo.pos2.selfcheckout/-/merge_requests/117 [^] |
|
(0172408) hgbot (developer) 2024-11-21 13:45 |
Directly closing issue as related merge request is already approved. Repository: https://gitlab.com/openbravo/product/pmods/org.openbravo.pos2.product.label.printing [^] Changeset: c8271242be9d56de37b482162490bdd6fba80dae Author: David Baz Fayos <david.baz@openbravo.com> Date: 18-11-2024 19:00:33 URL: https://gitlab.com/openbravo/product/pmods/org.openbravo.pos2.product.label.printing/-/commit/c8271242be9d56de37b482162490bdd6fba80dae [^] Fixed ISSUE-57163: Added text field component CSS variables --- M web-jspack/org.openbravo.pos2.product.label.printing/src/components/PrintProductLabel/PrintProductLabelProcess.scss M web-jspack/org.openbravo.pos2.product.label.printing/src/components/PrintProductLabel/PrintProductLabelSelectProdStep/PrintProductLabelSelectProdFilters/PrintProductLabelSelectProdFilters.scss --- |
|
(0172409) hgbot (developer) 2024-11-21 13:45 |
Merge request merged: https://gitlab.com/openbravo/product/pmods/org.openbravo.pos2.product.label.printing/-/merge_requests/90 [^] |
|
(0172410) hgbot (developer) 2024-11-21 13:45 |
Directly closing issue as related merge request is already approved. Repository: https://gitlab.com/openbravo/product/pmods/org.openbravo.retail.camerabarcodescanner [^] Changeset: 235dc14dd59606d4077644ee29b60404c6c403ae Author: David Baz Fayos <david.baz@openbravo.com> Date: 18-11-2024 19:03:53 URL: https://gitlab.com/openbravo/product/pmods/org.openbravo.retail.camerabarcodescanner/-/commit/235dc14dd59606d4077644ee29b60404c6c403ae [^] Fixed ISSUE-57163: Added text field component CSS variables --- M web-jspack/org.openbravo.retail.camerabarcodescanner/src/components/CameraBarcodeCodeToInput/CameraBarcodeCodeToInput.scss --- |
|
(0172411) hgbot (developer) 2024-11-21 13:45 |
Merge request merged: https://gitlab.com/openbravo/product/pmods/org.openbravo.retail.camerabarcodescanner/-/merge_requests/20 [^] |
|
(0172412) hgbot (developer) 2024-11-21 13:45 |
Merge request merged: https://gitlab.com/openbravo/product/pmods/org.openbravo.ssms/-/merge_requests/350 [^] |
|
(0172413) hgbot (developer) 2024-11-21 13:45 |
Directly closing issue as related merge request is already approved. Repository: https://gitlab.com/openbravo/product/pmods/org.openbravo.ssms [^] Changeset: 59f61f22864d958e660e703819ef3e3e37497a59 Author: David Baz Fayos <david.baz@openbravo.com> Date: 21-11-2024 12:44:23 URL: https://gitlab.com/openbravo/product/pmods/org.openbravo.ssms/-/commit/59f61f22864d958e660e703819ef3e3e37497a59 [^] Fixed ISSUE-57163: Added text field component CSS variables --- M web-jspack/org.openbravo.ssms/src/components/CommonComponents/SSMSSearchBar/SSMSSearchBar.scss --- |
|
Notes |
|
Issue History |
|||
| Date Modified | Username | Field | Change |
| 2024-11-18 17:54 | dbaz | New Issue | |
| 2024-11-18 17:54 | dbaz | Assigned To | => Triage Platform Base |
| 2024-11-18 17:54 | dbaz | Triggers an Emergency Pack | => No |
| 2024-11-18 17:54 | dbaz | Assigned To | Triage Platform Base => dbaz |
| 2024-11-18 17:55 | dbaz | Note Added: 0172191 | |
| 2024-11-18 18:52 | hgbot | Note Added: 0172194 | |
| 2024-11-18 18:55 | hgbot | Note Added: 0172195 | |
| 2024-11-18 18:58 | hgbot | Note Added: 0172196 | |
| 2024-11-18 19:01 | hgbot | Note Added: 0172197 | |
| 2024-11-18 19:04 | hgbot | Note Added: 0172198 | |
| 2024-11-18 19:06 | hgbot | Note Added: 0172199 | |
| 2024-11-21 13:45 | hgbot | Note Added: 0172402 | |
| 2024-11-21 13:45 | hgbot | Resolution | open => fixed |
| 2024-11-21 13:45 | hgbot | Status | new => closed |
| 2024-11-21 13:45 | hgbot | Fixed in Version | => 25Q1 |
| 2024-11-21 13:45 | hgbot | Note Added: 0172403 | |
| 2024-11-21 13:45 | hgbot | Note Added: 0172404 | |
| 2024-11-21 13:45 | hgbot | Note Added: 0172405 | |
| 2024-11-21 13:45 | hgbot | Note Added: 0172406 | |
| 2024-11-21 13:45 | hgbot | Note Added: 0172407 | |
| 2024-11-21 13:45 | hgbot | Note Added: 0172408 | |
| 2024-11-21 13:45 | hgbot | Note Added: 0172409 | |
| 2024-11-21 13:45 | hgbot | Note Added: 0172410 | |
| 2024-11-21 13:45 | hgbot | Note Added: 0172411 | |
| 2024-11-21 13:45 | hgbot | Note Added: 0172412 | |
| 2024-11-21 13:45 | hgbot | Note Added: 0172413 | |
|
Issue History |
| Copyright © 2000 - 2009 MantisBT Group |
 |