penpot/frontend/resources/styles/main/partials/sidebar-interactions.scss

// This Source Code Form is subject to the terms of the Mozilla Public
// License, v. 2.0. If a copy of the MPL was not distributed with this
// file, You can obtain one at http://mozilla.org/MPL/2.0/.
//
// Copyright (c) 2015-2016 Andrey Antukh <niwi@niwi.nz>
// Copyright (c) 2015-2016 Juan de la Cruz <delacruzgarciajuan@gmail.com>

.interactions-help {
  font-size: $fs12;
  padding: 7px $size-4;
  margin: 0 -7px;
  text-align: center;

  &.separator {
    padding-bottom: $size-4;
    border-bottom: 1px solid $color-black;
  }
}

.interactions-help-icon {
  height: 32px;
  width: 32px;
  margin: $size-4 auto;

  svg {
    fill: $color-gray-40;
    height: 32px;
    width: 32px;
  }
}

.interactions-summary {
  cursor: pointer;
  flex-basis: 0;
  flex-grow: 1;

  .trigger-name {
    font-size: $fs12;
    color: $color-white;
  }

  .action-summary {
    font-size: $fs11;
    color: $color-gray-20;
  }
}

.interactions-element {
  display: flex;
  align-items: center;
  margin: 0 -7px;
  padding: 0 7px;

  .element-label {
    color: $color-gray-20;
    font-size: $fs11;
    width: 64px;
  }

  &.separator {
    border-top: 1px solid $color-black;
    margin-top: $size-1;
  }
}

.interactions-pos-buttons {
  margin-top: $size-2;
  padding-top: $size-2;
  padding-bottom: $size-2;
  justify-content: space-between;

  .element-set-actions-button {
    min-width: 18px;
    min-height: 18px;
  }

  svg {
    width: 18px;
    height: 18px;
  }
}