constructor() — astro Function Reference

Architecture documentation for the constructor() function in audit-list-window.ts from the astro codebase.

Function typescript DevToolbar ToolbarClient calls 1

Entity Profile

DevToolbar→ ToolbarClient→ constructor() — astro Function Reference

Dependency Diagram

graph TD
  fc2a9f53_5444_6ab3_d206_b11bfc963b60["constructor()"]
  2820377c_6ad7_088f_76c0_f267b0ec96bf["DevToolbarAuditListWindow"]
  fc2a9f53_5444_6ab3_d206_b11bfc963b60 -->|defined in| 2820377c_6ad7_088f_76c0_f267b0ec96bf
  96244a82_d7f1_2058_d2c1_2692abe88e12["createRoundedBadge()"]
  fc2a9f53_5444_6ab3_d206_b11bfc963b60 -->|calls| 96244a82_d7f1_2058_d2c1_2692abe88e12
  style fc2a9f53_5444_6ab3_d206_b11bfc963b60 fill:#6366f1,stroke:#818cf8,color:#fff

Relationship Graph

Source Code

packages/astro/src/runtime/client/dev-toolbar/apps/audit/ui/audit-list-window.ts lines 54–344

	constructor() {
		super();
		this.shadowRoot = this.attachShadow({ mode: 'open' });

		this.shadowRoot.innerHTML = `<style>
			:host {
				box-sizing: border-box;
				display: flex;
				flex-direction: column;
				background: linear-gradient(0deg, #13151a, #13151a), linear-gradient(0deg, #343841, #343841);
				border: 1px solid rgba(52, 56, 65, 1);
				width: min(640px, 100%);
				max-height: 480px;
				border-radius: 12px;
				padding: 24px;
				font-family:
					ui-sans-serif,
					system-ui,
					-apple-system,
					BlinkMacSystemFont,
					"Segoe UI",
					Roboto,
					"Helvetica Neue",
					Arial,
					"Noto Sans",
					sans-serif,
					"Apple Color Emoji",
					"Segoe UI Emoji",
					"Segoe UI Symbol",
					"Noto Color Emoji";
				color: rgba(191, 193, 201, 1);
				position: fixed;
				z-index: 2000000009;
				bottom: 72px;
				left: 50%;
				transform: translateX(-50%);
				box-shadow:
					0px 0px 0px 0px rgba(19, 21, 26, 0.3),
					0px 1px 2px 0px rgba(19, 21, 26, 0.29),
					0px 4px 4px 0px rgba(19, 21, 26, 0.26),
					0px 10px 6px 0px rgba(19, 21, 26, 0.15),
					0px 17px 7px 0px rgba(19, 21, 26, 0.04),
					0px 26px 7px 0px rgba(19, 21, 26, 0.01);
			}

			@media (forced-colors: active) {
				:host {
					background: white;
				}
			}

			@media (max-width: 640px) {
				:host {
					border-radius: 0;
				}
			}

			hr,
			::slotted(hr) {
				border: 1px solid rgba(27, 30, 36, 1);
				margin: 1em 0;
			}

			.reset-button {
				text-align: left;
				border: none;
				margin: 0;
				width: auto;
				overflow: visible;
				background: transparent;
				font: inherit;
				line-height: normal;
				-webkit-font-smoothing: inherit;
				-moz-osx-font-smoothing: inherit;
				-webkit-appearance: none;
				padding: 0;
			}

			:host {
				left: initial;
				top: 8px;