diff --git a/src/components/layout/Col/index.jsx b/src/components/layout/Col/index.jsx
index 1e8137c5..f9ae8d87 100644
--- a/src/components/layout/Col/index.jsx
+++ b/src/components/layout/Col/index.jsx
@@ -16,7 +16,8 @@ type Props = {
around?: 'xs' | 'sm' | 'md' | 'lg',
between?: 'xs' | 'sm' | 'md' | 'lg',
margin?: 'sm' | 'md' | 'lg' | 'xl',
- layout?: 'inherit' | 'block',
+ layout?: 'inherit' | 'block' | 'column',
+ overflow?: boolean,
xs?: number | boolean,
sm?: number | boolean,
md?: number | boolean,
@@ -30,7 +31,7 @@ type Props = {
}
const Col = ({
- children, margin, layout = 'inherit',
+ children, margin, layout = 'inherit', overflow,
xs, sm, md, lg,
start, center, end, top, middle, bottom, around, between,
xsOffset, smOffset, mdOffset, lgOffset,
@@ -55,6 +56,7 @@ const Col = ({
smOffset ? capitalize(smOffset, 'smOffset') : undefined,
mdOffset ? capitalize(mdOffset, 'mdOffset') : undefined,
lgOffset ? capitalize(lgOffset, 'lgOffset') : undefined,
+ { overflow },
layout,
props.className,
)
diff --git a/src/components/layout/Col/index.scss b/src/components/layout/Col/index.scss
index 91fb43d6..30d06ace 100644
--- a/src/components/layout/Col/index.scss
+++ b/src/components/layout/Col/index.scss
@@ -12,6 +12,15 @@
display: block;
}
+.column {
+ display: flex;
+ flex-direction: column;
+}
+
+.overflow {
+ overflow: hidden;
+}
+
.marginSm {
margin-bottom: $sm;
}
diff --git a/src/routes/safe/component/Safe/assets/gnosis_safe.svg b/src/routes/safe/component/Safe/assets/gnosis_safe.svg
new file mode 100644
index 00000000..c7bf5502
--- /dev/null
+++ b/src/routes/safe/component/Safe/assets/gnosis_safe.svg
@@ -0,0 +1,17 @@
+
diff --git a/src/routes/safe/component/Safe/index.jsx b/src/routes/safe/component/Safe/index.jsx
index 442373e5..9ec0726a 100644
--- a/src/routes/safe/component/Safe/index.jsx
+++ b/src/routes/safe/component/Safe/index.jsx
@@ -3,6 +3,7 @@ import * as React from 'react'
import Block from '~/components/layout/Block'
import Col from '~/components/layout/Col'
import Bold from '~/components/layout/Bold'
+import Img from '~/components/layout/Img'
import Paragraph from '~/components/layout/Paragraph'
import Row from '~/components/layout/Row'
import { type Safe } from '~/routes/safe/store/model/safe'
@@ -14,6 +15,8 @@ import Owners from './Owners'
import Confirmations from './Confirmations'
import DailyLimit from './DailyLimit'
+const safeIcon = require('./assets/gnosis_safe.svg')
+
type SafeProps = {
safe: Safe,
balance: string,
@@ -21,7 +24,6 @@ type SafeProps = {
const listStyle = {
width: '100%',
- minWidth: '485px',
}
class GnoSafe extends React.PureComponent {
@@ -29,8 +31,8 @@ class GnoSafe extends React.PureComponent {
const { safe, balance } = this.props
return (
-
-
+
+
@@ -39,15 +41,15 @@ class GnoSafe extends React.PureComponent {
-
+
{safe.name.toUpperCase()}
-
- Extra info will be placed here
-
+
+
+
)