Fixing / experimenting with alert css.

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;
 }

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>
 );