Skip to content

Commit 82a69d2

Browse files
authored
Merge pull request #33 from uploadcare/feature/blocks-new-theming
Feature/blocks-new-theming
2 parents 3f888d9 + 3e6d5e8 commit 82a69d2

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

53 files changed

+2838
-6237
lines changed

examples/angular-uploader/package-lock.json

Lines changed: 1102 additions & 3602 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

examples/angular-uploader/package.json

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -17,7 +17,7 @@
1717
"@angular/platform-browser": "17.0.9",
1818
"@angular/platform-browser-dynamic": "17.0.9",
1919
"@angular/router": "17.0.9",
20-
"@uploadcare/blocks": "0.39.0",
20+
"@uploadcare/blocks": "0.44.0",
2121
"rxjs": "7.4.0",
2222
"tslib": "2.3.1",
2323
"zone.js": "0.14.4"

examples/angular-uploader/src/app/components/file-uploader/file-uploader.component.html

Lines changed: 4 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -7,9 +7,9 @@
77
Available options: https://uploadcare.com/docs/file-uploader/options/
88
99
Also note: Some options currently are not available via `lr-config`,
10-
but may be set via CSS properties. E.g. `darkmode`.
10+
but may be set via CSS properties or CSS classes. E.g. accent colors or darkmode
1111
12-
Here they are: https://github.com/uploadcare/blocks/blob/main/blocks/themes/lr-basic/config.css
12+
Here they are: https://uploadcare.com/docs/file-uploader/styling/
1313
-->
1414
<lr-config
1515
#config
@@ -25,7 +25,8 @@
2525
<lr-file-uploader-regular
2626
[attr.ctx-name]="uploaderCtxName"
2727
[class]="uploaderClassName"
28-
[class.dark-mode-enabled]="theme === 'dark'"
28+
[class.uc-dark]="theme === 'dark'"
29+
[class.uc-light]="theme === 'light'"
2930
></lr-file-uploader-regular>
3031

3132
<lr-upload-ctx-provider

examples/angular-uploader/src/app/components/file-uploader/file-uploader.component.scss

Lines changed: 5 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -7,20 +7,13 @@
77
}
88

99
/*
10-
Note: We set this class manually when we want File Uploader to join the dark side.
11-
The main option here is `darkmore`. The rest ones are used to tune the theme to match the website.
10+
CSS variables are used to customize the appearance of the file uploader.
1211
13-
See more: https://uploadcare.com/docs/file-uploader/styling/#base-values
12+
See more: https://uploadcare.com/docs/file-uploader/styling/
1413
*/
15-
.dark-mode-enabled {
16-
--darkmode: 1;
17-
18-
--h-accent: 33.3;
19-
--s-accent: 100%;
20-
--l-accent: 60.78%;
21-
22-
--clr-btn-bgr-primary: var(--ui-action-button-background);
23-
--clr-btn-txt-primary: var(--ui-action-button-text-color);
14+
.file-uploader {
15+
--uc-primary-dark: var(--ui-action-button-background);
16+
--uc-primary-foreground-dark: var(--ui-action-button-text-color);
2417
}
2518

2619
.preview {

examples/composition/index.html

Lines changed: 0 additions & 1 deletion
This file was deleted.

examples/composition/src/custom-source/CustomFileUploader.js

Lines changed: 0 additions & 24 deletions
This file was deleted.

examples/composition/vite.config.js

Lines changed: 0 additions & 13 deletions
This file was deleted.
File renamed without changes.

0 commit comments

Comments
 (0)