Stack Overflow
Stack Overflow

Questions tagged [fomantic-ui]

Fomantic UI is a community fork and continuation of Semantic UI. It is mainly a JavaScript/CSS framework characterized by human readable (semantic) class names. Use this tag along with others, like [javascript] or [css] to narrow down the scope of your question.

Semantic UI is a front-end GUI framework that provides a collection of JavaScript and HTML/CSS classes to develop responsive UIs.

Semantic UI appears to not being actively developed. Fomantic UI is the community fork for maintenance and upgrades on top of Semantic UI.

Resources:

Links to the documentation for each element and style can be found in the sidebar of the "Getting Started" page.

As a fork of Semantic UI, the community-maintained Fomantic UI is equivalent to the parent repository at least until version 2.4. It may diverge starting from 2.5 and onward.

42 questions
5
votes
2 answers

How to import Fomantic-UI into an Angular project

I'm developing an Angular project base on Fomantic-UI framework (that is a fork of Semantic-UI). I have installed it: npm install --save fomantic-ui and then I have added the following lines in angular.json file: "styles": [ …
smartmouse
  • 13,912
  • 34
  • 100
  • 166
4
votes
3 answers

Does HTML5 allow a block-level element (like div) inside a heading (like h1)?

I would always have said no, but then I came across this code from Semantic UI (and Fomantic UI), a very popular front-end framework:

Account Settings
Kal
  • 2,098
  • 24
  • 23

2
votes
1 answer

Semantic UI: adjusting width style of ui container

I would like to edit the styling of ui main container class in Semantic UI. Currently, we have:
However, I want the following style to be applied:
I…
Peabrain
  • 519
  • 2
  • 12
2
votes
1 answer

Semantic UI: Cannot "tab" through searchable dropdowns

I have multiple dropdowns in a row and I want to allow the user to move from one field to the other with the tabulator key. The dropdowns match the text, allow full text search and are clearable. The tabbing does work but, unfortunately, when…
a.l.e
  • 792
  • 8
  • 16
2
votes
1 answer

Progress bar not filling with progress bar script tag

The expected result is that when the page loads, the progress bar loads like this: https://i.stack.imgur.com/xThgR.png However the result I get is a progress bar with no progress, like this: https://i.stack.imgur.com/vH9oh.png The link for jQuery…
Fallen
  • 35
  • 9
1
vote
0 answers

Rollup configuring alias for semantic-ui-less @import

I have been configuring rollup for creating custom react component library on top of fomantic-ui. I have already setup the rollup.config.js ALthough in the configuration, I need to resolve an import: @import (multiple) '../../theme.config'; the…
Sami Khan
  • 31
  • 1
  • 8
1
vote
1 answer

Bundling fomantic-ui-css with webpack for VueJs

I am trying to create a VueJs project using Vue-Cli and wanted to use fomantic-ui-css with it. I installed fomantic-ui using npm and then imported it the main.js, however when I run the application I get the ReferenceError: jQuery is not defined…
Rohit
  • 3,659
  • 3
  • 35
  • 57
1
vote
0 answers

sapper/svelte with fomantic-ui and fontawesome-free

I'm starting a project with Sapper (https://sapper.svelte.dev/) / Svelte (https://svelte.dev/) and my client wants to use Fomantic-UI as a CSS framework (https://fomantic-ui.com/introduction/getting-started.html). I don't have found on the net,…
Moisés Bites
  • 95
  • 1
  • 1
  • 4
1
vote
1 answer

How to observe an array inside an array with Aurelia?

I have a people array of objects where each Object (representing a person) contains a roles array: @observable people = [ { name: 'Name1', roles: [ '1', '2' ] }, { name: 'Name2', roles: [ '3', '4' …
IchBinGrumpig
  • 119
  • 1
  • 1
  • 10
1
vote
1 answer

Semantic-UI/Fomantic-UI: How to add a linebreak to a list item

I'm using Fomantic-UI (Semantic-UI). I have a list with items that consist of an avatar, a text and a button. When the text is to wide to fit on one line, it should wrap to a second line. But instead, the whole line wraps to a new line under the…
G. Marc
  • 4,987
  • 4
  • 32
  • 49
1
vote
1 answer

Fomantic-UI in Angular project: ".popup is not a function"

I'm trying to create an Angular + Fomantic-UI playground but I'm experiencing problem in importing Fomantic-UI into the Angular project. Here is my StackBlitz: https://stackblitz.com/edit/angular-hcvmam As you can see I do import jquery,…
smartmouse
  • 13,912
  • 34
  • 100
  • 166
1
vote
0 answers

Fomantic-UI Searchable Dropdown Meta Search

I'm using Fomantic-UI, and I have a simple searchable dropdown.
1
vote
1 answer

Why am I getting ERROR_FILE_NOT_FOUND after installing Semantic-UI?

Basic html page. Just starting and downloading packages. Checking if my Semantic UI setup is properly installed, but when I open up my index.html page and check the console I get 'GET file:///semantic/dist/semantic.min.css net::ERR_FILE_NOT_FOUND',…
fourOhFour
  • 77
  • 9
1
vote
1 answer

How do I get the JS from Fomantic UI to work in my Ruby on Rails App?

I'm looking to get the Calendar javascript functionality to work in my Ruby on Rails app, and it's not, and I'm wondering what I'm doing wrong? I've bundle installed both the fomantic-ui-sass and the 'jquery-rails'gems in my application, and put…
user11703419
1
vote
1 answer

Remove white space in grid between images using Semantic UI and React

I'm making an image gallery using Semantic UI and I'm having some difficulties getting rid of the extra white space between images that aren't as big as others. Here's the link to the codesandbox repo I know Semantic UI's grid is based off of…
isaaca
  • 47
  • 8
1
2 3