Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

perf: add support of css-variables to quince #6

Merged
merged 2 commits into from
May 2, 2024
+1,960 −905
Merged

perf: add support of css-variables to quince #6

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
2 commits
Select commit Hold shift + click to select a range
77e9a9a
perf: add support of css-variables to quince
bra-i-am Apr 29, 2024
acf6670
feat: upgrade react router to v6 (#174)
Syed-Ali-Abbas-Zaidi Oct 18, 2023
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
2,746 changes: 1,909 additions & 837 deletions package-lock.json
View file
Open in desktop

Large diffs are not rendered by default.

19 changes: 10 additions & 9 deletions package.json
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -15,7 +15,8 @@
"start": "fedx-scripts webpack-dev-server --progress",
"test": "TZ=GMT fedx-scripts jest --coverage --passWithNoTests",
"watch-tests": "jest --watch",
"prepare": "husky install"
"prepare": "husky install",
"replace-variables": "paragon replace-variables -p src -t usage"
},
"author": "edX",
"license": "AGPL-3.0",
Expand All @@ -25,10 +26,10 @@
},
"dependencies": {
"@edx/brand": "npm:@edx/brand-openedx@^1.2.0",
"@edx/frontend-component-footer": "12.2.1",
"@edx/frontend-component-header": "4.6.0",
"@edx/frontend-platform": "4.6.1",
"@edx/paragon": "^20.44.0",
"@edx/frontend-component-footer": "npm:@edunext/frontend-component-footer@12.2.1-alpha.2",
"@edx/frontend-component-header": "npm:@edunext/frontend-component-header@4.6.0-alpha.2",
"@edx/frontend-platform": "npm:@edunext/[email protected]",
"@edx/paragon": "npm:@openedx/[email protected]",
"@fortawesome/fontawesome-svg-core": "^1.2.36",
"@fortawesome/free-brands-svg-icons": "^5.15.4",
"@fortawesome/free-solid-svg-icons": "^5.15.4",
Expand Down Expand Up @@ -59,8 +60,8 @@
"react-intl": "^5.20.9",
"react-pdf": "^5.5.0",
"react-redux": "^7.2.9",
"react-router": "5.3.4",
"react-router-dom": "5.3.4",
"react-router": "6.15.0",
"react-router-dom": "6.15.0",
"react-router-redux": "^5.0.0-alpha.9",
"redux": "4.2.1",
"redux-beacon": "^2.1.0",
Expand All @@ -74,7 +75,7 @@
},
"devDependencies": {
"@edx/browserslist-config": "^1.2.0",
"@edx/frontend-build": "^12.7.0",
"@edx/frontend-build": "github:edunext/frontend-build#ednx-release/css-variables-13.0.1",
"@edx/reactifex": "^2.1.1",
"@testing-library/jest-dom": "^5.14.1",
"@testing-library/react": "12.1.5",
Expand All @@ -91,4 +92,4 @@
"redux-mock-store": "^1.5.4",
"semantic-release": "^19.0.3"
}
}
}
11 changes: 1 addition & 10 deletions src/App.scss
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,13 +1,4 @@
// frontend-app-*/src/index.scss
@import "~@edx/brand/paragon/fonts";
@import "~@edx/brand/paragon/variables";
@import "~@edx/paragon/scss/core/core";
@import "~@edx/brand/paragon/overrides";

$fa-font-path: "~font-awesome/fonts";
@import "~font-awesome/scss/font-awesome";

$input-focus-box-shadow: $input-box-shadow; // hack to get upgrade to paragon 4.0.0 to work
$input-focus-box-shadow: var(--pgn-elevation-form-input-base); // hack to get upgrade to paragon 4.0.0 to work

@import "~@edx/frontend-component-footer/dist/_footer";

