[Cloud Posture][Bug]added fix for resource tab + small css fix on CSPM onboarding

[animehart]

Summary

• Added Fix for Resource tab has empty component
• Added small CSS fix for button on CSPM not centered

[elasticmachine]

Pinging @elastic/kibana-cloud-security-posture (Team:Cloud Security)

[JordanSh]

@animehart I've managed to resolve this issue with what i think is a much simpler solution, please give it a go and tell me if it causing you any problems that I didn't notice.

The reason that you had problems here, and with the button in particular is that you used a repeating CSS selector. basically applying all those styles to every third child div. including the button, which also got the 450px width and that's what caused it to break outside of its container.

We can replace the entire css property with those 3 lines,

css={css`
        > :nth-child(3) {
          display: block;
          margin: auto;
          width: 450px;
        }
`}

Result:

[kibana-ci]

💚 Build Succeeded

• Buildkite Build
• Commit: 610f7e2

Metrics [docs]

Async chunks

Total size of all lazy-loaded chunks that will be downloaded as the user navigates the app

id	before	after	diff
cloudSecurityPosture	142.3KB	142.3KB	-79.0B

History

• 💛 Build #106311 was flaky 3b6e51b
• 💚 Build #105489 succeeded 9d4cecb
• 💔 Build #104476 failed d725a66
• 💔 Build #104449 failed 00fe0f1

To update your PR or re-run it, just comment with:
@elasticmachine merge upstream