{"id":13521491,"url":"https://github.com/fomantic/Fomantic-UI-SASS","last_synced_at":"2025-03-31T20:31:40.692Z","repository":{"id":56847385,"uuid":"164464361","full_name":"fomantic/Fomantic-UI-SASS","owner":"fomantic","description":"Fomantic UI, converted to SASS and ready to drop into Rails \u0026 Compass.","archived":false,"fork":false,"pushed_at":"2024-06-03T17:56:24.000Z","size":16804,"stargazers_count":52,"open_issues_count":7,"forks_count":13,"subscribers_count":8,"default_branch":"master","last_synced_at":"2024-09-21T14:08:04.341Z","etag":null,"topics":["fomantic","fomantic-ui","sass"],"latest_commit_sha":null,"homepage":"https://fomantic-ui.com","language":"SCSS","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/fomantic.png","metadata":{"files":{"readme":"README.md","changelog":"CHANGELOG.md","contributing":null,"funding":null,"license":"LICENSE.txt","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null}},"created_at":"2019-01-07T17:04:17.000Z","updated_at":"2024-08-12T19:44:39.000Z","dependencies_parsed_at":"2024-06-19T17:11:55.493Z","dependency_job_id":"c30773ef-bf70-4a76-b299-7361bbde5556","html_url":"https://github.com/fomantic/Fomantic-UI-SASS","commit_stats":{"total_commits":214,"total_committers":35,"mean_commits":6.114285714285714,"dds":0.4392523364485982,"last_synced_commit":"82861c08678041959636a4410030bd4547fe392e"},"previous_names":[],"tags_count":33,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/fomantic%2FFomantic-UI-SASS","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/fomantic%2FFomantic-UI-SASS/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/fomantic%2FFomantic-UI-SASS/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/fomantic%2FFomantic-UI-SASS/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/fomantic","download_url":"https://codeload.github.com/fomantic/Fomantic-UI-SASS/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":222422221,"owners_count":16981940,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["fomantic","fomantic-ui","sass"],"created_at":"2024-08-01T06:00:35.072Z","updated_at":"2024-11-02T05:31:33.683Z","avatar_url":"https://github.com/fomantic.png","language":"SCSS","funding_links":[],"categories":["Resources"],"sub_categories":[],"readme":"# Fomantic UI for Sass\n\n`fomantic-ui-sass` is an Sass-powered version of [Fomantic UI](https://github.com/fomantic/Fomantic-UI) and ready to drop into Rails, Compass, or Sprockets.\nIt was forked from [`semantic-ui-sass`](https://github.com/doabit/semantic-ui-sass) to track Fomantic UI, a community fork of Semantic UI,\nand is intended to be a drop-in replacement. The project keeps references to Semantic UI for that reason and because Fomantic UI intends to \nmerge back into Semantic UI once active development of Semantic begins again.\n\n[![Gem Version](https://badge.fury.io/rb/fomantic-ui-sass.svg)](https://badge.fury.io/rb/fomantic-ui-sass)\n[![Build Status](https://travis-ci.org/shanecav84/fomantic-ui-sass.svg?branch=master)](https://travis-ci.org/shanecav84/fomantic-ui-sass)\n\n## NOTE\n\nThe gem only has default theme.\n\n## Installation and Usage\n\n```ruby\ngem 'fomantic-ui-sass'\n```\n\n`bundle install` and restart your server to make the files available through the pipeline.\n\n# fomantic-ui-sass with Rails or Sprockets\n\n## CSS\n\nImport Semantic in an SCSS file (for example, `application.css.scss`) to get all of Semantic's styles\n\n```css\n@import \"semantic-ui\";\n```\n\nYou can also include modules\n\n```css\n@import \"semantic-ui/collections/menu\";\n```\n\n## Custom font\n\n```scss\n$font-url: 'http://fonts.useso.com/css?family=Lato:400,700,400italic,700italic\u0026subset=latin';\n@import 'semantic-ui';\n```\n\n## Skip font loading\n```scss\n$import-google-fonts: false;\n@import 'semantic-ui';\n```\n\n## Custom font family\n```scss\n$font-family: 'custom-font-family';\n@import 'semantic-ui';\n```\n\n## All variables, you can custom any of that\n```scss\n$import-google-fonts: true !default;\n$font-url: 'https://fonts.googleapis.com/css?family=Lato:400,700,400italic,700italic\u0026subset=latin,latin-ext' !default;\n$font-name: 'Lato' !default;\n$font-family: $font-name, 'Helvetica Neue', Arial, Helvetica, sans-serif !default;\n```\n\n## Javascripts\n\nWe have a helper that includes all Semantic javascripts. Put this in your Javascript manifest (usually in `application.js`) to\n\n```js\n// Loads all Semantic javascripts\n//= require semantic-ui\n```\n\nYou can also load individual modules, provided you also require any dependencies.\n\n```js\n//= require semantic-ui/modal\n//= require semantic-ui/dropdown\n```\n\n# fomantic-ui-sass with Compass\n\n## New project\n\nInstall the gem and create a new project using the gem.\n\n```console\ngem install fomantic-ui-sass\ncompass create compass-project -r fomantic-ui-sass --using semantic-ui\n```\n\nThis will sort a few things out:\n\n* You'll get a starting `styles.scss`\n* You'll get a compiled stylesheet compiled \u0026 ready to drop into your application\n* We'll also copy the Semantic javascripts \u0026 images \u0026 fonts into their respective folders for you\n\n## Existing project\n\nInstall the gem, add the require statement to the top of your configuration file, and install the extension.\n\n```console\ngem install fomantic-ui-sass\n```\n\n```ruby\n# In config.rb\nrequire 'fomantic-ui-sass'\n```\n\n```console\ncompass install semantic-ui\n```\n\n### NOTE\n\nWhen using compass, you should visit file in local server, eg `http://localhost:3000/index.html`, rather than `file:///Users/doabit/demo/index.html`\n\n# Rails Helpers\n\n## Breadcrumbs helper\n\nAdd breadcrumbs helper `\u003c%= semantic_breadcrumbs %\u003e` to your layout.\n\n```ruby\nclass ApplicationController\n  semantic_breadcrumb :index, :root_path\nend\n```\n\n```ruby\nclass ExamplesController \u003c ApplicationController\n  semantic_breadcrumb :index, :examples_path\n\n  def index\n  end\n\n  def show\n    @example = Example.find params[:id]\n    semantic_breadcrumb @example.name, example_path(@example)\n    # semantic_breadcrumb :show, example_path(@example)\n  end\nend\n```\n\n## Flash helper\n\nAdd flash helper `\u003c%= semantic_flash %\u003e` to your layout\n\n## Icon helper\n\n```ruby\nsemantic_icon('add')\n# =\u003e \u003ci class=\"add icon\"\u003e\u003c/i\u003e\nsemantic_icon(:add)\n# =\u003e \u003ci class=\"add icon\"\u003e\u003c/i\u003e\nsemantic_icon('add sign')\n# =\u003e \u003ci class=\"add sign icon\"\u003e\u003c/i\u003e\nsemantic_icon('add', 'sign')\n# =\u003e \u003ci class=\"add sign icon\"\u003e\u003c/i\u003e\nsemantic_icon(:add, :sign)\n# =\u003e \u003ci class=\"add sign icon\"\u003e\u003c/i\u003e\nsemantic_icon('add', id: 'id')\n# =\u003e \u003ci class=\"add icon\" id=\"id\"\u003e\u003c/i\u003e\n```\n\n## TODO\n\n* Add global variables\n* Add rails helpers like `render_flash`?\n\n## Versioning\n\nThe version for Fomantic-UI-SASS tracks the version for Fomantic-UI. The first\nthree digits indicate the major, minor, and patch version of Fomantic-UI. The fourth\ndigit indicates a patch release for Fomantic-UI-SASS.\n\n## Contributing\n\n1. Fork it\n2. Create your feature branch (`git checkout -b my-new-feature`)\n3. Commit your changes (`git commit -am 'Add some feature'`)\n4. Push to the branch (`git push origin my-new-feature`)\n5. Create new Pull Request\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Ffomantic%2FFomantic-UI-SASS","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Ffomantic%2FFomantic-UI-SASS","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Ffomantic%2FFomantic-UI-SASS/lists"}