Expand Down
1 change: 1 addition & 0 deletions src/__snapshots__/index.test.jsx.snap
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -17,6 +17,7 @@ exports[`app registry subscribe: APP_READY. links App to root element 1`] = `
Symbol(Symbol.observable): [Function],
}
}
wrapWithRouter={false}
>
<App />
</AppProvider>
Expand Down
10 changes: 4 additions & 6 deletions src/components/FilePreview/FileCard.scss
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,7 +1,5 @@
@import "@edx/paragon/scss/core/core";

.file-card {
margin: map-get($spacers, 1) 0;
margin: var(--pgn-spacing-spacer-1) 0;

.file-card-title {
text-overflow: ellipsis;
Expand All @@ -26,8 +24,8 @@
white-space: pre-wrap;
}

@include media-breakpoint-down(sm) {
@media (--max-pgn-size-breakpoint-sm) {
.file-card-title {
width: calc(map-get($container-max-widths, "sm")/2);
width: calc(var(--pgn-size-container-max-width-sm)/2);
}
}
}
6 changes: 2 additions & 4 deletions src/containers/ListView/ListView.scss
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,12 +1,10 @@
@import "@edx/paragon/scss/core/core";

span.pgn__icon.breadcrumb-arrow {
width: 16px !important;
height: 16px !important;
};

.empty-submission {
width: map-get($container-max-widths, "sm");
width: var(--pgn-size-container-max-width-sm);
display: flex;
flex-direction: column;
justify-content: center;
Expand All @@ -15,7 +13,7 @@ span.pgn__icon.breadcrumb-arrow {
margin: auto;

> img {
padding: map-get($spacers, 5);
padding: var(--pgn-spacing-spacer-5);
}
}

Expand Down
20 changes: 9 additions & 11 deletions src/containers/ResponseDisplay/ResponseDisplay.scss
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,14 +1,12 @@
@import "@edx/paragon/scss/core/core";

.response-display {
padding: map-get($spacers, 0);
width: map-get($container-max-widths, "md");
padding: 0;
width: var(--pgn-size-container-max-width-md);
overflow-y: hidden;
height: fit-content;

.submission-files {
.submission-files-title {
padding: map-get($spacers, 3);
padding: var(--pgn-spacing-spacer-3);
border-radius: calc(0.375rem - 1px);
border-bottom: 1px solid transparent;
transition: border-color 100ms ease 150ms;
Expand All @@ -25,13 +23,13 @@
cursor: initial;

> h3 {
color: $gray-300;
color: var(--pgn-color-gray-300);
}
}
}

.submission-files-body {
padding: map-get($spacers, 3);
padding: var(--pgn-spacing-spacer-3);
padding-top: 0;

.submission-files-table thead {
Expand All @@ -41,7 +39,7 @@
}

.preview-display {
padding: map-get($spacers, 3) 0;
padding: var(--pgn-spacing-spacer-3) 0;
}

.response-display-text-content {
Expand All @@ -50,12 +48,12 @@
}
}

@include media-breakpoint-down(sm) {
@media (--max-pgn-size-breakpoint-sm) {
.response-display {
width: 100%;

.preview-display {
padding: map-get($spacers, 1) 0;
padding: var(--pgn-spacing-spacer-1) 0;
}
}
}
}
16 changes: 8 additions & 8 deletions src/containers/ReviewActions/ReviewActions.scss
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,16 +1,16 @@
@import "@edx/paragon/scss/core/core";


// action reviews
.review-actions {
padding: map_get($spacers, 3);
padding: var(--pgn-spacing-spacer-3);
flex-direction: row;
background-color: $light-200;
background-color: var(--pgn-color-light-200);

.review-actions-username {
flex-grow: 1;
}
.review-actions-status {
margin-left: map_get($spacers, 3);
margin-left: var(--pgn-spacing-spacer-3);
vertical-align: middle;
}
.review-actions-group {
Expand All @@ -20,18 +20,18 @@

.submission-navigation {
float: right;
padding: map-get($spacers, 1);
padding: var(--pgn-spacing-spacer-1);
}
}
}

@include media-breakpoint-down(md) {
@media (--max-pgn-size-breakpoint-md) {
.review-actions {
flex-direction: column;
align-items: flex-start !important;
}

.review-actions-username {
padding-bottom: map-get($spacers, 3);
padding-bottom: var(--pgn-spacing-spacer-3);
}
}
}
8 changes: 4 additions & 4 deletions src/containers/ReviewModal/ReviewModal.scss
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,7 +1,7 @@
@import "@edx/paragon/scss/core/core";


.review-modal-body {
background-color: $gray-300 !important;
background-color: var(--pgn-color-gray-300) !important;
padding: inherit;

& > div.pgn__modal-body-content {
Expand All @@ -23,7 +23,7 @@
}
}

@include media-breakpoint-down(sm) {
@media (--max-pgn-size-breakpoint-sm) {
.review-modal-body {
padding: 0 !important;
overflow: hidden !important;
Expand All @@ -40,4 +40,4 @@
width: 100%;
}
}
}
}
26 changes: 11 additions & 15 deletions src/containers/Rubric/Rubric.scss
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,20 +1,16 @@
@import "~@edx/brand/paragon/variables";
@import "~@edx/paragon/scss/core/core";
@import "~@edx/brand/paragon/overrides";

.criteria-label {
width: 100%;
.criteria-title {
display: inline-block;
max-width: calc(100% - 44px);
color: $primary-500;
color: var(--pgn-color-primary-500);
font-weight: bold;
vertical-align: top;
}
.esg-help-icon {
float: right;
margin-top: (map-get($spacers, 2) * -1);
margin-right: (map-get($spacers, 2\.5) * -1);
margin-top: (calc(var(--pgn-spacing-spacer-2) * -1));
margin-right: calc(var(--pgn-spacing-spacer-2-5) * -1);
vertical-align: top;
}
}
Expand All @@ -38,9 +34,9 @@

.popover.overlay-help-popover {
z-index: 4000;
margin-right: map-get($spacers, 1) !important;
margin-right: var(--pgn-spacing-spacer-1) !important;
.help-popover-option {
margin-bottom: map-get($spacers, 1);
margin-bottom: var(--pgn-spacing-spacer-1);
}
}

Expand All @@ -49,15 +45,15 @@
width: 320px !important;
height: fit-content;
max-height: 100%;
margin-left: map-get($spacers, 3);
margin-left: var(--pgn-spacing-spacer-3);
position: sticky !important;
top: map-get($spacers, 1) * -1;
top:calc(var(--pgn-spacing-spacer-1) * -1);

.grading-rubric-header {
box-shadow: 0 0 0.25rem rgba(0, 0, 0, 0.3) !important;
display: flex;
justify-content: center;
padding: map-get($spacers, 3);
padding: var(--pgn-spacing-spacer-3);
}

.grading-rubric-body {
Expand All @@ -68,16 +64,16 @@
box-shadow: 0 0 0.25rem rgba(0, 0, 0, 0.3) !important;
display: flex;
justify-content: center;
padding: map-get($spacers, 3);
padding: var(--pgn-spacing-spacer-3);
}

button.pgn__stateful-btn.pgn__stateful-btn-state-pending {
opacity: .4 !important;
}
}

@include media-breakpoint-down(sm) {
@media (--max-pgn-size-breakpoint-sm) {
.grading-rubric-card {
margin-left: 0 !important;
}
}
}
2 changes: 1 addition & 1 deletion src/index.jsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -21,7 +21,7 @@ import App from './App';

subscribe(APP_READY, () => {
ReactDOM.render(
<AppProvider store={store}>
<AppProvider store={store} wrapWithRouter={false}>
<App />
</AppProvider>,
document.getElementById('root'),
Expand Down
Loading