You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

109 lines
5.2 KiB

9 years ago
9 years ago
9 years ago
9 years ago
9 years ago
9 years ago
9 years ago
9 years ago
9 years ago
9 years ago
9 years ago
9 years ago
9 years ago
9 years ago
9 years ago
9 years ago
11 years ago
9 years ago
9 years ago
9 years ago
9 years ago
9 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
9 years ago
9 years ago
9 years ago
9 years ago
11 years ago
9 years ago
  1. ![Semantic](http://www.semantic-ui.com/images/logo.png)
  2. # Semantic UI
  3. Semantic is a highly-themable UI framework with intuitive naming conventions built around common usage.
  4. Key Features
  5. * 50+ UI Elements
  6. * 3000 + CSS Variables
  7. * 3 Levels of Variable Inheritance (Similar to SublimeText)
  8. * Built using EM values for responsive design
  9. > Semantic UI is now at 1.0, be sure to check out our [release notes](https://github.com/Semantic-Org/Semantic-UI/blob/master/RELEASE-NOTES.md#version-100---november-24-2014) for changes from the pre-release.
  10. ## International
  11. * **Chinese** A Chinese mirror site is available at [http://www.semantic-ui.cn](http:/www.semantic-ui.cn)
  12. * **Right-to-Left (RTL)** - An RTL version can be created using our build tools by selecting `rtl` from the install script
  13. * **Translation** - To help translate see the [Wiki Guide](https://github.com/Semantic-Org/Semantic-UI/wiki/Translating-Semantic-UI-Docs) for translations
  14. ## Release Schedule
  15. Semantic follows a weekly schedule for feature updates. To see what changes are scheduled for upcoming releases, be sure to visit the [release milestone](https://github.com/Semantic-Org/Semantic-UI/milestones) page.
  16. ## Community Support
  17. * **Want to learn about Semantic?** [Request an Invite](https://docs.google.com/forms/d/1hI1z136sXLkTQKtsv8SIvjjAvzpH77YzMQKrU-P8GAc/viewform?usp=send_form) to join [our Slack chatroom](http://semanticui.slack.com) for support and project discussions
  18. * **Have a bug?** Make a test case by forking this [jsfiddle](http://jsfiddle.net/efp8z6Ln/), then submit a [bug on GitHub](https://github.com/Semantic-Org/Semantic-UI/issues)
  19. * **Having issues with your code?** Submit a question on [StackOverflow](http://www.stackoverflow.com) or ask our [Google Group](https://groups.google.com/forum/#!forum/semantic-ui)
  20. * **Looking for a specific integration like Dart, Wordpress, Drupal, Angular, or Rails?** Check out our [integration page](https://github.com/Semantic-Org/Semantic-UI/wiki/Integration)
  21. ## Contributing
  22. * **Missing documentation in your language?** Help us make Semantic available in more languages by [joining our translation community](https://www.transifex.com/organization/semantic-org/)
  23. * **Want to help with integration?** Projects are organizing for official [Meteor](https://github.com/Semantic-Org/Semantic-UI-Meteor), and [Angular](https://github.com/Semantic-Org/Semantic-UI-Angular) integrations as well as a [Sass](https://github.com/Semantic-Org/Semantic-UI-SASS) port. Join the discussion on their respective boards.
  24. * **Want to help others learn concepts behind Semantic?** [Learnsemantic.com](http://www.learnsemantic.com) needs articles to help others get others up to speed with Semantic UI. [Send me an e-mail](mailto:jack@semantic-ui.com) if you are interested.
  25. ## Getting Started
  26. ### Basic Usage (Default Theme)
  27. We recommend setting up the Semantic build workflow to support on-the-fly
  28. theming and customization, but it is not required.
  29. To use the "ready-to-use" distribution version, which includes all components, simply link to
  30. `dist/semantic.js` and `dist/semantic.css` (or their minified counterparts) in your page.
  31. ``` html
  32. <link rel="stylesheet" type="text/css" href="/dist/semantic.min.css">
  33. <script src="/dist/semantic.min.js"></script>
  34. ```
  35. You may also prefer to use individual components found in `dist/components` to reduce the libraries file size.
  36. ``` html
  37. <link rel="stylesheet" type="text/css" href="/dist/components/icon.css">
  38. ```
  39. ### Recommended Usage (Themed)
  40. Semantic is best used actively during development. We have included build tools for updating your site's theme as you work.
  41. ![Getting Started](https://dl.dropboxusercontent.com/u/2657007/install.gif)
  42. ```
  43. npm install
  44. gulp
  45. ```
  46. Running gulp for the first time will start the interactive set-up.
  47. This helps you create two important files ``semantic.json`` which stores your folder set-up, and ``themes.config`` a central file for setting ui themes.
  48. The install utility will also help you set-up which components you want to include in your packaged release, ignoring parts of Semantic you may not use.
  49. Once set-up you can use these commands to maintain your project
  50. ```nodejs
  51. gulp // defaults to watch after install
  52. gulp build // build all files from source
  53. gulp clean // clears your dist folder
  54. gulp watch // watch files
  55. gulp install // re-runs install
  56. gulp help // list all commands
  57. ```
  58. For more detail into how work with Semantic when building a site please [read our customization guide](http://learnsemantic.com/developing/customizing.html) on [LearnSemantic.com](http://learnsemantic.com/)
  59. ## Browser Support
  60. * Last 2 Versions FF, Chrome, IE (aka 10+)
  61. * Safari 6
  62. * IE 9+ (Browser prefix only)
  63. * Android 4
  64. * Blackberry 10
  65. ## Pull Requests
  66. When adding pull requests be sure to merge into [next](https://github.com/Semantic-Org/Semantic-UI/tree/next) branch. If you need to demonstrate a fix in ``next`` release, you can use [this jsfiddle](http://jsfiddle.net/rduvhn8u/1/)
  67. ## Reaching Out
  68. If you'd like to start a conversation about Semantic feel free to reach out by e-mail [jack@semantic-ui.com](mailto:jack@semantic-ui.com)
  69. [![Flattr This](https://api.flattr.com/button/flattr-badge-large.png)](https://flattr.com/submit/auto?user_id=jlukic&url=https%3A%2F%2Fgithub.com%2Fjlukic%2FSemantic-UI)