diff --git a/src/components/AppHeader/AppHeader.css b/src/components/AppHeader/AppHeader.css index 445ec3db..e974826d 100644 --- a/src/components/AppHeader/AppHeader.css +++ b/src/components/AppHeader/AppHeader.css @@ -19,7 +19,7 @@ .leftIcon span { /* stylelint-disable */ - color: var(--foregroundAltColor) !important; + color: var(--textColor) !important; font-size: 30px !important; /* stylelint-enable */ diff --git a/src/components/EntryListing/EntryListing.css b/src/components/EntryListing/EntryListing.css index 5021b6c5..2f8626f0 100644 --- a/src/components/EntryListing/EntryListing.css +++ b/src/components/EntryListing/EntryListing.css @@ -1,14 +1,17 @@ .card { + flex-grow: 1; + flex-basis: 31%; + flex-basis: 300px; overflow: hidden; - margin-bottom: 10px; - margin-left: 15px; + margin-bottom: 16px; + margin-left: 16px; max-height: 290px; - width: 240px; cursor: pointer; } .cardImage { - width: 240px; + margin: -16px -24px 16px -24px; + width: calc(100% + 24px + 24px); height: 135px; background-position: center center; background-size: cover; @@ -18,7 +21,7 @@ .cardsGrid { display: flex; flex-flow: row wrap; - margin-left: -15px; + margin-left: -16px; } .cardList { diff --git a/src/components/UI/card/Card.css b/src/components/UI/card/Card.css index 12f061ba..44bbf74b 100644 --- a/src/components/UI/card/Card.css +++ b/src/components/UI/card/Card.css @@ -6,6 +6,7 @@ border: 1px solid #f7f8f8; transition: all .1s ease-in-out; transform: translateY(0); + padding: 16px 24px; } .card:hover { @@ -13,7 +14,7 @@ transform: translateY(-8px); } -.card > *:not(iframe, video, img, header, footer) { +/*.card > *:not(iframe, video, img, header, footer) { margin-right: 10px; margin-left: 10px; } @@ -24,20 +25,21 @@ .card > *:not(iframe, video, img, header, footer):last-child { margin-bottom: 10px; -} +}*/ .card > iframe, .card > video, .card > img { - max-width: 100%; + margin: -16px -24px 16px -24px; + width: calc(100% + 16px + 16px); } .card h1 { font-size: 16px; - font-weight: 500; + font-weight: 600; letter-spacing: 0; line-height: 24px; - margin: 15px 0; + margin: 0; padding: 0; border: none; color: var(--defaultColor); @@ -49,6 +51,5 @@ letter-spacing: 0; line-height: 24px; padding: 0; - color: var(--defaultColor); - opacity: .5; + color: #8c8c8c; } diff --git a/src/components/UI/theme.css b/src/components/UI/theme.css index 4032f7ad..d80fad8d 100644 --- a/src/components/UI/theme.css +++ b/src/components/UI/theme.css @@ -14,7 +14,7 @@ --dropShadow: 0 2px 4px 0 rgba(19, 39, 48, .12); --topmostZindex: 99999; --foregroundAltColor: #fff; - --backgroundAltColor: #191919; + --backgroundAltColor: #f8f9fa; --textFieldBorderColor: #e7e7e7; --highlightFGColor: #fff; --highlightBGColor: #3ab7a5; diff --git a/src/index.css b/src/index.css index cbfa2c28..c652c4a1 100644 --- a/src/index.css +++ b/src/index.css @@ -25,11 +25,13 @@ h1, h2, h3, h4, h5, h6, p { } h1 { - color: #3ab7a5; - border-bottom: 1px solid #3ab7a5; margin: 30px auto 25px; padding-bottom: 15px; - font-size: 25px; + font-size: 20px; + font-weight: 600; + color: #313D3E; + letter-spacing: 0; + line-height: 24px; } img {