Spaces:
Paused
Paused
| /* | |
| * 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); | |
| } | |
| } | |