aboutsummaryrefslogtreecommitdiffstats
path: root/packages/website/ts
diff options
context:
space:
mode:
authorEzekiel Aquino <ezekiel@bakkenbaeck.no>2018-12-12 22:06:37 +0800
committerEzekiel Aquino <ezekiel@bakkenbaeck.no>2018-12-12 22:06:37 +0800
commitd8e03b87d6e3152878902348f613ad006697c224 (patch)
treed86e21d085b272120265b5bfdae6d17c8c6a8b08 /packages/website/ts
parentf06c17cccca46298a4b2780c1963165c5020c878 (diff)
downloaddexon-sol-tools-d8e03b87d6e3152878902348f613ad006697c224.tar
dexon-sol-tools-d8e03b87d6e3152878902348f613ad006697c224.tar.gz
dexon-sol-tools-d8e03b87d6e3152878902348f613ad006697c224.tar.bz2
dexon-sol-tools-d8e03b87d6e3152878902348f613ad006697c224.tar.lz
dexon-sol-tools-d8e03b87d6e3152878902348f613ad006697c224.tar.xz
dexon-sol-tools-d8e03b87d6e3152878902348f613ad006697c224.tar.zst
dexon-sol-tools-d8e03b87d6e3152878902348f613ad006697c224.zip
Team page grid responsive style
Diffstat (limited to 'packages/website/ts')
-rw-r--r--packages/website/ts/@next/components/newLayout.tsx4
-rw-r--r--packages/website/ts/@next/pages/about/team.tsx8
2 files changed, 12 insertions, 0 deletions
diff --git a/packages/website/ts/@next/components/newLayout.tsx b/packages/website/ts/@next/components/newLayout.tsx
index 21f4271bd..cc1f725ba 100644
--- a/packages/website/ts/@next/components/newLayout.tsx
+++ b/packages/website/ts/@next/components/newLayout.tsx
@@ -98,6 +98,10 @@ export const WrapGrid = styled(Wrap)<WrapGridProps>`
display: flex;
flex-wrap: ${props => props.isWrapped && `wrap`};
justify-content: ${props => props.isCentered ? `center` : 'space-between'};
+
+ @media (max-width: 768px) {
+ width: 100%;
+ }
`;
Section.defaultProps = {
diff --git a/packages/website/ts/@next/pages/about/team.tsx b/packages/website/ts/@next/pages/about/team.tsx
index 821fa19a0..26813a01e 100644
--- a/packages/website/ts/@next/pages/about/team.tsx
+++ b/packages/website/ts/@next/pages/about/team.tsx
@@ -240,4 +240,12 @@ const StyledMember = styled.div`
object-fit: contain;
margin-bottom: 10px;
}
+
+ @media (max-width: 900px) {
+ width: calc(33.3333% - 30px);
+ }
+
+ @media (max-width: 600px) {
+ width: calc(50% - 15px);
+ }
`;