/*
 * Copyright 2021 The Chromium Authors. All rights reserved.
 * Use of this source code is governed by a BSD-style license that can be
 * found in the LICENSE file.
 */

div {
  line-height: 1.7em;
}

.arrow-icon-button {
  cursor: pointer;
  padding: 1px 0;
  border: none;
  background: none;
}

.arrow-icon {
  display: inline-block;
  -webkit-mask-image: var(--image-file-treeoutlineTriangles);
  -webkit-mask-size: 32px 24px;
  -webkit-mask-position: 0 0;
  background-color: var(--color-text-primary);
  margin-top: 2px;
  height: 12px;
  width: 13px;
}

.arrow-icon.expanded {
  -webkit-mask-position: -16px 0;
}

.expandable-list-container {
  display: flex;
  margin-top: 4px;
}

.expandable-list-items {
  overflow: hidden;
}

.link,
.devtools-link {
  color: var(--color-link);
  text-decoration: underline;
  cursor: pointer;
  padding: 2px 0; /* adjust focus ring size */
}

button.link {
  border: none;
  background: none;
  font-family: inherit;
  font-size: inherit;
}

/*
 * Copyright 2021 The Chromium Authors. All rights reserved.
 * Use of this source code is governed by a BSD-style license that can be
 * found in the LICENSE file.
 */

:host {
  overflow: hidden;
}

div {
  line-height: 1.7em;
}

.arrow-icon-button {
  cursor: pointer;
  padding: 1px 0;
  border: none;
  background: none;
}

.arrow-icon {
  display: inline-block;
  -webkit-mask-image: var(--image-file-treeoutlineTriangles);
  -webkit-mask-size: 32px 24px;
  -webkit-mask-position: 0 0;
  background-color: var(--color-text-primary);
  margin-top: 2px;
  height: 12px;
  width: 13px;
}

.arrow-icon.expanded {
  -webkit-mask-position: -16px 0;
}

.expandable-list-container {
  display: flex;
  margin-top: 4px;
}

.expandable-list-items {
  overflow: hidden;
}

.link,
.devtools-link {
  color: var(--color-link);
  text-decoration: underline;
  cursor: pointer;
  padding: 2px 0; /* adjust focus ring size */
}

button.link {
  border: none;
  background: none;
  font-family: inherit;
  font-size: inherit;
}

.text-ellipsis {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

Allow `overflow: hidden` for long content
ExpandableList: Allow `overflow: hidden` for long content

This allows the rows of and expandable list to not overflow and show
an ellipsis (...) instead.

This will be used in https://crrev.com/c/3474160.

Bug: 1288158
Change-Id: I53fe095f6a5d808073c7949769d70467601ad66c
Reviewed-on: https://chromium-review.googlesource.com/c/devtools/devtools-frontend/+/3500428
Reviewed-by: Alex Rudenko <d8d88e7d7e77f69e23d1d1432231196fb8e02a62@chromium.org>
Commit-Queue: Wolfgang Beyer <573aa99bb19da47d816981118f95c945310dd3f4@chromium.org>
