Comments (4)
@base698 will do that soon!
from forest-themes.
@xiaohanyu any update on this? thank you for the package. i built all the themes but now do not know what to do with them. i had been following this guide which may help as a basis for your own guide. wondering what exactly i need to copy over from the semantic-ui-forest/dist to the semantic folder in CRA.
if you can help me with describing where the theme goes id be happy to write an update for your readme with CRA steps
EDIT: see comment below. did not need any of the gulp / semantic-ui
build stuff from the guide i linked above
from forest-themes.
alright ive messed around with this a bit. i could be way off here but here were the steps i took
- clone then build the themes (from this README)
- copy the
dist/themes
directory to your projectsrc/theme
(createtheme/
dir) - copy the theme you want from
dist/path/to/theme.css
to your projectsrc/theme/
- its important that both the
theme.css
andthemes/
dir are in the same directory. where this directory is located in yoursrc/
is arbitrary but they need to be together - import the css file in your
src/App.js
- remove (if present) the CDN link to semantic-ui from your
public/index.html
- run the project
example using the flat theme
src/
theme/
semantic.flat.css <--- copied from semantic-ui-forest/dist/semantic-ui/v2/
# i believe you only need to copy over the theme asset sub-dir that is needed, not all 4
# it still must be in themes/ because the css file looks for it there
# you could modify the import statements in the theme.css if you dont want to nest the assets
themes/
default/ <--- this is the assets needed by semantic.flat.css
App.js <-- import "./theme/semantic.flat.css";
this seems to work for a few components i tested out (buttons, menus etc). but i see an absolute heap of other files and bits that i am not using which leads me to believe i may be missing some important parts that come up from certain components.
do either of you have any suggestions on which of those other files are required? or in what usage they may be required? thanks again
from forest-themes.
here is what ive gathered:
-
[simple] if you want to use a theme in its entirety then use the instructions above
-
[complex] if you want to mix and match themes (overriding them for certain components)
- you do not need to clone / build this repo
- follow this guide to set up
- in
semantic/src/theme.config
set each component to the theme you want - rebuild / watch to enact the theme changes
from forest-themes.
Related Issues (20)
- Superhero - Current Selection goes blank when dropdown is presented HOT 1
- Darkly - Input Icon Font Color HOT 1
- Sandstone - Header Color HOT 1
- Windows build script HOT 3
- Darkly - Card Hover Background Color HOT 2
- Build Script Broken? HOT 6
- Semantic 2.3 support HOT 2
- Add support for bootstrap v4 themes HOT 3
- Publish npm packages
- Issue with Loader element (Yeti + other themes) HOT 1
- superhero active hover menu items color stays dark HOT 1
- Lumen - invisible input & form placeholders HOT 1
- yarn install fails HOT 1
- Incorrect links from web to downloads HOT 2
- semantic.material.min.css broken
- Publish latest themes to npm HOT 1
- [Question] Status of this project? HOT 2
- Opening tar.gz files? HOT 5
- Checkboxes don't work in a few themes. HOT 4
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from forest-themes.