Skip to content

Commit 274bee9

Browse files
aali309aali309
committed
pull common attributes to a common component
Signed-off-by: Atif Ali <atali@redhat.com> use pf Signed-off-by: Atif Ali <atali@redhat.com> Replaced inline styles with CSS classes Signed-off-by: Atif Ali <atali@redhat.com> enable or disable the edit buttons according to permission Signed-off-by: Atif Ali <atali@redhat.com>
1 parent 65876af commit 274bee9

File tree

3 files changed

+771
-334
lines changed

3 files changed

+771
-334
lines changed

‎src/gitops/components/application/ApplicationSetDetailsPage.scss‎

Lines changed: 219 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,219 @@
1+
.application-set-details-page {
2+
&__main-section {
3+
// PatternFly page main section styles
4+
}
5+
6+
&__body {
7+
// PatternFly flex layout styles
8+
}
9+
10+
&__pane-body {
11+
// Console pane body styles
12+
}
13+
14+
&__grid {
15+
// PatternFly grid styles
16+
}
17+
18+
&__grid-item {
19+
// PatternFly grid item styles
20+
}
21+
22+
&__header {
23+
margin-bottom: 24px;
24+
padding-left: 24px;
25+
padding-top: 24px;
26+
27+
&-title {
28+
font-size: 20px;
29+
font-weight: 600;
30+
margin-bottom: 16px;
31+
}
32+
}
33+
34+
&__content {
35+
padding-left: 24px;
36+
}
37+
38+
&__conditions {
39+
margin-top: 32px;
40+
41+
&-title {
42+
font-weight: 700;
43+
font-size: 24px;
44+
margin-bottom: 20px;
45+
margin-top: 8px;
46+
}
47+
48+
&-table {
49+
width: 100%;
50+
border-top: 1px solid #393F44;
51+
margin-bottom: 0;
52+
53+
&-header {
54+
display: flex;
55+
font-weight: 600;
56+
font-size: 16px;
57+
padding: 16px 0 8px 0;
58+
59+
&-cell {
60+
text-align: left;
61+
62+
&--type {
63+
flex: 2;
64+
padding-left: 0;
65+
}
66+
67+
&--status {
68+
flex: 1;
69+
}
70+
71+
&--updated {
72+
flex: 2;
73+
}
74+
75+
&--reason {
76+
flex: 2;
77+
}
78+
79+
&--message {
80+
flex: 4;
81+
}
82+
}
83+
}
84+
85+
&-row {
86+
display: flex;
87+
font-size: 15px;
88+
padding: 16px 0;
89+
align-items: flex-start;
90+
border-top: 1px solid #393F44;
91+
92+
&:first-child {
93+
border-top: none;
94+
}
95+
96+
&-cell {
97+
text-align: left;
98+
99+
&--type {
100+
flex: 2;
101+
padding-left: 0;
102+
}
103+
104+
&--status {
105+
flex: 1;
106+
}
107+
108+
&--updated {
109+
flex: 2;
110+
display: flex;
111+
align-items: center;
112+
}
113+
114+
&--reason {
115+
flex: 2;
116+
}
117+
118+
&--message {
119+
flex: 4;
120+
}
121+
}
122+
}
123+
}
124+
}
125+
126+
&__generators {
127+
&-container {
128+
display: flex;
129+
flex-direction: column;
130+
gap: 16px;
131+
}
132+
133+
&-item {
134+
border: 1px solid #393F44;
135+
border-radius: 8px;
136+
padding: 16px;
137+
background-color: #212427;
138+
139+
&-header {
140+
display: flex;
141+
align-items: center;
142+
margin-bottom: 12px;
143+
144+
&-icon {
145+
width: 24px;
146+
height: 24px;
147+
background-color: #73bcf7;
148+
border-radius: 4px;
149+
display: flex;
150+
align-items: center;
151+
justify-content: center;
152+
margin-right: 8px;
153+
font-size: 12px;
154+
font-weight: bold;
155+
color: #003a70;
156+
}
157+
158+
&-title {
159+
font-weight: 600;
160+
font-size: 16px;
161+
}
162+
}
163+
164+
&-content {
165+
display: flex;
166+
flex-direction: column;
167+
gap: 8px;
168+
169+
&-row {
170+
display: flex;
171+
align-items: center;
172+
173+
&-label {
174+
font-weight: 500;
175+
min-width: 80px;
176+
color: #8a8d90;
177+
}
178+
179+
&-value {
180+
color: #73bcf7;
181+
text-decoration: underline;
182+
cursor: pointer;
183+
}
184+
}
185+
}
186+
}
187+
}
188+
189+
&__yaml-editor {
190+
&-header {
191+
&-buttons {
192+
// YAML editor header buttons styles
193+
}
194+
195+
&-shortcuts {
196+
// YAML editor shortcuts styles
197+
198+
&-link {
199+
// YAML editor shortcuts link styles
200+
}
201+
}
202+
}
203+
204+
&-content {
205+
background: #1e1e1e;
206+
color: #d4d4d4;
207+
font-family: monospace;
208+
font-size: 14px;
209+
border-radius: 4px;
210+
padding: 0;
211+
212+
pre {
213+
margin: 0;
214+
padding: 16px;
215+
overflow: auto;
216+
}
217+
}
218+
}
219+
}

0 commit comments

Comments
 (0)