charcoal_settings.html

<div class="settings_navbar">
  <span class="navbar_header">Charcoal Settings</span>
  <div class="button" id="charcoal_settings_done_button">Done</div>
</div>
<div class="settings_list">
  <div class="setting_section">
    <div class="setting_row">
      <span class="setting_header_label">Appearance</span>
    </div>
    <div id="appearance_selector">
      <div class="setting_row">
        <div class="appearance_item" data-appearance="light">
          <div class ="appearance_image light"></div>
          <span class="appearance_label">Light</span>
        </div>
        <div class="appearance_item" data-appearance="dark">
          <div class ="appearance_image dark"></div>
          <span class="appearance_label">Dark</span>
        </div>
        <div class="appearance_item" data-appearance="system">
          <div class="mini_appearance_image_wrapper">
            <div class ="appearance_image mini light"></div>
            <div class ="appearance_image mini dark"></div>
          </div>
          <span class="appearance_label">System</span>
        </div>
      </div>
    </div>
  </div>
  <div class="setting_section">
    <div class="setting_row">
      <span class="setting_header_label">Theme</span>
    </div>
    <div id="theme_selector">
      <div class="setting_row" data-theme="charcoal">
        <span class="setting_row_label">Charcoal</span>
      </div>
      <div class="setting_row" data-theme="midnight">
        <span class="setting_row_label">Midnight</span>
      </div>
      <div class="setting_row" data-theme="deepblue">
        <span class="setting_row_label">Deep Blue</span>
      </div>
    </div>
  </div>
</div>