/******************************************************************************** * Copyright (C) 2025 EclipseSource GmbH. * * This program and the accompanying materials are made available under the * terms of the Eclipse Public License v. 2.0 which is available at * http://www.eclipse.org/legal/epl-2.0. * * This Source Code may also be made available under the following Secondary * Licenses when the conditions for such availability set forth in the Eclipse * Public License v. 2.0 are satisfied: GNU General Public License, version 2 * with the GNU Classpath Exception which is available at * https://www.gnu.org/software/classpath/license.html. * * SPDX-License-Identifier: EPL-2.0 OR GPL-2.0-only WITH Classpath-exception-2.0 ********************************************************************************/ /* Card grid pattern for displaying items in a responsive grid */ .ai-card-grid-configuration-main { padding: var(--theia-ui-padding); height: 100%; overflow: auto; } .ai-configuration-card-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: var(--theia-ui-padding); } .ai-configuration-card { background-color: var(--theia-sideBar-background); border: var(--theia-border-width) solid var(--theia-widget-border); border-radius: 4px; padding: var(--theia-ui-padding); transition: box-shadow 0.2s ease; } .ai-configuration-card:hover { box-shadow: 0 2px 8px var(--theia-widget-shadow); } /* Responsive grid */ @media (max-width: 900px) { .ai-configuration-card-grid { grid-template-columns: repeat(auto-fill, minmax(250px, 1fr)); } } @media (max-width: 600px) { .ai-configuration-card-grid { grid-template-columns: 1fr; } } @media (max-width: 400px) { .ai-card-grid-configuration-main { padding: calc(var(--theia-ui-padding) / 2); } }