问题
Based from the Readme files of Mirage 2, it says here:
If you want to base your theme on an existing Bootstrap theme (like the ones at bootswatch.com) you can do so by using the standard Bootstrap color scheme and replacing the import of Bootstrap in bootstrap_color_scheme/_main.scss:
@import "../vendor/bootstrap-sass-official/vendor/assets/stylesheets/bootstrap";
with an import of just its _variables.sccs file (those variables need to be defined, because they are used in _dspace-bootstrap-tweaks.scss):
@import "../vendor/bootstrap-sass-official/vendor/assets/stylesheets/bootstrap/_variables";
Then import the the css file(s) of your Bootstrap theme of choice below it. Depending on the theme you may also need to update the twbs-font-path function right above that import statement.
What I did:
Ok, so I activated the mirage2_bootstrap_color_scheme maven profile. Copied the bootstrap_color_scheme/_main.scss from dspace-xmlui-mirage2/src/main/webapp/styles/ into dspace/modules/xmlui-mirage2/src/main/webapp/themes/Mirage2/styles.
I changed the text in _main.scss that says @import "../vendor/bootstrap-sass-official/vendor/assets/stylesheets/bootstrap"; into @import "../vendor/bootstrap-sass-official/vendor/assets/stylesheets/bootstrap/_variables";, and then I copied the bootstrap.min.css that I downloaded from bootswatch.com and put it in the same directory with _main.scss and then I referenced it in _main.scss with an @import "bootstrap.min.css"; statement.
I'm having this error when running mvn package:
error styles/main.scss (Line 12: File to import not found or unreadable: variables.`
I also tried putting the _variables.scss under the bootstrap_color_scheme directory and used the @import "variables"; but I got the same not found or unreadable error.
Can someone guide me on how to correctly use the themes from bootswatch.com to apply to Mirage 2? An example and a simple walk through of using a sample theme from bootswatch.com would be great.
Thanks in advance.
回答1:
I deleted my other answer because I was mistaken. Here is an example of a working bootswatch theme: https://github.com/antoine-atmire/DSpace/tree/mirage2%2Bbootswatch/dspace/modules/xmlui-mirage2/src/main/webapp/themes/Mirage2/styles
The /styles/bootstrap_color_scheme/_main.scss file gets copied to /styles/main.scss during the build process, so the @import statements should be relative to /styles/main.scss.
回答2:
Bootstrap-sass has updated its paths, and the Mirage 2 docs are not yet updated.
_variables.scss is now stored here: "../vendor/bootstrap-sass-official/assets/stylesheets/bootstrap/_variables.scss"
Depending on which version you're using, it can even be in another place.
A general recommendation is to look at the vendor folder in: dspace/modules/xmlui/target/xmlui-*/themes/Mirage2/vendor/
Look for the path of the variables file there and use that path.
来源：https://stackoverflow.com/questions/27210988/styling-of-mirage-2-using-themes-from-bootswatch-com