Skip to content

Commit fb3ee84

Browse files
SeboboSebobo
committed
BUGFIX: Prevent tailwind from breaking neos backend styles
With this change the tailwind styles are only applied to the app container of the decoupled content store
1 parent b77c2b7 commit fb3ee84

9 files changed

Lines changed: 208 additions & 444 deletions

File tree

‎Resources/Private/BackendFusion/Integration/Backend.Details.fusion‎

Lines changed: 35 additions & 33 deletions
Original file line numberDiff line numberDiff line change
@@ -9,40 +9,42 @@ Flowpack.DecoupledContentStore.BackendController.details = Neos.Fusion:Component
99
// - isPrimary: bool
1010

1111
renderer = afx`
12-
<form id="postHelper" method="post">
13-
<input
14-
type="hidden"
15-
name="__csrfToken"
16-
value={Security.csrfToken()}
17-
/>
18-
</form>
19-
<Flowpack.DecoupledContentStore:Integration.StylesAndScripts/>
20-
<h1 class="text-3xl py-5 inline">
21-
Content Release {detailsData.contentReleaseIdentifier.identifier}
22-
</h1>
23-
{" "}
24-
<span class="neos-badge" style="vertical-align: super;" title="content store" data-neos-toggle="tooltip">{contentStore}</span>
25-
<Flowpack.DecoupledContentStore:ContentReleaseSteps
26-
_taskResults={detailsData.job.taskResults}
27-
prunnerStart={detailsData.job.created}
28-
/>
29-
<Neos.Fusion:Loop items={detailsData.manualTransferJobs}>
12+
<div id="app">
13+
<form id="postHelper" method="post">
14+
<input
15+
type="hidden"
16+
name="__csrfToken"
17+
value={Security.csrfToken()}
18+
/>
19+
</form>
20+
<Flowpack.DecoupledContentStore:Integration.StylesAndScripts/>
21+
<h1 class="text-3xl py-5 inline">
22+
Content Release {detailsData.contentReleaseIdentifier.identifier}
23+
</h1>
24+
{" "}
25+
<span class="neos-badge" style="vertical-align: super;" title="content store" data-neos-toggle="tooltip">{contentStore}</span>
3026
<Flowpack.DecoupledContentStore:ContentReleaseSteps
31-
_taskResults={item.taskResults}
32-
isManualTransferPipeline={true}
33-
prunnerJobId={item.id.id}
34-
prunnerStart={item.created}
35-
manualSwitchTarget={item.variables.redisInstanceId}
27+
_taskResults={detailsData.job.taskResults}
28+
prunnerStart={detailsData.job.created}
3629
/>
37-
</Neos.Fusion:Loop>
38-
39-
<h2 @if.isTrue={detailTaskName} class="text-3xl py-5">Log Output for {detailTaskName}</h2>
40-
<pre>
41-
{jobLogs.stderr}
42-
</pre>
43-
<pre>
44-
{jobLogs.stdout}
45-
</pre>
30+
<Neos.Fusion:Loop items={detailsData.manualTransferJobs}>
31+
<Flowpack.DecoupledContentStore:ContentReleaseSteps
32+
_taskResults={item.taskResults}
33+
isManualTransferPipeline={true}
34+
prunnerJobId={item.id.id}
35+
prunnerStart={item.created}
36+
manualSwitchTarget={item.variables.redisInstanceId}
37+
/>
38+
</Neos.Fusion:Loop>
39+
40+
<h2 @if.isTrue={detailTaskName} class="text-3xl py-5">Log Output for {detailTaskName}</h2>
41+
<pre>
42+
{jobLogs.stderr}
43+
</pre>
44+
<pre>
45+
{jobLogs.stdout}
46+
</pre>
47+
</div>
4648
<Flowpack.DecoupledContentStore:DetailsFooter />
4749
`
4850
}
@@ -400,7 +402,7 @@ prototype(Flowpack.DecoupledContentStore:DetailsFooter) < prototype(Neos.Fusion:
400402
}
401403

402404
renderer = afx`
403-
<div class="neos-footer !h-full">
405+
<div class="neos-footer">
404406
<Neos.Fusion:Link.Action href.action="details" href.arguments={{contentReleaseIdentifier: detailsData.contentReleaseIdentifier.identifier}} class="neos-button">
405407
<i class="fa fa-sync"></i> Reload
406408
</Neos.Fusion:Link.Action>

‎Resources/Private/BackendFusion/Integration/Backend.Index.fusion‎

Lines changed: 53 additions & 51 deletions
Original file line numberDiff line numberDiff line change
@@ -77,61 +77,63 @@ Flowpack.DecoupledContentStore.BackendController.index = Neos.Fusion:Component {
7777
}
7878
}
7979
renderer = afx`
80-
<Flowpack.DecoupledContentStore:FlashMessages id="neos-notifications-inline" class="flashmessages" />
81-
<form id="postHelper" method="post">
82-
<input
83-
type="hidden"
84-
name="__csrfToken"
85-
value={Security.csrfToken()}
86-
/>
87-
</form>
88-
<div class="neos-content neos-container-fluid">
89-
<Flowpack.DecoupledContentStore:Integration.StylesAndScripts/>
90-
<legend>Content Store Releases</legend>
91-
<div class="neos-row-fluid">
92-
<table class="neos-table cs-releases-table">
93-
<thead>
94-
<tr>
95-
<th style="width: 240px">Identifier</th>
96-
<th style="width: 200px">Page Count</th>
97-
<th style="width: 200px">Render Progress</th>
98-
<th style="width: 200px">Iterations</th>
99-
<th>Start</th>
100-
<th>Stop</th>
101-
<th>Switch</th>
102-
<th>Release Size</th>
103-
</tr>
104-
</thead>
105-
<tbody>
106-
{props._renderedTableBody}
107-
</tbody>
108-
</table>
80+
<div id="app">
81+
<Flowpack.DecoupledContentStore:FlashMessages id="neos-notifications-inline" class="flashmessages" />
82+
<form id="postHelper" method="post">
83+
<input
84+
type="hidden"
85+
name="__csrfToken"
86+
value={Security.csrfToken()}
87+
/>
88+
</form>
89+
<div class="neos-content neos-container-fluid">
90+
<Flowpack.DecoupledContentStore:Integration.StylesAndScripts/>
91+
<legend>Content Store Releases</legend>
92+
<div class="neos-row-fluid">
93+
<table class="neos-table cs-releases-table">
94+
<thead>
95+
<tr>
96+
<th style="width: 240px">Identifier</th>
97+
<th style="width: 200px">Page Count</th>
98+
<th style="width: 200px">Render Progress</th>
99+
<th style="width: 200px">Iterations</th>
100+
<th>Start</th>
101+
<th>Stop</th>
102+
<th>Switch</th>
103+
<th>Release Size</th>
104+
</tr>
105+
</thead>
106+
<tbody>
107+
{props._renderedTableBody}
108+
</tbody>
109+
</table>
109110

