@adobe/coral-spectrum/coral-component-actionbar/src/styles/index.css

Coral Spectrum is a JavaScript library of Web Components following Spectrum design patterns.

/**
 * Copyright 2019 Adobe. All rights reserved.
 * This file is licensed to you under the Apache License, Version 2.0 (the "License");
 * you may not use this file except in compliance with the License. You may obtain a copy
 * of the License at http://www.apache.org/licenses/LICENSE-2.0
 *
 * Unless required by applicable law or agreed to in writing, software distributed under
 * the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS
 * OF ANY KIND, either express or implied. See the License for the specific language
 * governing permissions and limitations under the License.
 */

._coral-ActionBar {
  position: relative;
  display: flex;
  justify-content: center;
  align-items: center;
  border-style: solid;
  border-width: 1px;
  border-radius: 4px;
  box-sizing: border-box;
  height: 48px;
}
._coral-ActionBar-primary,
._coral-ActionBar-secondary {
  position: absolute;
  top: 8px;
}
._coral-ActionBar-primary > ._coral-ActionBar-item {
  float: left;
  position: relative;
  margin-left: 8px;
}
._coral-ActionBar-secondary > ._coral-ActionBar-item {
  float: left;
  position: relative;
  margin-left: 8px;
}
._coral-ActionBar-primary > ._coral-ActionButton[coral-actionbar-more] {
  float: left;
  position: relative;
  margin-left: 8px;
}
._coral-ActionBar-secondary > ._coral-ActionButton[coral-actionbar-more] {
  float: left;
  position: relative;
  margin-left: 8px;
}
._coral-ActionBar-primary > [coral-actionbar-offscreen],
._coral-ActionBar-secondary > [coral-actionbar-offscreen] {
  position: absolute !important;
  left: -999em;
}
._coral-ActionBar-primary {
  left: 8px;
}
._coral-ActionBar-secondary {
  right: calc(8px * 2);
}
._coral-ActionBar-buttonList button[is="coral-buttonlist-item"],
._coral-ActionBar-anchorList a[is="coral-anchorlist-item"] {
  -webkit-font-smoothing: antialiased;
}
.coral--large ._coral-ActionBar {
  height: 60px;
}
.coral--light ._coral-ActionBar {
  box-shadow: 0 1px 4px rgba(0,0,0,0.15);
  border-color: rgb(202, 202, 202);
  background-color: rgb(255, 255, 255);
}
.coral--lightest ._coral-ActionBar {
  box-shadow: 0 1px 4px rgba(0,0,0,0.15);
  border-color: rgb(211, 211, 211);
  background-color: rgb(255, 255, 255);
}
.coral--dark ._coral-ActionBar {
  box-shadow: 0 1px 4px rgba(0,0,0,0.5);
  border-color: rgb(90, 90, 90);
  background-color: rgb(37, 37, 37);
}
.coral--darkest ._coral-ActionBar {
  box-shadow: 0 1px 4px rgba(0,0,0,0.8);
  border-color: rgb(73, 73, 73);
  background-color: rgb(8, 8, 8);
}