From c960d16dcff9711362999307c9554dea8c30c8fd Mon Sep 17 00:00:00 2001
From: Evelyn Eastmond <evhan55@gmail.com>
Date: Mon, 1 Oct 2018 19:07:39 -0400
Subject: [PATCH] Fixing / experimenting with alert css.
---
src/components/alerts/alert.css | 4 ++--
src/components/alerts/alert.jsx | 16 ++++++++++------
2 files changed, 12 insertions(+), 8 deletions(-)
diff --git a/src/components/alerts/alert.css b/src/components/alerts/alert.css
index 250c79d2a..2858d0c99 100644
--- a/src/components/alerts/alert.css
+++ b/src/components/alerts/alert.css
@@ -12,7 +12,7 @@
border: 1px solid #FF8C1A;
border-radius: 8px;
padding: 12px;
- box-shadow: 2px 2px 2px 2px rgba(255, 140, 26, 0.25);
+ box-shadow: 0px 0px 0px 2px rgba(255, 140, 26, 0.25);
margin-bottom: 7px;
}
@@ -29,6 +29,6 @@
width: 100%;
}
-.alert-remove-button {
+.alert-close-button {
color: #FF8C1A;
}
diff --git a/src/components/alerts/alert.jsx b/src/components/alerts/alert.jsx
index 63ac06f51..48459dc22 100644
--- a/src/components/alerts/alert.jsx
+++ b/src/components/alerts/alert.jsx
@@ -1,8 +1,9 @@
import React from 'react';
+import {FormattedMessage} from 'react-intl';
import PropTypes from 'prop-types';
import Box from '../box/box.jsx';
-import Button from '../button/button.jsx';
+import CloseButton from '../close-button/close-button.jsx';
import styles from './alert.css';
@@ -22,13 +23,16 @@ const AlertComponent = ({
/>
) : null}
{message}
+ <FormattedMessage
+ defaultMessage="Tutorials"
+ description="Title for button to return to tutorials library"
+ id="gui.cards.all-tutorials"
+ />
</div>
- <Button
- className={styles.alertRemoveButton}
+ <CloseButton
+ size={CloseButton.SIZE_SMALL}
onClick={onCloseAlert}
- >
- {'x'}
- </Button>
+ />
</Box>
);
--
GitLab