diff --git a/src/components/Button/Button.css b/src/components/Button/Button.css
index e0f2fad4..e0a7c357 100644
--- a/src/components/Button/Button.css
+++ b/src/components/Button/Button.css
@@ -72,3 +72,30 @@
cursor: auto;
}
}
+
+.inlineButton {
+ display: inline-block;
+ padding: 0;
+
+ /* fill colors should be in sync with marketplace color palette */
+ background-color: transparent;
+
+ /* border-width should be in sync with marketplace strike-widths */
+ border-width: 0px;
+
+ /* Font configuration */
+ text-decoration: underline;
+
+ /* Hovers */
+ &:enabled {
+ cursor: pointer;
+ }
+ &:enabled:hover,
+ &:enabled:active {
+ background-color: transparent;
+ }
+ &:disabled {
+ background-color: transparent;
+ cursor: auto;
+ }
+}
diff --git a/src/components/Button/Button.js b/src/components/Button/Button.js
index f85739c0..c67ac319 100644
--- a/src/components/Button/Button.js
+++ b/src/components/Button/Button.js
@@ -29,7 +29,9 @@ Button.propTypes = {
export default Button;
export const FlatButton = props => ;
-
FlatButton.defaultProps = { className: '' };
-
FlatButton.propTypes = { className: string };
+
+export const InlineButton = props => ;
+InlineButton.defaultProps = { className: '' };
+InlineButton.propTypes = { className: string };
diff --git a/src/components/index.js b/src/components/index.js
index 6dbb6e15..88f67b13 100644
--- a/src/components/index.js
+++ b/src/components/index.js
@@ -2,7 +2,7 @@ import AddImages from './AddImages/AddImages';
import AuthorInfo from './AuthorInfo/AuthorInfo';
import Avatar from './Avatar/Avatar';
import BookingInfo from './BookingInfo/BookingInfo';
-import Button, { FlatButton } from './Button/Button';
+import Button, { FlatButton, InlineButton } from './Button/Button';
import CurrencyInput from './CurrencyInput/CurrencyInput';
import DateInput from './DateInput/DateInput';
import Discussion from './Discussion/Discussion';
@@ -43,6 +43,7 @@ export {
FilterPanel,
FlatButton,
HeroSection,
+ InlineButton,
Input,
LabeledField,
ListingCard,