chrome/browser/resources/settings/chromeos/os_privacy_page/privacy_hub_subpage.html

<style include="settings-shared">
    .list-item:not(:last-of-type) {
      border-bottom: var(--cr-separator-line);
    }

    .list-frame {
      padding-bottom: 8px;
      padding-top: 8px;
    }
</style>

<div id="camera">
  <settings-toggle-button
      class="settings-box first"
      pref="{{prefs.ash.user.camera_allowed}}"
      id="cameraToggle"
      label="$i18n{cameraToggleTitle}"
      sub-label="$i18n{cameraToggleSubtext}"
      deep-link-focus-id$="[[Setting.kCameraOnOff]]"
      disabled="[[isCameraListEmpty_]]"
      on-change="onCameraToggleChanged_">
  </settings-toggle-button>

  <div class="list-frame">
    <template is="dom-if" if="[[isCameraListEmpty_]]" restamp>
      <div id="noCamera" class="list-item">
        $i18n{noCameraConnectedText}
      </div>
    </template>

    <template is="dom-if" if="[[!isCameraListEmpty_]]" restamp>
      <template id="cameraList" is="dom-repeat" items="[[camerasConnected_]]">
        <div class="list-item">
          [[item]]
        </div>
      </template>
    </template>
  </div>
</div>

<div id="microphone">
  <settings-toggle-button
      class="settings-box"
      pref="{{prefs.ash.user.microphone_allowed}}"
      id="microphoneToggle"
      label="$i18n{microphoneToggleTitle}"
      deep-link-focus-id$="[[Setting.kMicrophoneOnOff]]"
      sub-label="$i18n{microphoneToggleSubtext}"
      disabled="[[shouldDisableMicrophoneToggle_]]"
      on-change="onMicrophoneToggleChanged_">
    <cr-tooltip-icon
      hidden$="[[!microphoneHardwareToggleActive_]]"
      tooltip-text="$i18n{microphoneHwToggleTooltip}"
      icon-class="cr:info-outline"
      slot="more-actions">
    </cr-tooltip-icon>
  </settings-toggle-button>

  <div class="list-frame">
    <template is="dom-if" if="[[isMicListEmpty_]]" restamp>
      <div id="noMic" class="list-item">
        $i18n{noMicrophoneConnectedText}
      </div>
    </template>

    <template is="dom-if" if="[[!isMicListEmpty_]]" restamp>
      <template id="micList" is="dom-repeat" items="[[microphonesConnected_]]">
        <div class="list-item">
          [[item]]
        </div>
      </template>
    </template>
  </div>
</div>

<template is="dom-if" if="[[showSpeakOnMuteDetectionPage_]]" restamp>
  <settings-toggle-button
      class="settings-box"
      pref="{{prefs.ash.user.speak_on_mute_detection_enabled}}"
      id="speakonmuteDetectionToggle"
      label="$i18n{speakOnMuteDetectionToggleTitle}"
      sub-label="$i18n{speakOnMuteDetectionToggleSubtext}"
      deep-link-focus-id$="[[Setting.kSpeakOnMuteDetectionOnOff]]"
      learn-more-url="$i18n{speakOnMuteDetectionLearnMoreURL}">
  </settings-toggle-button>
</template>

<!-- Location toggle is not to be shown in dogfooded version of Privacy Hub -->
<template is="dom-if" if="[[showPrivacyHubMVPPage_]]" restamp>
  <settings-toggle-button
      class="settings-box"
      pref="{{prefs.ash.user.geolocation_allowed}}"
      id="geolocationToggle"
      label="$i18n{geolocationToggleTitle}"
      sub-label="$i18n{geolocationToggleDesc}"
      deep-link-focus-id$="[[Setting.kGeolocationOnOff]]">
  </settings-toggle-button>
</template>

<if expr="_google_chrome">
  <settings-metrics-consent-toggle-button
      class="settings-box no-padding"
      id="metricsConsentToggle"
      deep-link-focus-id$="[[Setting.kUsageStatsAndCrashReports]]"
      prefs="{{prefs}}">
  </settings-metrics-consent-toggle-button>
</if>

<settings-toggle-button
    class="settings-box"
    id="suggested-content"
    pref="{{prefs.settings.suggested_content_enabled}}"
    label="$i18n{enableSuggestedContent}"
    sub-label="$i18n{enableSuggestedContentDesc}"
    learn-more-url="$i18n{suggestedContentLearnMoreURL}">
</settings-toggle-button>