douglasg14b / awesome-semantic-ui

A curated list of Semantic-UI & Fomantic-UI resources and related projects

 __________________________    
|░░░░░░░░░░░░░░░░░░░░░░░░░░| 
|░░░░░░░░░|`     ,|░░░░░░░░| 
|░░░░░░░|          |░░░░░░░| A W E S O M E
|░░░░░░░|   |░░░░░░░░░░░░░░|  _______ .___  ___.   ___   .__   __._______. __  ____        __   __   __  
|░░░░░░░|      `|░░░░░░░░░░| |   ____||   \/   |  /   \  |  \ |  |        |  |/    |      |  | |  | |  | 
|░░░░░░░░░░|       |░░░░░░░| |  |__   |  \  /  | /  ^  \ |   \|  `--|  |-`|  |  ,--' ___  |  | |  | |  | 
|░░░░░░░░░░░░░░|    |░░░░░░| |   __|  |  |\/|  |/  /_\  \|  . `  |  |  |  |  |  |   |___| |  | |  | |  | 
|░░░░░░░|   `.,.   .|░░░░░░| |  |____ |  |  |  /  _____  |  |\   |  |  |  |  |  `--.      |  `-'  | |  | 
|░░░░░░░░|        |░░░░░░░░| |_______||__|  |__|_/     \_|__| \__|  |__|  |__|\____|       \_____/  |__| 
|░░░░░░░░░░░░░░░░░░░░░░░░░░| 
|░░░░░░░░░░░░░░░░░░░░░░░░░░| 

A curated list of Semantic-UI and Fomantic-UI themes, resources and related projects. The main idea is that everyone can contribute here, so we can have a central repository of informations related to Semantic/Fomantic.

Inspired by the awesome list thing.

Table of Contents

• Resources
• Themes
• Backend
• Frontend
• Examples
• Widgets
• Related
• Fomantic?

Resources

Fomantic UI

• Fomantic-UI: A community fork of the ever loved Semantic-UI.

• Fomantic-UI-LESS: LESS only distribution of Fomantic UI

• Fomantic-UI-SASS: Fomantic UI, converted to SASS and ready to drop into Rails & Compass.

Semantic UI

• Semantic-UI: An enterprise-class UI design language and React-based implementation.

• Semantic-UI-LESS: LESS only distribution of Semantic UI

• Semantic-UI-SASS: Semantic UI, converted to SASS and ready to drop into Rails & Compass.

Community

• Fomantic-UI Discord: Official Discord server for Fomantic-UI discussion

Themes

• Open Theme: Powerful new theme featuring Semantic-UI for speedily creating amazing websites and mobile-hybrid apps on GitHub Pages.

• Recreating GitHub: A Semantic-UI project designed to showcase theming with examples to create a packaged theme, using component CSS overrides, and managing themes with theme.config.

• Semantic Ant: An Ant Design inspired theme for building beautiful modern Web apps.

• Semantic Strap: A beautiful CSS toolkit inspired by Semantic-UI and built with Bootstrap 4.

• Semantic Dojo: A responsive theme that harnesses the style awesomeness of Semantic-UI framework with Dojo toolkit powerful UI widgets, for modern and elegant web apps.

Backend

• phpMv-UI toolkit: A collection of php visual components for Semantic-UI, usable with php and MVC frameworks (Phalcon, Laravel, Yii, Symfony, CodeIgniter, CakePhp).

• Yii2 Semantic UI extension: A Yii2 extension for Semantic-UI.

Frontend

VueJS

• Semantic-UI-Vue: A Semantic-UI-React inspired Vue integration of Semantic-UI

• Transitions: Use Semantic-UI transitions as v-transition in Vue.js.

• Vue UI: This is a port of the Semantic-UI modules as Vue.js components.

• Vue Semantic: A collection of vue components for integrating the semantic ui library.

React

• React Semantic-UI: The official Semantic-UI-React library.

• React Semantic-UI Components: A collection of React components for Semantic-UI.

• React Semantify: Integrate Semantic-ui with react components.

Angular

• Ng2-Semantic-UI: jQueryless Semantic UI Angular Integrations

AngularJS

• Angular Semantic: AngularJS directives for Semantic-UI.

• Angular Semantic-UI: AngularJS native directives for Semantic UI.

Others

• Semantic UI Ember: Official Semantic UI Integration for Ember.

• Semantic-UI Meteor: Official Semantic UI Integration for Meteor.

