JSFiddle - React, Tailwind, and code Playground

by rami7250

HTML

<c-kb-shd-alert data-aura-rendered-by="268:0" c-kbshdalert_kbshdalert-host=""><div c-kbshdalert_kbshdalert="" class="alert-container slds-p-around_small"><div c-kbshdalert_kbshdalert="">Learn how VMware Skyline Advisor and Skyline Health Diagnostics work together to provide proactive intelligence and self-service log analysis.</div><ul c-kbshdalert_kbshdalert="" class="slds-p-left_large"><li c-kbshdalert_kbshdalert="">Use <a c-kbshdalert_kbshdalert="" href="https://www.vmware.com/support/services/skyline.html" rel="noopener noreferrer" target="_blank" style="font-weight: bold;">Skyline Advisor</a> to avoid issues before they occur across VCF, vSphere, vSAN, NSX, vROps &amp; Horizon. Skyline Findings are based on top KBs, VMSAs/CVEs and design best practices.</li><li c-kbshdalert_kbshdalert="">Use <a c-kbshdalert_kbshdalert="" href="https://blogs.vmware.com/vsphere/2020/09/introducing-vmware-skyline-health-diagnostic-tool.html" rel="noopener noreferrer" target="_blank" style="font-weight: bold;">Skyline Health Diagnostics</a> to root cause vSphere &amp; vSAN logs when an issue occurs. Skyline Health Diagnostic Findings are based on top KBs and VMSA/CVEs. You can use the Skyline Health Diagnostics tool in online or offline mode.</li><li c-kbshdalert_kbshdalert="">If you require additional help from technical support, please use <a c-kbshdalert_kbshdalert="" href="https://www.vmware.com/support/services/skyline.html" rel="noopener noreferrer" target="_blank" style="font-weight: bold;">Skyline Advisor</a> to initiate a Log Assist to reduce time to upload logs. TSEs can also initiate logs to reduce effort.</li></ul></div></c-kb-shd-alert>

CSS

.alert-container[c-kbShdAlert_kbShdAlert] {
    background: #e3f5fc;
    color: #666;
    border: 0.05rem solid #00567a;
    border-radius: 0.15rem;
    padding: 12px;
    font-family: opensans);
    }