variables.less

/*
 * Standard
 *
 * Copyright (c) 2020-2021 by Marc Anton Dahmen
 * https://marcdahmen.de
 *
 * MIT license
 */

:root {
	--font-family: 'Inter', sans-serif;
	--heading-font-family: var(--font-family);

	--h1-font-size: 2.85rem;
	--h1-line-height: 1.25;
	--h1-font-weight: 680;

	--h2-font-size: 1.95rem;
	--h2-line-height: 1.35;
	--h2-font-weight: 620;

	--h3-font-size: 1.65rem;
	--h3-line-height: 1.375;
	--h3-font-weight: 620;

	--h4-font-size: 1.4rem;
	--h4-line-height: 1.4;
	--h4-font-weight: 580;

	--h5-font-size: 1.25rem;
	--h5-line-height: 1.425;
	--h5-font-weight: 580;

	--h6-font-size: 1.15rem;
	--h6-line-height: 1.475;
	--h6-font-weight: 580;

	--border-width: 2px;
	--cards-gap: 2rem;
	--cards-radius: 1rem;
	--button-radius: 0.4rem;

	// Colors
	--color-page-text: #181818;
	--color-page-bg: #ffffff;
	--color-page-border: #f0f0f0;
	--color-navbar-text: #181818;
	--color-navbar-bg: #ffffff;
	--color-navbar-border: #f0f0f0;
	--color-code-bg: #f8f8f8;
	--color-card-text: #181818;
	--color-card-bg: #f8f8f8;
	--color-card-border: #f8f8f8;

	&.automad-standard-v1-dark {
		--color-page-text: #f4f5f7;
		--color-page-bg: #1f2022;
		--color-page-border: #323437;
		--color-navbar-text: #f4f5f7;
		--color-navbar-bg: #1f2022;
		--color-navbar-border: #404347;
		--color-code-bg: #1a1b1d;
		--color-card-text: #f4f5f7;
		--color-card-bg: #2a2b2e;
		--color-card-border: #2a2b2e;
	}

	// Container
	--am-block-max-width: @block-max-width;
	--am-container-padding: @utility-container-padding-horizontal;

	// Gallery
	--am-gallery-background: @bg-color;
	--am-gallery-controls-color: @text-color;
	--am-gallery-controls-background: @bg-color;

	// Slider
	--am-slider-controls-color: var(--am-gallery-controls-color);
	--am-slider-controls-background: var(--am-gallery-controls-background);

	// Mail and Buttons
	--am-input-placeholder-color: var(--color-page-text);
	--am-input-border: 2px solid var(--color-page-border);
	--am-input-focus-border: 2px solid var(--color-page-text);
	--am-button-border-color: var(--color-page-border);
	--am-button-hover-border-color: var(--color-page-text);
}