<style include="diagnostics-shared">
#cardTitle {
align-items: center;
display: flex;
}
#icon {
padding-inline-end: 12px;
}
#troubleShootingContainer {
padding-inline: 20px;
}
</style>
<diagnostics-card is-networking-card
hide-data-points="[[!showNetworkDataPoints]]">
<template is="dom-if" if="[[showTroubleshootingCard]]">
<div slot="left-panel" id="troubleShootingContainer">
<network-troubleshooting id="networkTroubleshooting"
slot="left-panel"
troubleshooting-info="[[troubleshootingInfo]]">
</network-troubleshooting>
</div>
</template>
<div id="cardTitle" slot="title" tabindex="0">
<diagnostics-network-icon id="icon" network="[[network]]">
</diagnostics-network-icon>
<span id="titleText">
[[getNetworkCardTitle(networkType, networkState)]]
</span>
</div>
<template is="dom-if" if="[[macAddress]]">
<div id="macAddressChip" slot="chip" class="diagnostics-chip"
tabindex="0">
[[getMacAddress(macAddress)]]
</div>
</template>
<template is="dom-if" if="[[showNetworkDataPoints]]">
<network-info slot="body" guid="[[guid]]" network="[[network]]">
</network-info>
<ip-config-info-drawer id="ipConfigInfoDrawer" network="[[network]]"
slot="routines">
</ip-config-info-drawer>
</template>
</diagnostics-card>