Stack Overflow
Stack Overflow

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
847 questions
5
votes
4 answers

How to display json data in a reactjs component

I'm new to react. I dont know how to import json data in one of my component. This is my json data: [ { "id": 1, "firstname": "abc", "lastname": "xyz", "phone": "+91 789654123", "email":…
Sanjana
  • 216
  • 1
  • 3
  • 13
5
votes
1 answer

How to do Dynamic images in ReactJS?

In my system I have a few images that a user can have presented and it's extremely advantageous to me to be able to just pass in an id and then have that image be presented to the user. (One use case: Articles in the system have images associated…
J. Doe
  • 53
  • 1
  • 5
5
votes
1 answer

How to blur the input provided in semantic-ui-react?

With mouse click everything works, but I want it to work with keyboard I want input to be unfocused/blurred when I press downKey while sitting in the input component. This is my input component import { Input } from 'semantic-ui-react';
Sabbiu Shah
  • 999
  • 3
  • 13
  • 22
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
  • 558
  • 1
  • 6
  • 21
5
votes
2 answers

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
  • 11,619
  • 29
  • 119
  • 238
5
votes
5 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
  • 105
  • 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,157
  • 10
  • 32
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
  • 197
  • 1
  • 12
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
  • 11,619
  • 29
  • 119
  • 238
5
votes
1 answer

How to use semantic-ui-react with redux-form?

Right now I use ReduxForm's Field component and apply raw Semantic UI classes. But I then came across Semantic UI React, which makes things a lot easier -- you can just use React components that have the semantic ui style. How would you go about…
nbkhope
  • 6,516
  • 2
  • 32
  • 53
4
votes
1 answer

Allow only number in Semantic UI React Form Input

I have created a currency input React component to allow the user to enter numeric values. I made the input type to "number". This only works in Chrome (user can still enter non-numeric values in Firefox). CurrencyInput Component: import React…
Joshua
  • 2,105
  • 6
  • 36
  • 54
4
votes
2 answers

Error Cannot read property 'left' of undefined in React Semantic UI Popup with Styled Component

I have a styled component like such: import styled from 'styled-components'; const TagIcon = styled(Icon).attrs({ name: 'tag', })` cursor: pointer; font-size: 14px !important; ` If I use this in a semantic-ui-react layout, it works fine in…
reactive-core
  • 1,051
  • 1
  • 7
  • 12
4
votes
1 answer

In React Is there a way to change the background color of a parent Label tag on a Radio Input checked?

I am using React Semantic UI. In css I am trying to change the Background color of a Parent label of an input, so when the radio button is clicked it changes colors. I am hiding the radio button with display none. Since the label gives it a nice…
Bama
  • 548
  • 2
  • 18
4
votes
1 answer

Custom Loader does not get applied with respect to react-table

I am trying to over ride the default loader provided by react-table with the Spinner provided by the semantic-ui-react . But this does not seem like working. I have maintained three components; one is the App, one for Data Grid and the other for the…
VJR08
  • 5,503
  • 5
  • 21
  • 48
4
votes
2 answers

How can I make semantic-ui-react Tab click use a react-router NavLink to update the URL?

I'm using semantic-ui's Tab component and I have different components in each tab's pane. When I click on a tab, I would like the URL to change to "/tabname" so that a specific tab can be bookmarked by users who only need the functionality in that…
voidmind
  • 99
  • 1
  • 4
1 2 3
…
56 57