mrva/vscode-codeql
1
0
Fork 0
Code Issues Pull Requests Actions 2 Packages Projects Releases Wiki Activity

Add styling for header rows

Browse Source
This commit is contained in:
Robert
2023-10-18 14:10:17 +01:00
parent 298656444f
commit 56d0f28814
2 changed files with 13 additions and 6 deletions
Download Patch File Download Diff File Expand all files Collapse all files

7
extensions/ql-vscode/src/view/common/DataGrid.tsx
View File

@@ -54,9 +54,14 @@ const StyledDataGridCell = styled.div<{
${({ $gridRow }) => ($gridRow ? `grid-row: ${$gridRow};` : "")} ${({ $gridRow }) => ($gridRow ? `grid-row: ${$gridRow};` : "")}
${({ $gridColumn }) => ($gridColumn ? `grid-column: ${$gridColumn};` : "")} ${({ $gridColumn }) => ($gridColumn ? `grid-column: ${$gridColumn};` : "")}
padding: 4px 12px; padding: 4px 12px;
&.header {
font-weight: 600;
}
`; `;
interface DataGridCellProps { interface DataGridCellProps {
rowType?: "default" | "header";
gridRow?: string | number; gridRow?: string | number;
gridColumn?: string | number; gridColumn?: string | number;
className?: string; className?: string;
@@ -64,11 +69,13 @@ interface DataGridCellProps {
} }
export function DataGridCell({ export function DataGridCell({
rowType = "default",
gridRow, gridRow,
gridColumn, gridColumn,
className, className,
children, children,
}: DataGridCellProps) { }: DataGridCellProps) {
className = `${className || ""} ${rowType}`;
return ( return (
<StyledDataGridCell <StyledDataGridCell
$gridRow={gridRow} $gridRow={gridRow}

12
extensions/ql-vscode/src/view/model-editor/ModeledMethodDataGrid.tsx
View File

@@ -71,13 +71,13 @@ export const ModeledMethodDataGrid = ({
<DataGrid gridTemplateColumns={gridTemplateColumns}> <DataGrid gridTemplateColumns={gridTemplateColumns}>
{someMethodsAreVisible && ( {someMethodsAreVisible && (
<> <>
<DataGridCell>API or method</DataGridCell> <DataGridCell rowType="header">API or method</DataGridCell>
<DataGridCell>Model type</DataGridCell> <DataGridCell rowType="header">Model type</DataGridCell>
<DataGridCell>Input</DataGridCell> <DataGridCell rowType="header">Input</DataGridCell>
<DataGridCell>Output</DataGridCell> <DataGridCell rowType="header">Output</DataGridCell>
<DataGridCell>Kind</DataGridCell> <DataGridCell rowType="header">Kind</DataGridCell>
{viewState.showMultipleModels && ( {viewState.showMultipleModels && (
<DataGridCell> <DataGridCell rowType="header">
<ScreenReaderOnly>Add or remove models</ScreenReaderOnly> <ScreenReaderOnly>Add or remove models</ScreenReaderOnly>
</DataGridCell> </DataGridCell>
)} )}