[hard-reset] teak.3 + design tokens

[jignaciopm]

Description

This pull request primarily updates the codebase to align with the latest Paragon design system variables and dependencies. The most significant changes include migrating SCSS variable usage to CSS custom properties, updating various dependencies, and making minor configuration improvements.

Design System and SCSS Variable Migration:

• Replaced SCSS variables (e.g., $black, $gray-700, $font-weight-bold) with Paragon CSS custom properties (e.g., var(--pgn-color-black), var(--pgn-color-gray-700), var(--pgn-typography-font-weight-bold)) throughout SCSS files, ensuring consistency with the latest Paragon theming and improved maintainability. [1] [2] [3] [4] [5] [6] [7] [8] [9] [10] [11] [12] [13] [14] [15] [16] [17] [18] [19] [20] [21] [22] [23]

• Updated import paths for Paragon utilities in SCSS, switching to the new recommended import (@openedx/paragon/styles/scss/core/utilities-only).

Dependency and Package Updates:

• Upgraded several frontend dependencies to their latest versions, including @openedx/paragon, @openedx/frontend-build, @edx/frontend-platform, @edx/frontend-component-footer, react-select, uuid, and yup, to ensure compatibility and receive the latest features and bug fixes. [1] [2] [3] [4]

• Updated the i18n_extract npm script to include the plugins directory and made minor adjustments to the dependencies list in package.json (e.g., reordering, version bumps, and removals). [1] [2] [3]

Configuration Improvements:

• Added or updated the PARAGON_THEME_URLS environment variable in .env, .env.development, and .env.test files, providing a fallback for local style files and supporting Paragon theming. [1] [2] [3]

Supporting information

Link to other information about the change, such as GitHub issues, or Discourse discussions.
Be sure to check they are publicly readable, or if not, repeat the information here.

Testing instructions

Please provide detailed step-by-step instructions for manually testing this change.

Other information

Include anything else that will help reviewers and consumers understand the change.

• Does this change depend on other changes elsewhere?
• Any special concerns or limitations? For example: deprecations, migrations, security, or accessibility.

Best Practices Checklist

We're trying to move away from some deprecated patterns in this codebase. Please
check if your PR meets these recommendations before asking for a review:

• Any new files are using TypeScript (.ts, .tsx).
• Avoid propTypes and defaultProps in any new or modified code.
• Tests should use the helpers in src/testUtils.tsx (specifically initializeMocks)
• Do not add new fields to the Redux state/store. Use React Context to share state among multiple components.
• Use React Query to load data from REST APIs. See any apiHooks.ts in this repo for examples.
• All new i18n messages in messages.ts files have a description for translators to use.
• Avoid using ../ in import paths. To import from parent folders, use @src, e.g. import { initializeMocks } from '@src/testUtils'; instead of from '../../../../testUtils'