110-
<div>
111-
<span>Store size: </span>
112-
<span class="neos-badge neos-badge-info">{storeSize}</span>
113-
</div>
114-
115-
<div style="margin-top: 5rem; display: flex; gap: 1rem;">
116-
<button form="postHelper" formaction={props._publishAllWithoutValidationUri} type="submit" class="neos-button neos-button-danger">
117-
Publish all without validation
118-
</button>
119-
<button form="postHelper" formaction={props._pruneContentStoreUri} type="submit" class="neos-button neos-button-warning">
120-
Prune content store
121-
</button>
122-
<button form="postHelper" formaction={props._cancelRunningReleaseUri} type="submit" class="neos-button neos-button-warning">
123-
Cancel running release
124-
</button>
125-
<button @if.showToggleConfigEpochButton={showToggleConfigEpochButton} form="postHelper" formaction={props._toggleConfigEpoch} type="submit" class="neos-button neos-button-danger" style="margin-top: 300px;">
126-
{'Toggle config epoch: ' + toggleFromConfigEpoch + ' to ' + toggleToConfigEpoch}
127-
</button>
128-
</div>
111+
<div>
112+
<span>Store size: </span>
113+
<span class="neos-badge neos-badge-info">{storeSize}</span>
114+
</div>
129115

130-
<div class="neos-footer !h-full">
131-
<Flowpack.DecoupledContentStore:ListFooter />
116+
<div style="margin-top: 5rem; display: flex; gap: 1rem;">
117+
<button form="postHelper" formaction={props._publishAllWithoutValidationUri} type="submit" class="neos-button neos-button-danger">
118+
Publish all without validation
119+
</button>
120+
<button form="postHelper" formaction={props._pruneContentStoreUri} type="submit" class="neos-button neos-button-warning">
121+
Prune content store
122+
</button>
123+
<button form="postHelper" formaction={props._cancelRunningReleaseUri} type="submit" class="neos-button neos-button-warning">
124+
Cancel running release
125+
</button>
126+
<button @if.showToggleConfigEpochButton={showToggleConfigEpochButton} form="postHelper" formaction={props._toggleConfigEpoch} type="submit" class="neos-button neos-button-danger" style="margin-top: 300px;">
127+
{'Toggle config epoch: ' + toggleFromConfigEpoch + ' to ' + toggleToConfigEpoch}
128+
</button>
129+
</div>
132130
</div>
133131
</div>
134132
</div>
133+
134+
<div class="neos-footer">
135+
<Flowpack.DecoupledContentStore:ListFooter />
136+
</div>
135137
`
136138
}
137139
}
@@ -143,7 +145,7 @@ prototype(Flowpack.DecoupledContentStore:ListFooter) < prototype(Neos.Fusion:Joi
143145
</Neos.Fusion:Link.Action>
144146
`
145147
switchContentStore = afx`
146-
<span class="align-middle inline-block text-sm pr-4 pl-16">
148+
<span class="switchContentStore">
147149
Active Content Store: &nbsp;
148150
<Neos.Fusion:Loop items={redisContentStores}>
149151
<Neos.Fusion:Link.Action

‎Resources/Private/Css/index.css‎

Lines changed: 0 additions & 1 deletion
This file was deleted.

‎Resources/Private/Js/foo.css‎

Lines changed: 0 additions & 3 deletions
This file was deleted.

‎Resources/Private/Js/index.js‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,2 +1,2 @@
1-
import './foo.css';
2-
console.log("HI");
1+
import './styles.css';
2+
console.log('Initialized DecoupledContentStore');

‎Resources/Private/Js/styles.css‎

Lines changed: 25 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,25 @@
1+
#app *,
2+
#app ::before,
3+
#app ::after {
4+
box-sizing: border-box; /* 1 */
5+
border-width: 0; /* 2 */
6+
border-style: solid; /* 2 */
7+
border-color: theme('borderColor.DEFAULT', currentColor); /* 2 */
8+
}
9+
10+
#app ::before,
11+
#app ::after {
12+
--tw-content: '';
13+
}
14+
15+
@tailwind components;
16+
@tailwind utilities;
17+
18+
.switchContentStore {
19+
vertical-align: middle;
20+
display: inline-flex;
21+
font-size: 0.9rem;
22+
gap: 0.5rem;
23+
margin-left: 1rem;
24+
align-items: center;
25+
}

0 commit comments

Comments
 (0)