/* * SPDX-FileCopyrightText: Copyright (c) 2025 NVIDIA CORPORATION & AFFILIATES. All rights reserved. * SPDX-License-Identifier: Apache-2.0 * * Licensed 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 CONDITIONS OF ANY KIND, either express or implied. * See the License for the specific language governing permissions and * limitations under the License. */ .wrapper { width: 100%; height: 400px; /* Same as max-height of container */ display: flex; flex-direction: column; } .content { width: 100%; height: 100%; opacity: 0; transform: translateY(10px); animation: fadeIn 0.3s ease-out forwards; } @keyframes fadeIn { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: translateY(0); } } .container { width: 100%; max-height: 400px; min-height: 0; /* Allows container to shrink below max-height */ display: flex; flex-direction: column; background-color: rgb(243 244 246); border-radius: 1rem; overflow: hidden; transition: all 0.3s ease-out; } .list { flex: 1; overflow-y: auto; scrollbar-width: none; -ms-overflow-style: none; transition: all 0.3s ease-out; } .list::-webkit-scrollbar { display: none; } .list:hover { scrollbar-width: thin; -ms-overflow-style: auto; } .list:hover::-webkit-scrollbar { display: block; width: 8px; } .list:hover::-webkit-scrollbar-track { background: rgb(229 231 235); border-radius: 4px; } .list:hover::-webkit-scrollbar-thumb { background: rgb(156 163 175); border-radius: 4px; } /* Dark mode styles */ @media (prefers-color-scheme: dark) { .container { background-color: rgb(31 41 55); } .list:hover::-webkit-scrollbar-track { background: rgb(55 65 81); } .list:hover::-webkit-scrollbar-thumb { background: rgb(107 114 128); } }