File tree 2 files changed +23
-42
lines changed
2 files changed +23
-42
lines changed Original file line number Diff line number Diff line change 1
1
import { styledTheme } from '@pluralsh/design-system'
2
- import { Div , Flex , Img } from 'honorable'
3
-
4
- import { LOGIN_SIDEBAR_IMAGE } from '../constants'
5
2
6
3
import { Footer , FooterBalancer } from './LoginFooter'
7
4
@@ -13,45 +10,29 @@ export const LOGIN_BREAKPOINT = `@media screen and (min-width: ${
13
10
14
11
export function LoginPortal ( { children } : any ) {
15
12
return (
16
- < Flex height = "100vh" >
17
- { /* LEFT SIDE */ }
18
- < Flex
19
- direction = "column"
20
- align = "center"
21
- background = "fill-one"
22
- display-desktop-down = "none"
23
- overflow = "hidden"
24
- width = { 504 }
25
- height = "100%"
26
- >
27
- < Img
28
- src = { LOGIN_SIDEBAR_IMAGE }
29
- width = "100%"
30
- height = "100%"
31
- objectFit = "cover"
32
- objectPosition = "top center"
33
- borderRight = "1px solid border-fill-two"
34
- />
35
- </ Flex >
36
- { /* RIGHT SIDE */ }
37
- < Flex
38
- overflow = "auto"
39
- flexDirection = "column"
40
- grow = { 1 }
41
- shrink = { 1 }
42
- paddingHorizontal = { RIGHT_CONTENT_PAD }
13
+ < div
14
+ css = { {
15
+ display : 'flex' ,
16
+ flexDirection : 'column' ,
17
+ flexGrow : 1 ,
18
+ flexShrink : 1 ,
19
+ height : '100vh' ,
20
+ overflow : 'auto' ,
21
+ paddingLeft : RIGHT_CONTENT_PAD ,
22
+ paddingRight : RIGHT_CONTENT_PAD ,
23
+ } }
24
+ >
25
+ < FooterBalancer />
26
+ < div
27
+ css = { {
28
+ margin : 'auto' ,
29
+ maxWidth : RIGHT_CONTENT_MAX_WIDTH ,
30
+ width : '100%' ,
31
+ } }
43
32
>
44
- < FooterBalancer />
45
- < Div
46
- maxWidth = { RIGHT_CONTENT_MAX_WIDTH }
47
- width = "100%"
48
- marginVertical = "auto"
49
- marginHorizontal = "auto"
50
- >
51
- { children }
52
- </ Div >
53
- < Footer />
54
- </ Flex >
55
- </ Flex >
33
+ { children }
34
+ </ div >
35
+ < Footer />
36
+ </ div >
56
37
)
57
38
}
You can’t perform that action at this time.
0 commit comments