В настройках Chrome какой стиль используется для получения тени от ящиков?

Question

В настройках Chrome, какие стили используются для получения тени для ящиков?

Например:

Answer 1

Вы можете просматривать страницу настроек практически так же, как и любую другую веб-страницу, поскольку они реализованы с использованием HTML и CSS и отображаются точно так же, как веб-страница.

Разделы настроек реализованы с помощьюкомпонент, который выглядит следующим образом:

<dom-module id="settings-section" assetpath="settings_page/" css-build="shadow">
  <template>
    <style scope="settings-section">/* Styles omitted for brevity */
</style>
    <div id="header">
      <h2 class="title" aria-hidden$="[[getTitleHiddenStatus_(pageTitle)]]">[[pageTitle]]</h2>
    </div>
    <div id="card">
      <slot></slot>
    </div>
  </template>
  </dom-module>

Этот элемент области действия style содержит это правило CSS:

#card {
  box-shadow: var(--cr-card-elevation_-_box-shadow);
        background-color: white;
        border-radius: var(--cr-card-border-radius);
        flex: 1;
}

Пользовательское свойство --cr-card-elevation_-_box-shadow определяется следующим образом:

--cr-card-elevation_-_box-shadow:  rgba(60, 64, 67, .3) 0 1px 2px 0,
              rgba(60, 64, 67, .15) 0 1px 3px 1px;