How do I use the semantic interface with your existing Meteor project?
I currently have a simple Meteor.js project running. How can I hide this app using Semantic-UI? On their website, they have html source code for individual forms and buttons, etc. I tried to copy and paste this into my own meteor project html file, but the whole application crashed and reported "incorrect HTML formatting".
How can I solve this situation and / or how can I easily hide my meteor project with Semantic-UI?
source to share
Set across the atmosphere
Install the semantic UI package from atmosphere:
meteor add semantic:ui
Install LESS AutoPrefixer
You will need the special package less-autoprefixer to add vendor prefixes to your LESS pipeline.
meteor add semantic:ui flemay:less-autoprefixer
Create a custom.semantic.json
custom.semantic.json file - this is a special file used to define themes that themes and components should include in a project build.
To remove a component from the pipeline, simply set the boolean value to false
.
{
"definitions": {
"accordion" : true,
"ad" : true,
"api" : true,
/* etc */
},
"themes": {
"amazon" : false,
"basic" : false,
"bookish" : false,
"bootstrap3" : false,
"chubby" : false,
"classic" : false,
"default" : true,
/* etc */
}
Run Meteor / Generate
Every time Meteor is launched or updated, it calls the package semantic:ui
to create a semantic interface.
The package uses a distinction between custom.semantic.json and .custom.semantic.json
to avoid unnecessary file updates.
If the file .custom.semantic.json
does not exist or is different from custom.semantic.json
then it will generate a semantic interface.
Set up site variables
Semantic UI Meteor includes a site theme site/
that can be used to customize smaller variables for your site. These files are optional and can be removed if configuration is not required.
Visit our topic guide to learn more about topics.
Problems and debugging
For help on the Semantic UI Meteor and the latest updates, please visit the GitHub repository house at https://github.com/Semantic-Org/Semantic-UI-Meteor .
FYI . You can view these instructions in context of origin on the SemanticUI Integrations page at http://semantic-ui.com/introduction/integrations.html#meteor
Or better yet, THIS: https://github.com/Semantic-Org/Semantic-UI-Meteor/blob/master/README.md
source to share
You can do it quite easily by adding this package: https://atmospherejs.com/semantic/ui
meteor add semantic:ui
And that will include the necessary JavaScript and CSS files for you to use the semantic-ui library.
source to share