feat: added customizations for twitter and facebook

Author: Sagar Jain

src/pages/about.tsx

@@ -72,11 +72,11 @@ export const AboutPage = (props: Props) => {
 					</Row>
 				</Card>
 				<Instagram allInstaNode={props.data.allInstaNode} />
-				<Row type="flex" align="middle" gutter={36}>
-					<Col xs={24} sm={24} md={12} lg={12} xl={12} xxl={12}>
+				<Row type="flex" align="middle" gutter={36} className="margin-top-36">
+					<Col xs={24} sm={24} md={12} lg={12} xl={12} xxl={12} className="align-center">
 						<Twitter />
 					</Col>
-					<Col xs={24} sm={24} md={12} lg={12} xl={12} xxl={12}>
+					<Col xs={24} sm={24} md={12} lg={12} xl={12} xxl={12} className="align-center">
 						<Facebook />
 					</Col>
 				</Row>

src/pages/index.tsx

@@ -45,11 +45,11 @@ export const IndexPage = (props: Props) => {
 					</Row>
 				</Card>
 				<Instagram allInstaNode={props.data.allInstaNode} />
-				<Row type="flex" align="middle" gutter={36}>
-					<Col xs={24} sm={24} md={12} lg={12} xl={12} xxl={12}>
+				<Row type="flex" align="middle" gutter={36} className="margin-top-36">
+					<Col xs={24} sm={24} md={12} lg={12} xl={12} xxl={12} className="align-center">
 						<Twitter />
 					</Col>
-					<Col xs={24} sm={24} md={12} lg={12} xl={12} xxl={12}>
+					<Col xs={24} sm={24} md={12} lg={12} xl={12} xxl={12} className="align-center">
 						<Facebook />
 					</Col>
 				</Row>

src/templates/BlogPost.tsx

@@ -72,11 +72,11 @@ export const BlogPost = (props: Props) => {
 				)}
 			</div>
 			<Instagram allInstaNode={props.data.allInstaNode} />
-			<Row type="flex" align="middle" gutter={36}>
-				<Col xs={24} sm={24} md={12} lg={12} xl={12} xxl={12}>
+			<Row type="flex" align="middle" gutter={36} className="margin-top-36">
+				<Col xs={24} sm={24} md={12} lg={12} xl={12} xxl={12} className="align-center">
 					<Twitter />
 				</Col>
-				<Col xs={24} sm={24} md={12} lg={12} xl={12} xxl={12}>
+				<Col xs={24} sm={24} md={12} lg={12} xl={12} xxl={12} className="align-center">
 					<Facebook />
 				</Col>
 			</Row>

src/templates/BlogPosts.tsx

@@ -83,11 +83,11 @@ export const IndexPage = (props: Props) => {
 				)}
 			</div>
 			<Instagram allInstaNode={props.pathContext.allInstaNode} />
-			<Row type="flex" align="middle" gutter={36}>
-				<Col xs={24} sm={24} md={12} lg={12} xl={12} xxl={12}>
+			<Row type="flex" align="middle" gutter={36} className="margin-top-36">
+				<Col xs={24} sm={24} md={12} lg={12} xl={12} xxl={12} className="align-center">
 					<Twitter />
 				</Col>
-				<Col xs={24} sm={24} md={12} lg={12} xl={12} xxl={12}>
+				<Col xs={24} sm={24} md={12} lg={12} xl={12} xxl={12} className="align-center">
 					<Facebook />
 				</Col>
 			</Row>