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
1
vote
1 answer

How to remove the DOM elements of a modal on close

Background: At time of writing, Fomantic-UI is the live-development fork of Semantic-UI which will one day be rolled into Semantic-UI and is for the mean time the de facto supported genus of Semantic-UI. Issue: Fomantic-UI provides a modal…
Vanquished Wombat
  • 9,075
  • 5
  • 28
  • 67
1
vote
2 answers

Grid element not expanding to 100% width

So i'm new to grid. Used it for a few project now but still not good with working out the kinks. I'm having a problem where I've set the grid element to 100% but it is getting clipped at 80%. This seems like it could be a simple fix but I've been…
Leviathan_the_Great
  • 429
  • 1
  • 5
  • 14
0
votes
1 answer

How can I add a right ribbon label to a card using Fomantic UI?

I am brand new to Fomantic (and webdev in general) and I am trying to make a website that has a card with a ribbon label on the right side, like they have in the docs where they use a segment instead. However, when I mimic the code of the examples…
h8jr
  • 1
0
votes
0 answers

How to initialize Semantic UI multi-level dropdown with JavaScript only?

The documentation mentions only this, which is fine for a normal dropdown but I need a multi level dropdown like their example, but with only vanilla JavaScript. I went through all of the documentation and tried searching everywhere to no…
A.G.
  • 194
  • 2
  • 10
0
votes
2 answers

Fomantic Validation Rule and RegExp

I seem to be hitting my head on a brick wall trying to get a RegExp rule working in the form validation for a field on my Fomantic form. All the other rules work including custom ones; just not a RegExp one. The regExp rule should be validating that…
PhilC
  • 123
  • 8
0
votes
1 answer

fomantics-ui change theme settings

I have fomantic-ui 2.8.8 installed on express 4.161. I'm pretty sure fomantics is working, since in header.hbs I changed the line:
0
votes
1 answer

Semantic UI / Fomantic UI form validation with Google reCAPTCHA v3

I'm trying to find a way to validate Semantic UI / Fomantic UI forms using Google reCAPTCHA v3. I found an option for validation using Google reCAPTCHA v2 here on Stack. But, the new form of V3 validation is different and uses another form of user…
0
votes
1 answer

cause of Less::Error `unmatched '/*'`/ Sass::SyntaxError in my rails app

I just switched from Semantic UI to the community maintained Fomantic UI in my Rails app, and get one of two obscure errors when using either the npm package or the sass rails gem. With the npm package, I get Less::Error unmatched '/*' whenever the…
calyxofheld
  • 1,538
  • 3
  • 24
  • 62
0
votes
0 answers

Why putting Fomantic UI javascript code in a separate js.file instead of index.html not working?

Her is an example: I got a slider element and its initialization in index.html her Simulation Animator
0
votes
1 answer

Migrate from semantic-ui to fomantic-ui?

Any recommendations on how to migrate an existing Node project from using Semantic-UI to Fomantic-UI? I know Fomantic-UI is a fork of Semantic-UI and backward compatible, so I'm wondering if I can simply run: npm remove semantic-ui npm install…
Lazor
  • 193
  • 8
0
votes
1 answer

How do I disable Semantic-UI / Fomantic-UI dynamic menu/state

I'm building a static site with Fomantic-UI (Semantic-UI). When I created my menus, but before I wired them up to links, I noticed that the text of the dropdown link item changed when one of the submenu items was selected. Neat! But since I'm not…
Gwyndall
  • 1
  • 4
0
votes
1 answer

Have Fomantic-UI (Angular-JS) sidebar scoll indipendantly

Is there a method to get a sidebar to scroll indipendently from the content it pushes? Right now I have a page set up in this fasion: -------------------------- |[button] Header | -------------------------- |S | Main content | |i | …
J. Finn
  • 129
  • 1
  • 11
0
votes
1 answer

Fomantic UI - TypeError: $(...).toast is not a function

I am using Meteor with React and Semantic-ui-react. I needed a toast function so I wanted to change to Fomantic UI. Everything related is loaded by NPM. I removed semantic-ui-css and added fomantic-ui-css. I removed the
0
votes
1 answer

How to install and build fomantic-ui in GitLab CI?

Background: I'm trying to use electron-updater with my electronJS code on a GitLab public repo I'm following this guide: https://gist.github.com/Slauta/5b2bcf9fa1f6f6a9443aa6b447bcae05 However, the GitLab CI build stage keeps failing with the error …
0
votes
1 answer

How do I solve my layouts being messed up due to fields_with_error in RoR app?

I'm using Fomantic(Semantic) UI in my Ruby on Rails, and I realize my forms get messed up when validations fail because of the fields_with_errors class that's automatically added. Is there a known fix for this? Prior to submission, my form looks…
user11703419