Merge pull request #80 from Siddhant-K-code/master

1 files changed, 33 insertions, 31 deletions

diff --git a/frontend/src/components/Options.js b/frontend/src/components/Options.js
index 97d3127..3c55a20 100644
--- a/frontend/src/components/Options.js
+++ b/frontend/src/components/Options.js
@@ -1,39 +1,41 @@
-import React from 'react';
-import styled from 'styled-components'
-import { Password, Expiry, Language } from './Inputs'
+import React from "react";
+import styled from "styled-components";
+import { Password, Expiry, Language } from "./Inputs";
 
 const Flex = styled.div`
-    float: right;
-    display: flex;
-    flex-direction: row;
-    transform: translateY(0.2em);
-    
+  float: right;
+  display: flex;
+  flex-direction: row;
+  transform: translateY(0.2em);
+
+  @media (min-width: 650px) {
     & > *:not(:first-child) {
       margin-left: 2em;
     }
+  }
 
-    @media (max-width: 850px) {
-        float: none !important;
-    }
-`
+  @media (max-width: 650px) {
+    position: relative;
+    float: none !important;
+    flex-direction: column;
+  }
+`;
 
-const OptionsContainer = ({pass, lang, expiry, onPassChange, onLangChange, onExpiryChange}) => {
-    return (
-        <Flex>
-            <Password
-                value={pass}
-                onChange={onPassChange}
-                id="passwordInput" />
-            <Language
-                value={lang}
-                onChange={onLangChange}
-                id="langInput" />
-            <Expiry
-                value={expiry}
-                onChange={onExpiryChange}
-                id="expiryInput" />
-        </Flex>
-    );
-}
+const OptionsContainer = ({
+  pass,
+  lang,
+  expiry,
+  onPassChange,
+  onLangChange,
+  onExpiryChange,
+}) => {
+  return (
+    <Flex>
+      <Password value={pass} onChange={onPassChange} id="passwordInput" />
+      <Language value={lang} onChange={onLangChange} id="langInput" />
+      <Expiry value={expiry} onChange={onExpiryChange} id="expiryInput" />
+    </Flex>
+  );
+};
 
-export default OptionsContainer
\ No newline at end of file
+export default OptionsContainer;