Skip to content

Commit 3c8d5ef

Browse files
dgolovindgolovin
committed
Restore cluster editor files
Signed-off-by: Denis Golovin dgolovin@redhat.com
1 parent a4cf9db commit 3c8d5ef

File tree

4 files changed

+947
-3
lines changed

4 files changed

+947
-3
lines changed

‎src/webview/cluster/app/cluster.style.tsx‎

Lines changed: 72 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,72 @@
1+
/*-----------------------------------------------------------------------------------------------
2+
* Copyright (c) Red Hat, Inc. All rights reserved.
3+
* Licensed under the MIT License. See LICENSE file in the project root for license information.
4+
*-----------------------------------------------------------------------------------------------*/
5+
6+
import { Theme, createStyles } from '@material-ui/core/styles';
7+
8+
export default (theme: Theme) =>
9+
createStyles({
10+
menuButton: {
11+
marginRight: theme.spacing(2),
12+
},
13+
title: {
14+
flexGrow: 1,
15+
fontSize: '1.25em'
16+
},
17+
iconContainer: {
18+
height: 60,
19+
marginBottom: '3em',
20+
marginTop: '2em'
21+
},
22+
textWhite: {
23+
marginBottom: '20px!important',
24+
textAlign: 'left'
25+
},
26+
App: {
27+
textAlign: 'center'
28+
},
29+
rowBody: {
30+
padding: '0 10em 0 10em'
31+
},
32+
cardContainer: {
33+
display: 'flex',
34+
justifyContent: 'center'
35+
},
36+
cardTransform: {
37+
width: '27em',
38+
marginRight: theme.spacing(4),
39+
position: 'relative',
40+
transform: 'scale(0.95)',
41+
'&:hover': {
42+
transform: 'scale(1)',
43+
boxShadow: '5px 20px 30px rgba(0,0,0,0.2)'
44+
}
45+
},
46+
cardHeader: {
47+
backgroundColor: '#00586d!important',
48+
padding: theme.spacing(2),
49+
borderBottom: '0 solid transparent'
50+
},
51+
cardButton: {
52+
display: 'block',
53+
marginBottom: theme.spacing(2)
54+
},
55+
button: {
56+
color: 'white',
57+
backgroundColor: '#EE0000',
58+
'&:hover': {
59+
backgroundColor: '#BE0000',
60+
},
61+
textTransform: "none"
62+
},
63+
cardContent: {
64+
background: 'var(--vscode-list-inactiveSelectionBackground)',
65+
border: '1px solid var(--vscode-list-inactiveSelectionBackground)',
66+
color: 'var(--vscode-foreground)'
67+
},
68+
image: {
69+
maxHeight: '100%',
70+
maxWidth: '100%'
71+
}
72+
})

‎src/webview/cluster/app/cluster.tsx‎

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -16,8 +16,8 @@ import {
1616
Tooltip,
1717
Typography} from '@material-ui/core';
1818

19-
import AddClusterView from './crc';
20-
import clusterStyle from './types.style';
19+
import AddClusterView from './clusterView';
20+
import clusterStyle from './cluster.style';
2121
import './images/logo.png';
2222

