From c10decbbd5c6c1f4e8dc8df4e3326a217100c278 Mon Sep 17 00:00:00 2001
From: romanhotsiy <gotsijroman@gmail.com>
Date: Tue, 13 Oct 2020 16:14:09 +0300
Subject: [PATCH] fix: ie11 fix

---
 src/common-elements/fields-layout.ts                     | 9 ++++++++-
 .../SecurityRequirement/SecurityRequirement.tsx          | 2 +-
 src/styled-components.ts                                 | 4 ++--
 3 files changed, 11 insertions(+), 4 deletions(-)

diff --git a/src/common-elements/fields-layout.ts b/src/common-elements/fields-layout.ts
index 34f20a1c..e6985f15 100644
--- a/src/common-elements/fields-layout.ts
+++ b/src/common-elements/fields-layout.ts
@@ -142,11 +142,18 @@ export const PropertiesTable = styled.table`
 
   ${media.lessThan('small')`
     display: block;
-    > tr, > tbody, tr {
+    > tr, > tbody > tr {
       display: block;
     }
   `}
 
+  ${media.lessThan('small', false, ' and (-ms-high-contrast:none)')`
+    td {
+      float: left;
+      width: 100%;
+    }
+  `}
+
   &
     ${InnerPropertiesWrap},
     &
diff --git a/src/components/SecurityRequirement/SecurityRequirement.tsx b/src/components/SecurityRequirement/SecurityRequirement.tsx
index ef1bcaab..3a52ad81 100644
--- a/src/components/SecurityRequirement/SecurityRequirement.tsx
+++ b/src/components/SecurityRequirement/SecurityRequirement.tsx
@@ -85,7 +85,7 @@ export class SecurityRequirement extends React.PureComponent<SecurityRequirement
 }
 
 const AuthHeaderColumn = styled.div`
-  flex: 1;
+  flex: 1 1 auto;
 `;
 
 const SecuritiesColumn = styled.div`
diff --git a/src/styled-components.ts b/src/styled-components.ts
index 9db27997..8acd13d4 100644
--- a/src/styled-components.ts
+++ b/src/styled-components.ts
@@ -13,10 +13,10 @@ const {
 } = styledComponents as styledComponents.ThemedStyledComponentsModule<ResolvedThemeInterface>;
 
 export const media = {
-  lessThan(breakpoint, print?: boolean) {
+  lessThan(breakpoint, print?: boolean, extra?: string) {
     return (...args) => css`
       @media ${print ? 'print, ' : ''} screen and (max-width: ${props =>
-          props.theme.breakpoints[breakpoint]}) {
+          props.theme.breakpoints[breakpoint]})${extra || ''} {
         ${(css as any)(...args)};
       }
     `;