semantic-ui-react
does not work on my browser and I'm not sure why - there aren't any errors or problems in the console.
This is the component from the library semantic-ui
; it's from this file UptimeGuarantee.js
import React from 'react'
import { Header, Icon , Image} from 'semantic-ui-react'
const HeaderExampleUsersIcon = () => (
<div>
<Header as='h2' icon textAlign='center'>
<Icon name='users' circular />
<Header.Content>
Friends
</Header.Content>
</Header>
<Image centered size='large' src='/assets/images/wireframe/centered-paragraph.png' />
</div>
)
export default HeaderExampleUsersIcon
and on my App.js I call this component:
import React, { Component , PropTypes} from 'react';
import { Button } from 'semantic-ui-react';
import logo from './logo.svg';
import './App.css';
import HeaderExampleUsersIcon from './UptimeGuarantee'
class App extends Component {
render() {
return (
<div className="App">
<div className="App-header">
<img src={logo} className="App-logo" alt="logo" />
<h2>Welcome to React</h2>
</div>
<p className="App-intro">To get started, edit <code>src/App.js</code> and save to reload.</p>
<Button primary>Primary</Button>
<HeaderExampleUsersIcon />
</div>
);
}
}
export default App;
Result:
Semantic UI is not dead. There is a community that wants to keep it going. I think it would be helpful to create an RFC repo to discuss future direction of the project and the planning of the implementations of the decisions we make.
Option 1: Package Managerx require Semantic UI React >=0.81. 0. The Semantic UI CSS package is automatically synced with the main Semantic UI repository to provide a lightweight CSS only version of Semantic UI. If you are using TypeScript, you don't need to install anything, typings are included with the package.
Semantic UI React only generates elements using react-dom . The only way to use it with React Native would be if the entire library was updated to render native elements for other target environments.
semantic-ui-react is only components without styles and fonts.
You should import styles from semantic-ui-css
import 'semantic-ui-css/semantic.min.css';
or add styles to html
<link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/semantic-ui/2.2.11/semantic.min.css"></link>
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With