summaryrefslogtreecommitdiff
path: root/src/assets/styles
AgeCommit message (Collapse)AuthorFilesLines
2026-03-05Implemented styling changesVedangi Mittal15-508/+680
- Implemented styling changes to restore UI appearance, behavior, margins, and sizing consistent with Vue 2. - Fixed broken styling across the search bar, filters, buttons, pagination, app navigation, cards, badges, and toast messages. Change-Id: If4aa37635136d94ebd3ad0a7533260bd788c2436 Signed-off-by: Vedangi Mittal <vedangimittal3004@gmail.com>
2026-02-24Implement Bootstrap 5 confirm modal dialogJason Westover1-0/+16
Replace window.confirm() shim with proper Bootstrap 5 modal using b-modal component from bootstrap-vue-next. This provides a consistent, themeable dialog experience matching the Vue 2 $bvModal.msgBoxConfirm() appearance across the application. Key changes: - ConfirmModal.vue: Full BS5 modal with request queue, ESC key support, optional processing state, and proper cleanup in beforeUnmount - All original Bootstrap 4 parameters preserved for consistent behavior The modal supports: - Multiple simultaneous confirm requests via queue - Custom titles and button text with i18n integration - Multi-line message support: `messageLines` - Variant styling (primary default, danger, secondary) - Auto-focus control for safer UX on destructive actions - Full theme customization via CSS variables - Modal positioned at top (not centered) matching Vue 2 behavior - No header close button for controlled dismiss behavior - Optional checkbox confirmation via confirmationText parameter Keyboard and focus enhancements: - Auto-focus configurable button when modal opens (cancel by default) - ESC key cancels dialog - $confirm() accepts optional second parameter for extra options - Added aria properties and removed unused refs Files using dialogs to test: - Logs: Dumps, EventLogs, PostCodeLogs - Operations: ServerPowerOperations - Security: Sessions, Certificates, Ldap, UserManagement - Settings: Network (IPv4/IPv6), SnmpAlerts Testing: - Manually tested most confirmation dialogs across the application - Verified keyboard-only interaction from Dumps page delete dialog Change-Id: I03fed8d79f40f47b43bc4b2c788396cf183b3e99 Signed-off-by: Jason Westover <jwestover@nvidia.com>
2026-01-20Migrate build system from Vue-CLI to ViteJason Westover3-35/+35
"Vue CLI is in Maintenance Mode!" https://cli.vuejs.org/ Vite is created by Vue's creator and is the recommended build tool for Vue 3. It supports most of the configured conventions in Vue CLI. Dev Server startup is 60X faster and HMR is noticeably faster ~50ms. Better Tree-shaking support and modern ESM support. This migration preserves all existing functionality while eliminating Vue 2 legacy dependencies. Build Output Comparison (gzipped): Master (Webpack) Vite Delta CSS: 39 KB 45 KB +6 KB (+15%) JS: 505 KB 483 KB -22 KB (-4.4%) Total dist: 556 KB 544 KB -12 KB (-2.2%) Build time: ~29s ~7s ~4x faster Build System Changes: - Replace vue.config.js with vite.config.js - Remove babel.config.js (Vite uses esbuild) - Remove postcss.config.js (Vite handles PostCSS internally) - Add index.html to project root with ESM module entry point - Add custom Vite plugin for directory import resolution - Rename .eslintrc.js to .eslintrc.cjs (ESM compatibility) Dependency Updates: - Remove @vue/cli-* packages and webpack-related dependencies - Add vite, @vitejs/plugin-vue, @vitejs/plugin-basic-ssl - Add vite-svg-loader, vite-plugin-compression - Upgrade Bootstrap to 5.3.8 - Upgrade Sass to 1.97.2 (supports quietDeps option) - Upgrade xterm to @xterm/xterm v6 (new package name) - Upgrade xterm-addon-* to @xterm/addon-* packages - Upgrade vue-i18n to v11 - Upgrade eslint to 8.57.1 - Upgrade axios-cache-interceptor to latest Environment Variable Migration: - Change VUE_APP_* prefix to VITE_* (Vite convention) - Replace process.env with import.meta.env in source files - Update .env.ibm, .env.intel example files - Update documentation with new variable names ESM Module Compatibility: - Replace require('@/eventBus') with ESM imports (~23 files) - Ensure event bus listeners are registered/unregistered with stable handler references to prevent leaks - Replace require.context with import.meta.glob in i18n.js - Convert SVG inline loader to vite-svg-loader component imports SCSS/Sass Updates: - Remove tilde (~) prefix from node_modules imports - Add silenceDeprecations and quietDeps for Bootstrap warnings - Fix color() function syntax for Sass 2.0 compatibility xterm.js v6 Migration: - Update imports to @xterm/xterm, @xterm/addon-attach, @xterm/addon-fit - Replace deprecated setOption() with constructor options - Add CSS fix for helper textarea visibility Dev Server: - Configure HTTPS with @vitejs/plugin-basic-ssl - Preserve proxy configuration for BMC backend - Add WebSocket proxy auth token forwarding for /console, /kvm, /vm - Configure HMR on separate WebSocket path (/ws_hmr) X-Auth-Token Persistence (opt-in): - Add VITE_STORE_SESSION env flag for non-cookie auth backends - Persist X-Auth-Token to session cookie when enabled - Enables direct browser navigation to Redfish endpoints Follow-on: CI/testing updates (unit test runner + run-ci alignment) Some Jest config changes skipped here since this follow-on commit switches to Vitest. follow-up change is here: https://gerrit.openbmc.org/c/openbmc/webui-vue/+/86511 Tested: Sanity tested most navigational screens in the default UI, including many different types of API calls. Tested most build options. Tested the new i18n:report and it is working correctly. Change-Id: Ie84d1ed6121ffe7d2ddb379084d833b8d5a6fccf Signed-off-by: Jason Westover <jwestover@nvidia.com>
2025-11-22Migrate to Bootstrap 5 and remove Vue compat pluginjason westover16-133/+287
Complete migration from Bootstrap 4 (bootstrap-vue) to Bootstrap 5 (bootstrap-vue-next) and remove the @vue/compat plugin to finalize the Vue 3 migration. Bundle size impact: - Before (Bootstrap 4 + bootstrap-vue): 535 KiB gzipped - After (Bootstrap 5 + bootstrap-vue-next): 511 KiB gzipped - Reduction: 24 KiB (4.5% smaller) Package updates: - Update bootstrap 4.6.2 -> 5.3.8 - Update bootstrap-vue 2.23.1 -> bootstrap-vue-next 0.40.8 - Remove @vue/compat plugin - Update vue 3.4.29 -> 3.5.24 and related packages - Add mitt 3.0.1 for global event bus - Add vue-demi 0.14.10 for library compatibility Bootstrap 5 CSS updates: - Replace directional classes: ml/mr/pl/pr -> ms/me/ps/pe - Replace text-left/right -> text-start/end - Replace sr-only -> visually-hidden / visually-hidden-focusable - Update media breakpoint xs -> sm (Bootstrap 5 removed xs) - Update color functions: gray("700") -> $gray-700 - Add form-switch border-radius for curved toggles - Update alert, table, toast, form, and button styles Bootstrap-Vue-Next API changes: - Use createBootstrap() for plugin registration - Update modal footer slots: #modal-footer -> #footer - Fix form select events: @change -> @update:model-value - Add v-model bindings to modals instead of manual show()/hide() - Update toast system with custom plugin wrapping useToast() - Register components and directives explicitly Vue 3 specific updates: - Replace $root.$emit with mitt event bus (eventBus.js) - Update render function from h(App) to createApp(App) - Add emits option to components - Use h() instead of $createElement in mixins - Add Vue 3 compile-time feature flags with documentation - Update event listeners: $on/$off to eventBus methods - Add beforeUnmount cleanup for event listeners New components and significant additions: - src/plugins/toast.js - Custom toast plugin wrapping useToast() for Options API compatibility - src/components/Global/ConfirmModal.vue - Global confirmation dialog shim to replace Bootstrap 4's removed bvModal.msgBoxConfirm - src/eventBus.js - mitt-based event bus with Vue 2-compatible API - Navigation state preservation on page refresh implemented Critical fixes: - Add global API interceptor to strip Vue reactivity from payloads - Preserve binary data (File, Blob, FormData) in API requests - Fix Generate CSR modal v-model binding for proper open/close - Remove debug logging and fix jest configuration - Fix responsive text visibility in AppHeader - Update BVTableSelectableMixin for proper row selection - Fix BVToastMixin VNode rendering for Vue 3 Vue 3 modal fixes (lazy-loaded components): - Add v-model support to network modals (ModalIpv4, ModalIpv6, ModalDns, ModalHostname, ModalMacAddress, ModalDefaultGateway) by adding modelValue prop, watcher on modelValue that triggers show(), and update:modelValue emit in resetForm - Remove lazy loading from TableIpv4, TableIpv6, TableDns to ensure modal component refs are available when v-model triggers - Fix modal title accessibility by adding title prop to modals (ModalAddDestination, ModalUser, ModalAddRoleGroup, etc.) i18n fixes (computed properties): - Fix computed properties using i18n translations in ModalAddRoleGroup, ModalUser, and ModalUploadCertificate - Move useI18n() call from data() to setup() and return i18n object - Use i18n.t() instead of $t in computed properties and templates - Prevents "this.$t is not a function" and "_ctx.$t is not a function" errors in Vue 3 Toast notification fixes: - Fix toast progress bar visibility by setting progressProps to undefined (documented way to opt-out) instead of false - Change modelValue prop to interval for auto-dismiss timing - Remove temporary CSS display:none hack from _toasts.scss Network settings fixes: - Fix checkbox @change event sending Vue reactive proxy object instead of boolean by casting with !! operator in changeDomainNameState and related methods in NetworkGlobalSettings.vue - Ensures API receives plain boolean values in PATCH requests Navigation fixes: - Fix nav-link styling for navigation items without children by replacing b-nav-item with router-link in AppNavigation.vue - Prevents blue font color from .nav-link CSS class Configuration updates: - Remove vue-compat webpack configuration - Add Vue 3 feature flags (__VUE_OPTIONS_API__, etc.) - Add .cursor to .gitignore Accessibility improvements: - Add autocomplete attributes to password and credential inputs - Add modal title props for screen reader support Build completes successfully and UI behavior matches pre-migration. Extracted features (to be submitted in follow-up PRs): The following features were removed from this migration PR to keep it focused on the Bootstrap 5 upgrade. They will be submitted separately: 1. UnresponsiveModal - Server connectivity watchdog with auto-retry 2. Auth token persistence - sessionStorage support for X-Auth-Token 3. Hardware store error handling - try/catch, dynamic discovery 4. Login page connecting indicator - Backend polling with spinner 5. Test updates - Jest setup and snapshot updates for Bootstrap-Vue-Next 6. Documentation updates - Vue 3 and Vue I18n v9+ API documentation 7. Enhanced ConfirmModal - Feature-rich confirmation dialog with custom actions Change-Id: Ib76a58f324b3c926cf536e6e4626e4271639de38 Signed-off-by: Jason Westover <jwestover@nvidia.com>
2025-03-26style: add Sass configuration for Vue 3suryav97243-8/+4
Configure sass in the vue.config.js file and remove the import of the scss file from each page. The styles are handled by the css loaderOptions in the config file. Every component and page has the appropriate style applied. The appearance adjusts to the openBmc webui in Vue 2. Change-Id: I3773c063646185b80b7bd61d05aa80a993cbd121 Signed-off-by: Surya Venkatesan <suryav@ami.com>
2024-10-03Upgrade vue3 and all dependenciesEd Tanous3-3/+9
Start the process of porting everything to Vue 3. I have most things working. npm run-scripts build works, npm install works. prettier passes. Styles load, login works, webui loads. This was primarily done using the linked documents below. It makes the following design decisions: 1. Vue is put in compat 2 mode, which allows most of the components to work as-is. 2. Bootstrap v4 is used along with bootstrap-vue to keep our components working. 3. Minor changes are made to load the latest versions of vue-router, vuex, and vue-i18n. I suspect this patchset is good enough to start with, and we can clean up the broken things one patchset at a time. The things that need to happen are: 1. Get remaining features working again. This primiarily is vue-i18n for mixins, and non vue components. This likely needs to be done by not pulling in i18n into the non vue components, then using the .Vue files to do the internationalization in the component context, NOT in the mixin context. Alternatively, we could drop MixIns alltogether. 2. Get custom styles working again. Previously, we used some path hackery in vue.config.js to optionally pre-load styles. This stops working now that we're required to @import our modules. Likely we need some rearangement of the paths such that custom styles are a complete replacement (possibly importing the original) rather than additive with overrides. That's a guess, but I don't really see anyone else doing customization the way we've defined it here. 3. Bootstrap 5 no longer requires ANY custom vue modules, as it has dropped the jquery dependency. We won't be able to pull in bootstrap 5 all at once, so pull in bootstrap 5 under an alias, like "bootstrap5" that we can optionally import 5 or 4. 4. One at a time, start porting components over to Vue3 syntax and bootstrap 5. This will be the bulk of the manual work and review. The only thing I think left is getting unit tests passing, which I commented out the pre-commit hook to make this PR. Tested: Code builds. Needs better testing. [1] https://router.vuejs.org/guide/migration/ [2] https://vue-i18n.intlify.dev/guide/migration/vue3 [3] https://vuelidate-next.netlify.app/migration_guide.html#package-name-and-imports Change-Id: I5bb3187b9efbf2e4ff63e57994bc528756e2a981 Signed-off-by: Ed Tanous <ed@tanous.net>
2021-06-29Add processors table missing propertiesSandeepa Singh3-0/+5
- Add following missing properties: Name, Spare part number, Model, Processor type, Processor architechure, Version, Health rollup, Asset tag, Min speed MHz, Max speed MHz, Total cores, Total threads, Instruction set, Identify Led - Design of the table has been updated - Waiting for the following to be merged to test the Identify Led: https://gerrit.openbmc-project.xyz/c/openbmc/bmcweb/+/37045 Signed-off-by: Sandeepa Singh <sandeepa.singh@ibm.com> Change-Id: If6eeb3b0afea6510f7ea53e2d66cbf1d123b3217
2021-06-29Increase the filter menu marginsSandeepa Singh1-1/+2
This will increase readability of filter menu options, by preventing the wrapping up of long options/labels. Signed-off-by: Sandeepa Singh <sandeepa.singh@ibm.com> Change-Id: I75199b7608b5aeed067530e374e45750e26bb6eb
2021-06-28Remove <br /> from hardware status tablesDixsie Wolmers1-2/+3
Break tags are not semantic for definition lists. Signed-off-by: Dixsie Wolmers <dixsie@ibm.com> Change-Id: I1ecbd7100044da4aa7749888faab962e115e2564
2021-02-25Update toast layout to align header elementsDerick Montague1-6/+15
Signed-off-by: Derick Montague <derick.montague@ibm.com> Change-Id: I2bedab786dc10ee3eb7366a20c6c7e4fb2157e3e
2021-01-08Fix input icon being hidden on input focusDerick Montague1-0/+1
Both the datepicker and password fields have an assoicated icon. When the input element receives focus the associated icons are hidden. This is caused by a z-index issue and was a bug created when fixing another bug that caused the datepicker icon from rendering above the table batch actions toolbar. Both bugs have been resolved with this patchset. Signed-off-by: Derick Montague <derick.montague@ibm.com> Change-Id: If923cd5bc6a076b01efa44492f717b78fb6584ca
2021-01-05Add DumpsStore API callsYoshie Muranaka1-1/+1
Ties in API requests to the Dumps page and adds ability to: - Create new System or BMC dump - Delete single or multiple BMC dumps. Uses ClearLog service to delete all and DELETE request for single dump deletion Signed-off-by: Yoshie Muranaka <yoshiemuranaka@gmail.com> Change-Id: Iae928fa3b8fab00e549c33c0ab914a4b04de0f40
2021-01-05Fix table date filter calendar icon issueSukanya Pandey1-1/+0
Signed-off-by: Sukanya Pandey <sukapan1@in.ibm.com> Change-Id: I3cbb66c56cd7824707107771b034317d95f96014
2020-12-01Fix pixelated toggle elementDerick Montague1-2/+2
On some screens, the toggle element is pixelated due to the border color. When looking at Bootstrap default styles, they use the same color for both the toggle element's background color and border color. This change resolves the pixelation issue and follows the same pattern as the Bootstrap component library. Signed-off-by: Derick Montague <derick.montague@ibm.com> Change-Id: I0fb356153f216c6a79ba57e5f38294871c63dc6a
2020-11-13Align button iconsDixsie Wolmers3-19/+30
- Fixes button icon and text alignment - App header buttons to be addressed separately - Button documentation will be addressed in separate commit - Aligns form input buttons: datepicker, clear search, and password toggle - Moves title from icon to button for icon only buttons - Aligns validation icon with form input buttons Signed-off-by: Dixsie Wolmers <dixsie@ibm.com> Change-Id: Ie28d7d7dd7303ab6bf1897d1fa569e1580cc2f9d
2020-10-27Fix table row alignment and table head borderDixsie Wolmers1-2/+11
- Aligns content in table rows with expand and action buttons - Adds border to table head Signed-off-by: Dixsie Wolmers <dixsie@ibm.com> Change-Id: I403575bedc78d71ad05edcae2f59f7df994d3630
2020-10-23Fixed event logs pagination on small screenSurenNeware1-1/+5
Signed-off-by: Suren Neware <sneware9@in.ibm.com> Change-Id: Ifb3963d416a7e2663af24c3c7b1d2c1876af6788
2020-10-23Add style to left sidebar and app headerSurenNeware1-2/+4
- Updated hover, active and focus state for left sidebar menu items. - Add style guide for top header navigation. - Add new white color logo. - Add focus and active state to current menu item. Signed-off-by: Suren Neware <sneware9@in.ibm.com> Change-Id: Ib97df4efda216f653ce0415c3f3ae9ae75bcb9cd
2020-10-07Add new style guide to global button styleSurenNeware4-48/+77
- Updated new style guide for Primary, Secondary and Link button variants - Changed box-shadow style from outer to inside on focus and active state - Updated font weight from bold to regular for normal buttons and font weight bold for link button. Signed-off-by: Suren Neware <sneware9@in.ibm.com> Change-Id: I38ca94baa9daec3fd03b830fc7b6d676fcce15b0
2020-10-07Add updated table stylesSukanya Pandey2-0/+18
- Refer below link for styles: https://ibm.invisionapp.com/share/D8O06PPE32B#/screens Signed-off-by: Sukanya Pandey <sukapan1@in.ibm.com> Change-Id: I6dcc3b8d0fb7ef19388b5bfeaf87fce78725b638
2020-10-06Add stacked table style for small screenSurenNeware1-0/+68
- Add style to the stacked table type for small screen only. Signed-off-by: Suren Neware <sneware9@in.ibm.com> Change-Id: I79fb44b20c8436df5734f89e60c98966c9c6a591
2020-10-05Add changes related to SOL pageSukanya Pandey2-0/+4
-Changes incorporated can be referred through below link: -https://github.com/openbmc/webui-vue/issues/25 Signed-off-by: Sukanya Pandey <sukapan1@in.ibm.com> Change-Id: I39d79259e0470d11c15e596908eefee7a799262a
2020-09-29Fix responsiveness of KVMMateusz Gapski2-0/+13
More info: https://github.com/openbmc/webui-vue/issues/24 Signed-off-by: Mateusz Gapski <mateuszx.gapski@intel.com> Change-Id: I150e7816ea08f462300566276ddbfc117e9f2e0c
2020-09-27Add icon to the toast componentSurenNeware1-1/+8
- Add status icon to the toast component. - Add a method that return title with associated icon. Signed-off-by: Suren Neware <sneware9@in.ibm.com> Change-Id: Iae75e3eec7317af6b25a0ed1bfa4cc72644f7cd7
2020-09-25Update toast drop-shadow opacityDixsie Wolmers2-1/+3
- Created sass variable for box shadow to be reused for elements requiring box-shadow - Update toast opacity to 0.3 Signed-off-by: Dixsie Wolmers <dixsie@ibm.com> Change-Id: Icfc0a58944fd5fe6d2c677e99564910fc2c67f1f
2020-09-16Update style of modal titleDixsie Wolmers1-1/+6
New style guide uses h4 style for modal title Signed-off-by: Dixsie Wolmers <dixsie@ibm.com> Change-Id: I440ff224b24de788086a33b5a0df7ad464d22096
2020-09-16Remove not needed scroll on sensor pageMateusz Gapski1-1/+6
Details: https://github.com/openbmc/webui-vue/issues/17 Signed-off-by: Mateusz Gapski <mateuszx.gapski@intel.com> Change-Id: I5c76219db954470dc72231e51ea0f202016d6816
2020-08-28Add Intel themeMateusz Gapski2-2/+5
Add Intel fonts, colours Signed-off-by: Mateusz Gapski <mateuszx.gapski@intel.com> Change-Id: Idbfa1422f2667515efb60e24f9a84b7d77d11fcd
2020-08-28Update checkboxes to match style guideDixsie Wolmers1-0/+16
- Changes focus, checked and hover state - Changes indeterminate checkbox style Signed-off-by: Dixsie Wolmers <dixsie@ibm.com> Change-Id: Ic15a1a64d226bc160feea62ff140f38c11c4cca3
2020-08-28Update table filter action button styleSurenNeware1-0/+13
- Update table filter action Clear all button style to Ghost button style. - Now in active state button text became visible. Signed-off-by: Suren Neware <sneware9@in.ibm.com> Change-Id: I3e56482ec9b96328a2460673af9937f30522376d
2020-08-18Add form input field validation iconsDixsie Wolmers1-0/+27
Updates form validation to match updated style guide: - Datepicker and password toggle form field padding adjusted to accomodate validation icons - Valid form validation icon is hidden - Adds carbon icons and enables validation icons in IBM environment Signed-off-by: Dixsie Wolmers <dixsie@ibm.com> Change-Id: I7edff1e9527ad2c2cfec236daacb83ad4864d785
2020-08-17Fix Sass build errorYoshie Muranaka1-1/+1
Replaced $success-light Sass variable with theme-color-light function. We removed the variable and forgot to update this partial. Signed-off-by: Yoshie Muranaka <yoshiemuranaka@gmail.com> Change-Id: If4422241cae10efdb0e17b31327465ee4d0a6dae
2020-08-17Update use of Sass variable background variant colorsYoshie Muranaka6-27/+17
The hardcoded Sass variable assignments to lighter variant background colors does not work well with the theme-color functions that are used. Use Bootstrap's built in theme-color-level function to programatically get a lighter variant color to use for component backgrounds. https://getbootstrap.com/docs/4.5/getting-started/theming/#functions Signed-off-by: Yoshie Muranaka <yoshiemuranaka@gmail.com> Change-Id: I9d5a1a66c92d347ba1797be5e0810a24c34094f9
2020-08-13Add Firmware pageYoshie Muranaka2-0/+6
Adds ability to upload a fimware image by local workstation or TFTP. Also adds ability to reboot BMC from the backup image. - Add route definition, component view, and store for Firmware page - Get ActiveSoftwareImage location at /redfish/v1/Managers/bmc - Get backup by checking for an image id that is not the same as the active image /redfish/v1/UpdateService/FirmwareInventory - Switch running firmware image by making PATCH request to /redfish/v1/Managers/bmc Signed-off-by: Yoshie Muranaka <yoshiemuranaka@gmail.com> Change-Id: I04450e5a170d374122908c4c0349ba3b6e93ed2c
2020-08-12Add info icon for informational alertSurenNeware1-1/+7
-Add new style carbon icon for informational alert -Change alert icon position from center to top Signed-off-by: Suren Neware <sneware9@in.ibm.com> Change-Id: If32d712db16472ce9a78e04e5871d0b799bb5895
2020-08-10Remove Sass color mapsYoshie Muranaka1-23/+0
Sass maps are not needed to create color or theme tokens. With Bootstrap's use of the !default flag, only unassigned variables will default to Bootstrap defined colors. Sass variable assignements are sufficient for overriding colors. https://sass-lang.com/documentation/variables#default-values Signed-off-by: Yoshie Muranaka <yoshiemuranaka@gmail.com> Change-Id: If69f712602d3c46747a68fd70319a20ef8002bd6
2020-07-30Delete _helpers.scss partialYoshie Muranaka1-3/+0
SFCs no longer require this _helpers partial since they are included by sass loader. Signed-off-by: Yoshie Muranaka <yoshiemuranaka@gmail.com> Change-Id: Ib6400085f05a195d0140691c69323dbb82e00fc3
2020-07-28Update form fields to match style guideDixsie Wolmers2-14/+62
Updates inputs, select, form field background color, validation text size, and field focus state. New styles have a darker form field background color. Form fields on dark backgrounds will remain white. Signed-off-by: Dixsie Wolmers <dixsie@ibm.com> Change-Id: Ifa14a57f764335b196b129e6614d7a1f1c27d7ad
2020-07-27Add ability to customize theme stylesYoshie Muranaka1-7/+0
Showcases how different themes/styles can be supported using .env variables. If an environemnt name is specified during the build process, an overrides file will be pulled in to allow modifications to color and font definitions. This commit includes possible style modifications with the openpower env name as an example. To see the openpower changes, add the variable definition VUE_APP_NAME="openpower" to your .env.development.local file or build using 'npm run build -- --mode openpower' - Moves helper imports into vue config to allow for specific import order - Removed helper imports in SFCs Signed-off-by: Yoshie Muranaka <yoshiemuranaka@gmail.com> Change-Id: Iaf7a59c24fda06a7b74e23f2f042fb3300cb2056
2020-07-23Update global typographyDixsie Wolmers1-0/+43
Updated the following body, label, and heading styles to match new style guide: - Font sizes - Font weight - Line height - Color Signed-off-by: Dixsie Wolmers <dixsie@ibm.com> Change-Id: I014c968f6542b697fec8c3b9af781e64ac10794d
2020-07-21Update use of Sass variables for better themingYoshie Muranaka11-42/+40
Use Bootstrap color functions for theme-colors and grays instead of directly referencing Sass variable to allow more flexible theming. Signed-off-by: Yoshie Muranaka <yoshiemuranaka@gmail.com> Change-Id: Id08b77ff6df3bdf99400dcdfe964853706f1070f
2020-07-16Update gray color palette to match style guideDixsie Wolmers1-5/+5
Updated gray palette to match updated design guide - Color changes per page will be addressed in separate commits. Updated sytle guide documentation with new colors. Signed-off-by: Dixsie Wolmers <dixsie@ibm.com> Change-Id: Ic771d932ace38d3abbbf65038f00e25391db5dd0
2020-07-13Restructure Sass filesYoshie Muranaka23-27/+24
- Consolidate all bootstrap partials - Combine all vendor overrides with BMC custom styles - Updated paths for Vuepress docs Signed-off-by: Yoshie Muranaka <yoshiemuranaka@gmail.com> Change-Id: I1a9f68bdf90edae0d1e38f36ac670bf6426ec8a5
2020-07-08Codespell spelling fixesGunnar Mills1-4/+4
These spelling errors were found using https://github.com/codespell-project/codespell Change-Id: I8ec1e482a6eedca0f9c3b0282fa7db85cd4243f3 Signed-off-by: Gunnar Mills <gmills@us.ibm.com>
2020-06-17Profile settings pageSukanya Pandey1-4/+5
-To set the profile by setting password. -This commit adds a profile page which allows the user to change their password. In the future, the profile page will also contain user settings like language and timezone. The API called to change the user's password is '/redfish/v1/AccountService/Accounts/<userName>' Signed-off-by: Sukanya Pandey <sukapan1@in.ibm.com> Change-Id: Ie54a54beff8c85bc9ac5af21c35edc481b34cf44
2020-06-17Add Hardware status page and system tableYoshie Muranaka1-11/+52
Adds ability to see system information in table format with a row expansion details view. Modified tables styles to add table borders. Created global mixin for table data formatting: - Show '--' for undefined or empty string values - Map Redfish health status options to status-icon values Signed-off-by: Yoshie Muranaka <yoshiemuranaka@gmail.com> Change-Id: I5b45c37997647f5a265c1e84eb53f0b51699ee20
2020-06-13Add date filter on Event logs pageYoshie Muranaka3-0/+10
Created global TableDateFilter component that uses the BootstrapVue Datepicker with a native text input. This will allow users to manually enter a date in ISO format or use the Bootstrap calendar dropdown. Storing language preference from Login to use locale prop on BootstrapVue Datepicker component. Signed-off-by: Yoshie Muranaka <yoshiemuranaka@gmail.com> Change-Id: I66de9fb04451572c9a90f90d8522934b6204aed2
2020-06-10Add pagination to Event Log tableYoshie Muranaka2-0/+21
Created BvPaginationMixin for shared pagination values and methods. Chose to use exising BoostrapVue components as-is instead of wrapping in a custom component since it would add unnecessary complexity. Signed-off-by: Yoshie Muranaka <yoshiemuranaka@gmail.com> Change-Id: I246d761d90db36efeb442b0ee1074b629d32edef
2020-06-02Update Bootstrap Pill consistencyDixsie Wolmers1-1/+3
Pills in multiple select component and table filter are set to both have a line-height of 1.5 Signed-off-by: Dixsie Wolmers <dixsie@ibm.com> Change-Id: I90685534e995211d7bdf5feb16698957a29ccc91
2020-05-15Add themes documentationDerick Montague1-3/+3
- Renamed all index.md to readme.md to make consuming the documentation from the Github repo easier. VuePress treats index.md and readme.md the same way when building the static pages. - Added theme section overview documentation - Added how to customize documentation - Added custom style imports to support OpenBMC Web UI component documentation to remove Bootstrap framework base styles that conflict with the Vuepress theme - Found occurrences of the word Sass in upper-case and changed to use sentence case. Signed-off-by: Derick Montague <derick.montague@ibm.com> Change-Id: If5588f88a3d75761cc47e85a3fb0a582b31d373c
generated by cgit v1.2.3 (git 2.39.0) at 2026-10-22 12:50:45 +0300