From a5f790d1d79f1f6599b8119ab5f865a24448512a Mon Sep 17 00:00:00 2001 From: Sean Yesmunt <sean@lbry.io> Date: Wed, 16 Jan 2019 11:16:38 -0500 Subject: [PATCH] fix: rewards table style on small screens --- .../component/rewardListClaimed/view.jsx | 2 +- src/renderer/scss/component/_table.scss | 22 +++++++++++++++++-- 2 files changed, 21 insertions(+), 3 deletions(-) diff --git a/src/renderer/component/rewardListClaimed/view.jsx b/src/renderer/component/rewardListClaimed/view.jsx index 6874ac59c..245581242 100644 --- a/src/renderer/component/rewardListClaimed/view.jsx +++ b/src/renderer/component/rewardListClaimed/view.jsx @@ -28,7 +28,7 @@ const RewardListClaimed = (props: Props) => { <h2 className="card__title">Claimed Rewards</h2> </header> - <table className="card__content table table--stretch"> + <table className="table table--rewards table--stretch"> <thead> <tr> <th>{__('Title')}</th> diff --git a/src/renderer/scss/component/_table.scss b/src/renderer/scss/component/_table.scss index b849c4ab7..a839097c7 100644 --- a/src/renderer/scss/component/_table.scss +++ b/src/renderer/scss/component/_table.scss @@ -27,8 +27,8 @@ color: inherit; } - &:not(:first-of-type) { - padding-right: var(--spacing-vertical-medium); + &:not(:last-of-type) { + padding-right: var(--spacing-vertical-large); } .btn:not(.btn--link) { @@ -122,3 +122,21 @@ width: 15%; } } + +.table--rewards { + td:nth-of-type(1) { + width: 40%; + } + + td:nth-of-type(2) { + width: 17.5%; + } + + td:nth-of-type(3) { + width: 17.5%; + } + + td:nth-of-type(4) { + width: 25%; + } +}