graphite_vue/src/assets/style/tailwind.css

@tailwind base;
@tailwind components;
@tailwind utilities;

@layer utilities {
    .btn-dark {
		display: flex;
		justify-content: center;
		align-items: center;
		background: linear-gradient(90deg, #0657c0 24%, #096ae0 101%);
		border-radius: 4px;
		color: white;
	}
	.btn-light {
		display: flex;
		justify-content: center;
		align-items: center;
		background: linear-gradient(180deg, #ebf1fa 0%, #f8fafd 100%);
		box-shadow: 0px -1px 0px 0px rgba(255, 255, 255, 0.3), 0px 1px 5px 0px rgba(173, 173, 173, 0.47);
		border-radius: 4px;
		color: var(--primaryColor);
	}
    .component-page {
		height: calc(100vh - var(--headerHeight) - var(--footerHeight));
        width: calc(100vw - var(--menuAreaWidth));
	}
}