gravitational/teleport
1
0
Fork 0
mirror of https://github.com/gravitational/teleport.git synced 2026-10-11 22:49:54 +00:00
Code Issues Packages Projects Releases Wiki Activity

Remove unused accessGraph theme colors (#65074)

Browse Source 
* Remove unused accessGraph theme colors

* Remove unused imports

* pnpm format
This commit is contained in:
Ryan Clark
2026-03-27 11:54:20 +00:00
committed by GitHub
parent bde5a43e4d
commit 392a8165ae
4 changed files with 2 additions and 735 deletions
Download Patch File Download Diff File Expand all files Collapse all files
web/packages/design/src/theme/themes/bblpTheme.ts
-228
View File
@@ -16,18 +16,6 @@
* along with this program. If not, see <http://www.gnu.org/licenses/>.
*/
import {
blue,
green,
grey,
indigo,
orange,
pink,
purple,
red,
yellow,
} from 'design/theme/palette';
import { lighten } from '../utils/colorManipulator';
import { sharedColors, sharedStyles } from './sharedStyles';
import { DataVisualisationColors, Theme, ThemeColors } from './types';
@@ -267,222 +255,6 @@ const colors: ThemeColors = {
activeSearchMatch: '#FFAB00',
},
accessGraph: {
dotsColor: 'rgba(255, 255, 255, 0.1)',
edges: {
dynamicMemberOf: {
color: purple[700],
stroke: purple[500],
},
memberOf: {
color: 'rgba(255, 255, 255, 0.7)',
stroke: 'rgba(255, 255, 255, 0.2)',
},
reverse: {
color: blue[700],
stroke: blue[300],
},
allowed: {
color: green[700],
stroke: green[300],
},
disallowed: {
color: red[700],
stroke: red[300],
},
restricted: {
color: yellow[700],
stroke: yellow[900],
},
default: {
color: 'rgba(255, 255, 255, 0.7)',
stroke: 'rgba(255, 255, 255, 0.2)',
},
requestedResource: {
color: 'rgba(255, 255, 255, 0.7)',
stroke: '#484c6a',
},
requestedAction: {
color: 'rgba(255, 255, 255, 0.7)',
stroke: '#484c6a',
},
requestedBy: {
color: 'rgba(255, 255, 255, 0.7)',
stroke: '#484c6a',
},
},
nodes: {
user: {
background: lighten(purple[300], 0.1),
borderColor: 'transparent',
typeColor: purple[700],
iconBackground: purple[400],
handleColor: purple[200],
highlightColor: purple[700],
label: {
background: purple[200],
color: purple[700],
},
},
userGroup: {
background: lighten(orange[300], 0.1),
borderColor: 'transparent',
typeColor: orange[700],
iconBackground: orange[400],
handleColor: orange[200],
highlightColor: orange[700],
label: {
background: orange[200],
color: orange[700],
},
},
temporaryUserGroup: {
background: lighten(orange[200], 0.1),
borderColor: 'transparent',
typeColor: orange[500],
iconBackground: orange[200],
handleColor: orange[200],
highlightColor: orange[200],
label: {
background: orange[200],
color: orange[500],
},
},
resource: {
background: lighten(blue[300], 0.1),
borderColor: 'transparent',
typeColor: blue[700],
iconBackground: blue[400],
handleColor: blue[200],
highlightColor: blue[700],
label: {
background: blue[200],
color: blue[700],
},
},
resourceGroup: {
background: lighten(pink[300], 0.1),
borderColor: 'transparent',
typeColor: pink[700],
iconBackground: pink[400],
handleColor: pink[200],
highlightColor: pink[700],
label: {
background: pink[200],
color: pink[700],
},
},
temporaryResourceGroup: {
background: lighten(pink[200], 0.9),
borderColor: pink[200],
typeColor: pink[200],
iconBackground: pink[200],
handleColor: pink[300],
highlightColor: pink[200],
label: {
background: pink[200],
color: pink[300],
},
},
allowedAction: {
background: lighten(green[300], 0.1),
borderColor: 'transparent',
typeColor: green[700],
iconBackground: green[400],
handleColor: green[200],
highlightColor: green[700],
label: {
background: green[200],
color: green[700],
},
},
temporaryAllowedAction: {
background: lighten(green[200], 0.9),
borderColor: green[200],
typeColor: green[200],
iconBackground: green[200],
handleColor: green[300],
highlightColor: green[200],
label: {
background: green[200],
color: green[300],
},
},
disallowedAction: {
background: lighten(red[300], 0.1),
borderColor: 'transparent',
typeColor: red[700],
iconBackground: red[400],
handleColor: red[200],
highlightColor: red[700],
label: {
background: red[200],
color: red[700],
},
},
allowedRequest: {
background: lighten(indigo[300], 0.9),
borderColor: indigo[300],
typeColor: indigo[300],
iconBackground: indigo[300],
handleColor: indigo[400],
highlightColor: indigo[300],
label: {
background: indigo[200],
color: indigo[700],
},
},
disallowedRequest: {
background: lighten(purple[300], 0.9),
borderColor: purple[300],
typeColor: purple[300],
iconBackground: purple[300],
handleColor: purple[400],
highlightColor: purple[300],
label: {
background: purple[200],
color: purple[700],
},
},
allowedReview: {
background: lighten(indigo[300], 0.9),
borderColor: indigo[300],
typeColor: indigo[300],
iconBackground: indigo[300],
handleColor: indigo[400],
highlightColor: indigo[300],
label: {
background: indigo[200],
color: indigo[700],
},
},
disallowedReview: {
background: lighten(purple[300], 0.9),
borderColor: purple[300],
typeColor: purple[300],
iconBackground: purple[300],
handleColor: purple[400],
highlightColor: purple[300],
label: {
background: purple[200],
color: purple[700],
},
},
accessRequest: {
background: lighten(grey[300], 0.9),
borderColor: grey[300],
typeColor: grey[700],
iconBackground: grey[700],
handleColor: grey[400],
highlightColor: grey[300],
label: {
background: grey[200],
color: grey[700],
},
},
},
},
editor: {
abbey: dataVisualisationColors.tertiary.abbey,
purple: dataVisualisationColors.tertiary.purple,
web/packages/design/src/theme/themes/darkTheme.ts
-228
View File
@@ -16,18 +16,6 @@
* along with this program. If not, see <http://www.gnu.org/licenses/>.
*/
import {
blue,
green,
grey,
indigo,
orange,
pink,
purple,
red,
yellow,
} from 'design/theme/palette';
import { lighten } from '../utils/colorManipulator';
import { sharedColors, sharedStyles } from './sharedStyles';
import { DataVisualisationColors, Theme, ThemeColors } from './types';
@@ -275,222 +263,6 @@ const colors: ThemeColors = {
activeSearchMatch: '#FFAB00',
},
accessGraph: {
dotsColor: 'rgba(255, 255, 255, 0.1)',
edges: {
dynamicMemberOf: {
color: purple[700],
stroke: purple[500],
},
memberOf: {
color: 'rgba(255, 255, 255, 0.7)',
stroke: '#484c6a',
},
reverse: {
color: blue[700],
stroke: blue[300],
},
allowed: {
color: green[700],
stroke: green[300],
},
disallowed: {
color: red[700],
stroke: red[300],
},
restricted: {
color: yellow[700],
stroke: yellow[900],
},
default: {
color: 'rgba(255, 255, 255, 0.7)',
stroke: 'rgba(255, 255, 255, 0.2)',
},
requestedResource: {
color: 'rgba(255, 255, 255, 0.7)',
stroke: '#484c6a',
},
requestedAction: {
color: 'rgba(255, 255, 255, 0.7)',
stroke: '#484c6a',
},
requestedBy: {
color: 'rgba(255, 255, 255, 0.7)',
stroke: '#484c6a',
},
},
nodes: {
user: {
background: lighten(purple[300], 0.1),
borderColor: 'transparent',
typeColor: purple[700],
iconBackground: purple[400],
handleColor: purple[200],
highlightColor: purple[700],
label: {
background: purple[200],
color: purple[700],
},
},
userGroup: {
background: lighten(orange[300], 0.1),
borderColor: 'transparent',
typeColor: orange[700],
iconBackground: orange[400],
handleColor: orange[200],
highlightColor: orange[700],
label: {
background: orange[200],
color: orange[700],
},
},
temporaryUserGroup: {
background: lighten(orange[200], 0.1),
borderColor: 'transparent',
typeColor: orange[500],
iconBackground: orange[200],
handleColor: orange[200],
highlightColor: orange[200],
label: {
background: orange[200],
color: orange[500],
},
},
resource: {
background: lighten(blue[300], 0.1),
borderColor: 'transparent',
typeColor: blue[700],
iconBackground: blue[400],
handleColor: blue[200],
highlightColor: blue[700],
label: {
background: blue[200],
color: blue[700],
},
},
resourceGroup: {
background: lighten(pink[300], 0.1),
borderColor: 'transparent',
typeColor: pink[700],
iconBackground: pink[400],
handleColor: pink[200],
highlightColor: pink[700],
label: {
background: pink[200],
color: pink[700],
},
},
temporaryResourceGroup: {
background: lighten(pink[200], 0.9),
borderColor: pink[200],
typeColor: pink[200],
iconBackground: pink[200],
handleColor: pink[300],
highlightColor: pink[200],
label: {
background: pink[200],
color: pink[300],
},
},
allowedAction: {
background: lighten(green[300], 0.1),
borderColor: 'transparent',
typeColor: green[700],
iconBackground: green[400],
handleColor: green[200],
highlightColor: green[700],
label: {
background: green[200],
color: green[700],
},
},
temporaryAllowedAction: {
background: lighten(green[200], 0.9),
borderColor: green[200],
typeColor: green[200],
iconBackground: green[200],
handleColor: green[300],
highlightColor: green[200],
label: {
background: green[200],
color: green[300],
},
},
disallowedAction: {
background: lighten(red[300], 0.1),
borderColor: 'transparent',
typeColor: red[700],
iconBackground: red[400],
handleColor: red[200],
highlightColor: red[700],
label: {
background: red[200],
color: red[700],
},
},
allowedRequest: {
background: lighten(indigo[300], 0.9),
borderColor: indigo[300],
typeColor: indigo[300],
iconBackground: indigo[300],
handleColor: indigo[400],
highlightColor: indigo[300],
label: {
background: indigo[200],
color: indigo[700],
},
},
disallowedRequest: {
background: lighten(purple[300], 0.9),
borderColor: purple[300],
typeColor: purple[300],
iconBackground: purple[300],
handleColor: purple[400],
highlightColor: purple[300],
label: {
background: purple[200],
color: purple[700],
},
},
allowedReview: {
background: lighten(indigo[300], 0.9),
borderColor: indigo[300],
typeColor: indigo[300],
iconBackground: indigo[300],
handleColor: indigo[400],
highlightColor: indigo[300],
label: {
background: indigo[200],
color: indigo[700],
},
},
disallowedReview: {
background: lighten(purple[300], 0.9),
borderColor: purple[300],
typeColor: purple[300],
iconBackground: purple[300],
handleColor: purple[400],
highlightColor: purple[300],
label: {
background: purple[200],
color: purple[700],
},
},
accessRequest: {
background: lighten(grey[300], 0.9),
borderColor: grey[300],
typeColor: grey[700],
iconBackground: grey[700],
handleColor: grey[400],
highlightColor: grey[300],
label: {
background: grey[200],
color: grey[700],
},
},
},
},
editor: {
abbey: dataVisualisationColors.tertiary.abbey,
purple: dataVisualisationColors.tertiary.purple,
web/packages/design/src/theme/themes/lightTheme.ts
+2 -228
View File
@@ -16,18 +16,8 @@
* along with this program. If not, see <http://www.gnu.org/licenses/>.
*/
import {
blue,
green,
grey,
indigo,
orange,
pink,
purple,
red,
yellow,
} from '../palette';
import { darken, lighten } from '../utils/colorManipulator';
import { blue } from '../palette';
import { darken } from '../utils/colorManipulator';
import { sharedColors, sharedStyles } from './sharedStyles';
import { DataVisualisationColors, Theme, ThemeColors } from './types';
@@ -270,222 +260,6 @@ const colors: ThemeColors = {
activeSearchMatch: '#FFAB00',
},
accessGraph: {
dotsColor: 'rgba(0, 0, 0, 0.2)',
edges: {
dynamicMemberOf: {
color: purple[700],
stroke: purple[500],
},
memberOf: {
color: 'rgba(0, 0, 0, 0.7)',
stroke: '#c6c7c9',
},
reverse: {
color: 'rgba(0, 0, 0, 0.7)',
stroke: '#c6c7c9',
},
allowed: {
color: green[700],
stroke: green[300],
},
disallowed: {
color: red[700],
stroke: red[300],
},
restricted: {
color: yellow[700],
stroke: yellow[900],
},
default: {
color: 'rgba(0, 0, 0, 0.7)',
stroke: '#c6c7c9',
},
requestedBy: {
color: 'rgba(0, 0, 0, 0.7)',
stroke: '#c6c7c9',
},
requestedAction: {
color: 'rgba(0, 0, 0, 0.7)',
stroke: '#c6c7c9',
},
requestedResource: {
color: 'rgba(0, 0, 0, 0.7)',
stroke: '#c6c7c9',
},
},
nodes: {
user: {
background: lighten(purple[300], 0.9),
borderColor: purple[300],
typeColor: purple[300],
iconBackground: purple[300],
handleColor: purple[700],
highlightColor: purple[300],
label: {
background: purple[200],
color: purple[700],
},
},
userGroup: {
background: lighten(orange[300], 0.9),
borderColor: orange[300],
typeColor: orange[300],
iconBackground: orange[300],
handleColor: orange[700],
highlightColor: orange[300],
label: {
background: orange[200],
color: orange[700],
},
},
temporaryUserGroup: {
background: lighten(orange[200], 0.9),
borderColor: orange[200],
typeColor: orange[200],
iconBackground: orange[200],
handleColor: orange[300],
highlightColor: orange[200],
label: {
background: orange[200],
color: orange[300],
},
},
resource: {
background: lighten(blue[300], 0.9),
borderColor: blue[300],
typeColor: blue[300],
iconBackground: blue[300],
handleColor: blue[400],
highlightColor: blue[300],
label: {
background: blue[200],
color: blue[700],
},
},
resourceGroup: {
background: lighten(pink[300], 0.9),
borderColor: pink[300],
typeColor: pink[300],
iconBackground: pink[300],
handleColor: pink[400],
highlightColor: pink[300],
label: {
background: pink[200],
color: pink[700],
},
},
temporaryResourceGroup: {
background: lighten(pink[200], 0.9),
borderColor: pink[200],
typeColor: pink[200],
iconBackground: pink[200],
handleColor: pink[300],
highlightColor: pink[200],
label: {
background: pink[200],
color: pink[300],
},
},
allowedAction: {
background: lighten(green[300], 0.9),
borderColor: green[300],
typeColor: green[300],
iconBackground: green[300],
handleColor: green[400],
highlightColor: green[300],
label: {
background: green[200],
color: green[700],
},
},
temporaryAllowedAction: {
background: lighten(green[200], 0.9),
borderColor: green[200],
typeColor: green[200],
iconBackground: green[200],
handleColor: green[300],
highlightColor: green[200],
label: {
background: green[200],
color: green[300],
},
},
disallowedAction: {
background: lighten(red[300], 0.9),
borderColor: red[300],
typeColor: red[300],
iconBackground: red[300],
handleColor: purple[400],
highlightColor: red[300],
label: {
background: red[200],
color: red[700],
},
},
allowedRequest: {
background: lighten(indigo[300], 0.9),
borderColor: indigo[300],
typeColor: indigo[300],
iconBackground: indigo[300],
handleColor: indigo[400],
highlightColor: indigo[300],
label: {
background: indigo[200],
color: indigo[700],
},
},
disallowedRequest: {
background: lighten(purple[300], 0.9),
borderColor: purple[300],
typeColor: purple[300],
iconBackground: purple[300],
handleColor: purple[400],
highlightColor: purple[300],
label: {
background: purple[200],
color: purple[700],
},
},
allowedReview: {
background: lighten(indigo[300], 0.9),
borderColor: indigo[300],
typeColor: indigo[300],
iconBackground: indigo[300],
handleColor: indigo[400],
highlightColor: indigo[300],
label: {
background: indigo[200],
color: indigo[700],
},
},
disallowedReview: {
background: lighten(purple[300], 0.9),
borderColor: purple[300],
typeColor: purple[300],
iconBackground: purple[300],
handleColor: purple[400],
highlightColor: purple[300],
label: {
background: purple[200],
color: purple[700],
},
},
accessRequest: {
background: lighten(grey[300], 0.9),
borderColor: grey[300],
typeColor: grey[700],
iconBackground: grey[700],
handleColor: grey[400],
highlightColor: grey[300],
label: {
background: grey[200],
color: grey[700],
},
},
},
},
editor: {
abbey: dataVisualisationColors.tertiary.abbey,
purple: dataVisualisationColors.tertiary.purple,
web/packages/design/src/theme/themes/types.ts
-51
View File
@@ -284,59 +284,8 @@ export type ThemeColors = {
highlightedNavigationItem: string;
dataVisualisation: DataVisualisationColors;
accessGraph: AccessGraphColors;
} & SharedColors;
interface AccessGraphColors {
dotsColor: string;
nodes: {
user: AccessGraphNodeColors;
userGroup: AccessGraphNodeColors;
resource: AccessGraphNodeColors;
resourceGroup: AccessGraphNodeColors;
allowedAction: AccessGraphNodeColors;
disallowedAction: AccessGraphNodeColors;
allowedRequest: AccessGraphNodeColors;
disallowedRequest: AccessGraphNodeColors;
allowedReview: AccessGraphNodeColors;
disallowedReview: AccessGraphNodeColors;
accessRequest: AccessGraphNodeColors;
temporaryUserGroup: AccessGraphNodeColors;
temporaryResourceGroup: AccessGraphNodeColors;
temporaryAllowedAction: AccessGraphNodeColors;
};
edges: {
dynamicMemberOf: AccessGraphEdgeColors;
memberOf: AccessGraphEdgeColors;
reverse: AccessGraphEdgeColors;
allowed: AccessGraphEdgeColors;
disallowed: AccessGraphEdgeColors;
restricted: AccessGraphEdgeColors;
default: AccessGraphEdgeColors;
requestedBy: AccessGraphEdgeColors;
requestedResource: AccessGraphEdgeColors;
requestedAction: AccessGraphEdgeColors;
};
}
interface AccessGraphNodeColors {
background: string;
borderColor: string;
typeColor: string;
iconBackground: string;
handleColor: string;
highlightColor: string;
label: {
background: string;
color: string;
};
}
interface AccessGraphEdgeColors {
color: string;
stroke: string;
}
export type SharedColors = {
dark: string;
light: string;