• October CMS: Semantic UI - Boilerplate for October CMS.

• SM Calendar: Mithril Semantic-UI calendar widget.

Examples

Repositories

• Ting: A music social networking project written in Ruby on Rails and Semantic-UI.

• Strong Together: A starter project to build single page Vue.js apps as stand-alone or for Laravel / Laravel Spark projects; based on Browserify and Semantic-UI.

• RemoteRetro: A real-time application for conducting Agile retrospectives at remoteretro.org written in Elixir/Phoenix/React/Semantic-UI.

• PyroCMS Cheatsheet: A list of commands and features for PyroCMS 3 using Semantic-UI.

• Be Awesome: Single page template with Semantic-UI and jquery.

• Semantic Admin Template: An Admin template with Semantic-UI.

• React-Semantic.UI-Starter: Production-ready, performance-first, starter built with React/Redux/React-Semantic-UI/Webpack/Jest and Service Workers.

Functioning Websites

• Agile Toolkit: UI and Data Framework for Web Apps
• Elux: Estonian top home appliances e-shop
• Polipart: French political site that lets people find and contact their representatives.

Widgets

• Weather-Widget: A weather widget which can be dropped in with a single <script> tag to any website, built with Fomantic UI.
• Semantic-UI Range: Add-on range slider for Semantic UI.
• Semanti-UI Hamburger Menu: Add-on responsive menu + hamburger trigger.
• Fomantic-UI-Examples: A collection of FUI examples such as a password strength box during user account signup

Related

• Bragit: Show off your Github repository buttons with elegance using Semantic-ui labeled buttons.

Fomantic?

What is Fomantic-UI?

Fomantic-UI (also known as FUI) is a community fork of Semantic-UI. coo

Why was it made?

Fomantic-UI (FUI) was created to continue active development of Semantic-UI and has the intent to be merged back into the master repository once active development can restart. For more info please read the following issues Semantic-Org/Semantic-UI/issues/6109 Semantic-Org/Semantic-UI/issues/6413. With that said FUI is currently in the planning stage of a rewrite known as v3. You can find out more about the v3 plans here.

Should I use FUI instead of SUI?

Currently FUI is a drop in replacement of SUI with lots of bug fixes and new features and also has some new components including a calendar and slider module 😍. If you want a more updated framework then yes you should definitely switch to FUI.

Contributing

Your contributions are always welcome! Click Here to read the guidelines.

Other Awesome Lists

• Awesome

• Awesome-awesome

• Awesome-awesomeness

License

This work is licensed under a Creative Commons Attribution 4.0 International License.

awesome-semantic-ui's Issues

Fomantic CDNJS Link

Fomantic is now available on CDNJS so you add the cdnjs badge also 😃

Transfer repo?

As it currently stands, this list is more unhelpful than it is helpful since it's littered with deprecated/abandoned projects and new projects and common libraries are not represented.

Pull requests have been sitting idle as well. It's probably time to hand this off?

I'm relatively active with semantic and the conversations around Fomantic and would be happy to adopt this repo and update & maintain it.

Add Fomantic vs Semantic explanation

There should be a section above the ToC that provides an explanation of what this fomantic thing is about.

It should answer these questions:

• What is Fomantic?
• Why was it made?
• Should I use it instead?

This will probably be under a section:

Fomantic?

--write stuff here--

Discussion: Display Repo Activity

I'd like to display repo activity, so users coming here looking for a library to use in their project don't need to slog through old or abandoned projects to find the up-to-date ones that they need.

I believe it's handy to keep some older projects around, as they make for good reference material.

This can be achieved with one of the activity badges of shields.io, but I want to avoid tons of visual clutter....

Examples:

Opinions of this example: https://github.com/douglasg14b/awesome-semantic-ui/blob/Next/README.md ?

CDN links in resources

I might be a good idea to link to CDN's in the resources section. Over at FUI we get asked a lot for CDN links.

Fomantic:

• https://www.jsdelivr.com/package/npm/fomantic-ui

Semantic:

• https://www.jsdelivr.com/package/npm/semantic-ui
• https://cdnjs.com/libraries/semantic-ui

List of potential additions

I will update this comment as I find potential additions to this list.

I'm just browsing through project dependents and checking out random repos. If you have any suggestions add a comment.

• https://github.com/bestian/freemath
• https://dotstart.github.io/Stockpile/
• https://github.com/ezaquarii/vpn-at-home
• https://github.com/InfinityStudio/ILauncher