Questions tagged [semantic-ui-react]

Semantic-UI-React is the official React integration for Semantic UI

Semantic-UI-React is the official React integration for Semantic UI.


Current version: Semantic UI React (version v0.81.1 as of 2018-06-04)

  • jQuery Free
  • Declarative API
  • Augmentation
  • Shorthand Props
  • Sub Components
  • Auto Controlled State
874 questions
5
votes
3 answers

custom className semantic ui react

I was hoping to do something like this: But no matter if I add a class name this is all that shows up:
How do I make my own className. I would like to use the divider…
5
votes
2 answers

Change Semantic UI Tabs on click of some button in other component

I have the following code in my component, where A nad B are my other components and SomeComponent is where I am rendering A and B along with the TabExampleSecondaryPointing component. import { Tab } from 'semantic-ui-react'; const panes = [ {…
Vibhor Sharma
  • 125
  • 1
  • 3
  • 6
5
votes
1 answer

semantic-ui-react List onClick declaration

i'm trying to create a list of documents dynamically with semantic-ui-react. I'd like to get the document title back when the list item is clicked. According to the documentation: https://react.semantic-ui.com/elements/list there is an onItemClick…
inspiral
  • 611
  • 1
  • 7
  • 15
5
votes
3 answers

Change styling on hover semantic-ui-react components

if I set up a className for certain components like and in my css I use .Change:hover{ background-color: black; //or any other change on hover } nothing is overriden on the hover. I…
DORRITO
  • 621
  • 2
  • 8
  • 25
5
votes
2 answers

Blinking Modal with Semantic UI React

I'm in the process of applying a modal using the Semantic UI React library. When the modal is triggered it starts flickering and I can't for the life of me figure out why. Any help is appreciated. Prior to using Semantic I did install Bootstrap but…
Mix Master Mike
  • 1,079
  • 17
  • 26
5
votes
1 answer

How to expand the width size of Input in Semantic React UI?

I'm working with Reactjs project, and I use Semantic UI React to beautify the Input. However, it seems that Input is always showed in default size. How can I resize its horizontal width ? I follow the instruction on Semantic UI React Home page, I…
Khanh Tran
  • 87
  • 1
  • 3
  • 9
5
votes
1 answer

How to trigger a modal when clicking on a dropdown item in Semantic UI React?

I have a dropdown and a modal, and I would like to show the modal when one of the dropdown item is clicked. Is it possible? I couldn't find a way to do so because I cannot obtain the target DropdownItem, which is required by Modal's trigger…
Searene
  • 25,920
  • 39
  • 129
  • 186
5
votes
2 answers

React Semantic UI - Modal without trigger?

Is it possible to use a Modal without a trigger? I will open and close it via state. For example, I want to use onClick on an input field(with a file name) to open the modal with a file chooser and then edit the name of the choosen file in the input…
stgewehr
  • 53
  • 1
  • 3
5
votes
1 answer

How to add max length in input of semantic-ui-react?

Max length is not working in Input of semantic-ui-react.
Balram Singh
  • 1,576
  • 19
  • 30
5
votes
1 answer

How do you place default message in the semantic react ui search?

https://react.semantic-ui.com/modules/search Below is images of how the semantic react ui search widget looks like. In the second image, I was wondering how you can put a prompt message to indicate to the user a message on what the search bar is…
darewreck
  • 2,576
  • 5
  • 42
  • 67
5
votes
1 answer

React semantic UI: How to set focus for input field of dropdown element

Is it possible to initially set focus to an input field of an Dropdown element? So the…
user3142695
  • 15,844
  • 47
  • 176
  • 332
5
votes
6 answers

Semantic-UI-react fixed sidebar

Have Googled, searched within semantic ui's docs and issues page, and searched within stackoverflow. Couldn't find the answer. Within Semantic-ui-react, how do I make a sidebar whose content is fixed to the screen? What I currently have is…
Argonautic
  • 125
  • 1
  • 2
  • 8
5
votes
1 answer

Configuring React Router SubRoutes with React-Semantic-UI CardGroups

I have researched this for a while, and followed documentation from the following places: This issue on github led me to the semantic-ui-react documentation on Augmentation, and the react-router documentation on setting up route config with…
kinghenry14
  • 1,187
  • 1
  • 11
  • 34
5
votes
1 answer

How to insert label element in Semantic UI + React Dropdown component?

I would like to recreate the following Dropdown from Semantic UI, in which a
allthesignals
  • 307
  • 2
  • 13
5
votes
1 answer

Semantic UI React item image as link

I am using Item (Semantic UI React) and I would like to set the image as a link. But how do I reference the link URL? If I wrap…
user3142695
  • 15,844
  • 47
  • 176
  • 332