Open JohnReedLOL opened 4 years ago
I tried updating it to this for the gsdk theme:
// @import "themes/default/variables";
@import "lib/bootstrap/bootstrap";
@import "lib/font-awesome/font-awesome";
@import "themes/gsdk/gsdk";
I did npm run build-sass
before npm run build && npm start
. It compiled but the website didn't change.
Hi, So this project is based on the hackaton starter project, see this PoC PR with details how to udpate themes to recent one and rewrite/update details: https://github.com/sahat/hackathon-starter/pull/1015 hth
@JohnReedLOL assuming that you are trying to use GSDK (https://www.creative-tim.com/product/get-shit-done-kit); we used to have it as part of the base theme for hackathon-starter, but removed it because it is not compatible with Bootstrap 4. If I remember it correctly, the error that you are getting "message": "Incompatible units: 'rem' and 'px'.",
is one of those Bootstrap 3 vs 4 incompatibility issues.
@YasharF I want to use literally any theme that isn't the default because the default looks bad. I cannot get any non-default theme to work. Is there any way you can fix this issue?
I think I figured out what the problem is. I verified that what you have in your original post doesn't work, but the same change in hackathon-starter does work. I looked at the source code in this repo, and it looks like this repo is out of sync with hackathon-starter. https://github.com/microsoft/TypeScript-Node-Starter/blob/master/src/public/css/themes/flatly/_flatly.scss is Flatly 3.3.7 which is not compatible with Bootstrap 4. This is already fixed with a bunch of other bug fixes in hackathon-starter. @peterblazejewicz there is going to be more improvements, feature additions, and bug fixes in hackathon-starter, and perhaps a better process for getting patches from there to here could help. I can probably submit a PR with a bunch of patches in about a week or two, but can't 100% commit to it at this point.
By the way, in the way we have implemented hackathon starter, you don't even need to rebuild, or even restart the server. Just making the following changes and a hard refresh on the browser is enough to load the new theme:
diff --git a/public/css/main.scss b/public/css/main.scss
index edfb209..0bb6d6a 100755
--- a/public/css/main.scss
+++ b/public/css/main.scss
@@ -1,4 +1,4 @@
-@import "themes/default/variables";
+@import "themes/flatly/variables";
@import "node_modules/bootstrap/scss/bootstrap";
@import "node_modules/@ladjs/bootstrap-social/bootstrap-social.scss";
@@ -7,7 +7,7 @@
@import "node_modules/@fortawesome/fontawesome-free/scss/regular";
@import "node_modules/@fortawesome/fontawesome-free/scss/solid";
-@import "themes/default/default";
+@import "themes/flatly/flatly";
// Scaffolding
// -------------------------
Before:
After:
there is going to be more improvements, feature additions, and bug fixes in hackathon-starter, and perhaps a better process for getting patches from there to here could help. I can probably submit a PR with a bunch of patches in about a week or two, but can't 100% commit to it at this point.
/cc @orta any thoughs on this? Thanks!
I took another look at this repo:
I think I figured out what the problem is. I verified that what you have in your original post doesn't work, but the same change in hackathon-starter does work. I looked at the source code in this repo, and it looks like this repo is out of sync with hackathon-starter. https://github.com/microsoft/TypeScript-Node-Starter/blob/master/src/public/css/themes/flatly/_flatly.scss is Flatly 3.3.7 which is not compatible with Bootstrap 4. This is already fixed with a bunch of other bug fixes in hackathon-starter. @peterblazejewicz there is going to be more improvements, feature additions, and bug fixes in hackathon-starter, and perhaps a better process for getting patches from there to here could help. I can probably submit a PR with a bunch of patches in about a week or two, but can't 100% commit to it at this point.
By the way, in the way we have implemented hackathon starter, you don't even need to rebuild, or even restart the server. Just making the following changes and a hard refresh on the browser is enough to load the new theme:
diff --git a/public/css/main.scss b/public/css/main.scss index edfb209..0bb6d6a 100755 --- a/public/css/main.scss +++ b/public/css/main.scss @@ -1,4 +1,4 @@ -@import "themes/default/variables"; +@import "themes/flatly/variables"; @import "node_modules/bootstrap/scss/bootstrap"; @import "node_modules/@ladjs/bootstrap-social/bootstrap-social.scss"; @@ -7,7 +7,7 @@ @import "node_modules/@fortawesome/fontawesome-free/scss/regular"; @import "node_modules/@fortawesome/fontawesome-free/scss/solid"; -@import "themes/default/default"; +@import "themes/flatly/flatly"; // Scaffolding // -------------------------
Before:
After:
Hi, thanks for this project, but it's not working for me either. I have just download the project and modify the main.scss file and the theme remains the same.
I want to change the theme from default to flatly. I think that the way to do that is by modifying this file.
Namely changing these lines:
To this:
But I get this error:
How do I change the theme?