Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[Button] Add a link-button style #4805

Open
nZeus opened this issue Dec 2, 2016 · 10 comments
Open

[Button] Add a link-button style #4805

nZeus opened this issue Dec 2, 2016 · 10 comments

Comments

@nZeus
Copy link

nZeus commented Dec 2, 2016

Write know it's not possible to have a button that looks the same as an anchor.
Sometimes it's very good to use a <button> element that looks as an anchor/link.
Why?
Because buttons and links have different behavior in browsers. Clicking middle mouse button on a link opens a new tab, while clicking middle button on a button doesn't do anything.
This class would be very helpful for buttons in the tables (like "delete"/"edit" a row).

That's what I want to see in the end:
<button class="ui link">Text</button>

@brettstack
Copy link

While we wait for this to be implemented:

// ButtonLink/index.jsx
import React from 'react'
import { Button } from 'semantic-ui-react'
import './style.css'

const ButtonLink = ({
  className = '',
  ...props
}) => <Button
  basic
  color='blue'
  className={['link', className].join(' ')}
  {...props}
/>

ButtonLink.propTypes = {
  className: React.PropTypes.string
}

export default ButtonLink
// ButtonLink/style.css
.ui.button.basic.link, .ui.button.basic.link:hover, .ui.button.basic.link:focus {
  box-shadow: 0 0 !important;
}

@stale
Copy link

stale bot commented Feb 23, 2018

This issue has been automatically marked as stale because it has not had recent activity. It will be closed in 30 days if no further activity occurs. Thank you for your contributions.

@stale stale bot added the stale label Feb 23, 2018
@sag1v
Copy link

sag1v commented Feb 25, 2018

Actually i would love to see how semantic-ui would present a link to the ui.

@stale stale bot removed the stale label Feb 25, 2018
@christiansk
Copy link

Are there any plans to implement this?

@hubertguillemain
Copy link

Seems to be duplicate of #6229, which points to a PR waiting to be merged #6260
I'd also be in favour of the "tertiary" property in the master

@christiansk
Copy link

Great, thanks!

@jumpinjan
Copy link

Could the PR above please be merged into master and released? I could really use this button style

@sookwei93
Copy link

I need the Link button style too. Could anyone merged the PR asap please?

@lubber-de

This comment was marked as spam.

@mcbergsma
Copy link

@brettstack's solution worked well for me, only change I made was to add padding: unset; to the css so it fits into a line of text.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

No branches or pull requests

10 participants