2323
const useStyles = makeStyles(clusterStyle);
@@ -58,7 +58,7 @@ const clusterTypes = [
5858
const vscodeApi = window.vscodeApi;
5959

6060
// eslint-disable-next-line @typescript-eslint/explicit-function-return-type
61-
export default function Editor() {
61+
export default function Header() {
6262
const classes = useStyles();
6363
const [showWizard, setShowWizard] = React.useState(false);
6464

‎src/webview/cluster/app/clusterView.style.tsx‎

Lines changed: 186 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,186 @@
1+
/*-----------------------------------------------------------------------------------------------
2+
* Copyright (c) Red Hat, Inc. All rights reserved.
3+
* Licensed under the MIT License. See LICENSE file in the project root for license information.
4+
*-----------------------------------------------------------------------------------------------*/
5+
6+
import { Theme, createStyles } from '@material-ui/core/styles';
7+
8+
export const useStyles = (theme: Theme) =>
9+
createStyles({
10+
root: {
11+
textAlign: 'left',
12+
'& .MuiPaper-root': {
13+
backgroundColor: 'var(--vscode-editor-background)',
14+
color: 'var(--vscode-foreground)'
15+
},
16+
'& .MuiTextField-root': {
17+
margin: theme.spacing(1),
18+
width: '25ch',
19+
},
20+
'& .MuiStepContent-root': {
21+
paddingLeft: theme.spacing(5)
22+
},
23+
'& .MuiStepper-root': {
24+
marginLeft: theme.spacing(4),
25+
backgroundColor: 'var(--vscode-editor-background)'
26+
},
27+
'& .MuiButton-root': {
28+
textTransform: 'none'
29+
},
30+
'& .MuiFormLabel-root': {
31+
color: 'var(--vscode-input-foreground)'
32+
},
33+
'& .MuiStepIcon-root.MuiStepIcon-active': {
34+
color: '#0066CC'
35+
},
36+
'& .MuiStepIcon-root.MuiStepIcon-completed': {
37+
color: '#0066CC'
38+
},
39+
'& .MuiButton-containedPrimary': {
40+
backgroundColor: '#0066CC'
41+
},
42+
'& .MuiStepLabel-iconContainer': {
43+
paddingRight: theme.spacing(2)
44+
},
45+
'& .MuiStepLabel-label.MuiStepLabel-active': {
46+
color: 'var(--vscode-foreground)'
47+
},
48+
'& .MuiStepLabel-label': {
49+
color: 'var(--vscode-foreground)'
50+
},
51+
'& .MuiTypography-colorTextSecondary': {
52+
color: 'var(--vscode-foreground)'
53+
},
54+
'& .MuiButton-root.Mui-disabled': {
55+
color: 'var(--vscode-button-secondaryForeground)'
56+
},
57+
'& .MuiBadge-anchorOriginTopLeftCircle' : {
58+
top: '46%',
59+
left: '40%'
60+
},
61+
'& .MuiInputBase-root' :{
62+
color: 'var(--vscode-input-foreground)'
63+
},
64+
'& .MuiFormHelperText-root' : {
65+
color: 'var(--vscode-input-foreground)'
66+
}
67+
},
68+
button: {
69+
marginTop: theme.spacing(1),
70+
marginRight: theme.spacing(1),
71+
backgroundColor: 'var(--vscode-button-background)',
72+
color: 'var(--vscode-button-foreground)',
73+
'&:hover' :{
74+
backgroundColor: 'var(--vscode-button-hoverBackground)',
75+
cursor: 'pointer'
76+
},
77+
'&:focus': {
78+
backgroundColor: 'var(--vscode-button-hoverBackground)',
79+
cursor: 'pointer'
80+
},
81+
'&:disabled' :{
82+
opacity: 0.4
83+
}
84+
},
85+
buttonSecondary: {
86+
marginTop: theme.spacing(1),
87+
marginRight: theme.spacing(1),
88+
backgroundColor: 'var(--vscode-button-secondaryBackground)',
89+
color: 'var(--vscode-button-secondaryForeground)',
90+
'&:hover' :{
91+
backgroundColor: 'var(--vscode-button-secondaryHoverBackground)',
92+
cursor: 'pointer'
93+
},
94+
'&:focus': {
95+
backgroundColor: 'var(--vscode-button-secondaryHoverBackground)',
96+
cursor: 'pointer'
97+
},
98+
'&:disabled' :{
99+
opacity: 0.4
100+
}
101+
},
102+
actionsContainer: {
103+
marginBottom: theme.spacing(2),
104+
marginTop: theme.spacing(2)
105+
},
106+
resetContainer: {
107+
padding: theme.spacing(3),
108+
},
109+
formControl: {
110+
margin: theme.spacing(1),
111+
minWidth: 120,
112+
width: '40%'
113+
},
114+
uploadLabel: {
115+
marginTop: theme.spacing(2)
116+
},
117+
textContainer: {
118+
color: 'var(--vscode-input-foreground)',
119+
fontFamily: 'var(--vscode-editor-font-family)'
120+
},
121+
icon: {
122+
verticalAlign: "bottom",
123+
height: 20,
124+
width: 20
125+
},
126+
details: {
127+
alignItems: "center"
128+
},
129+
column: {
130+
flexBasis: "40%"
131+
},
132+
helper: {
133+
borderLeft: `2px solid ${theme.palette.divider}`,
134+
padding: theme.spacing(1, 1)
135+
},
136+
heading: {
137+
fontSize: theme.typography.pxToRem(15)
138+
},
139+
margin: {
140+
margin: theme.spacing(1)
141+
},
142+
loadingStatusText : {
143+
marginBottom: 10,
144+
padding: 20,
145+
textAlign: 'center'
146+
},
147+
blockquoteText : {
148+
display: 'block',
149+
flexDirection: 'column',
150+
margin: '15px 0',
151+
padding: '8px 12px',
152+
background: 'var(--vscode-textBlockQuote-background)',
153+
},
154+
menuButton: {
155+
marginRight: theme.spacing(2)
156+
}
157+
});
158+
159+
export const badgeStyles = (theme: Theme) => ({
160+
badge: {
161+
backgroundColor: '#44b700',
162+
color: '#44b700',
163+
boxShadow: `0 0 0 2px ${theme.palette.background.paper}`,
164+
'&::after': {
165+
position: 'absolute',
166+
top: 0,
167+
left: 0,
168+
width: '100%',
169+
height: '100%',
170+
borderRadius: '50%',
171+
animation: '$ripple 1.2s infinite ease-in-out',
172+
border: '1px solid currentColor',
173+
content: '""',
174+
},
175+
},
176+
'@keyframes ripple': {
177+
'0%': {
178+
transform: 'scale(.8)',
179+
opacity: 1,
180+
},
181+
'100%': {
182+
transform: 'scale(2.4)',
183+
opacity: 0,
184+
},
185+
},
186+
})

0 commit comments

Comments
 (0)
⚡