sike/css/resume.less

/* Reset */
*, *::before, *::after {
	box-sizing: border-box;
	padding: 0;
	margin: 0;
}

:root {
	min-width: 100vw;
	min-height: 100vh;
}

body {
	padding: 0;
	margin: 0;
}

/* Style */
:root {
	font-family: "Inter";
	font-size: 18pt;
}

body {
	padding: 1.5rem;
	line-height: 1.3;
	max-width: 100ch;
	margin: 0 auto;
}

a {
	color: inherit;
}

.info {
	display: grid;
	grid-template-columns: 1fr min-content;

	.name {
		grid-row: 1 / 3;
		font-size: 2rem;
	}

	margin-bottom: 0.5em;
}

section {
	header {
		font-size: 1.5rem;
		margin-bottom: 0.15rem;
	}

	margin-bottom: 0.5em;
}

.experience {
	display: grid;
	grid-template-columns: max-content 1fr max-content;
	margin-bottom: 0.5em;

	.title {
		font-weight: 600;
	}

	.company {
		font-style: italic;

		&::before {
			font-style: normal;
			display: inline-block;
			content: "\00a0|\00a0";
		}
	}

	.skills {
		grid-column: 1 / 4;
	}

	.highlights {
		grid-column: 1 / 4;
		font-size: 0.9rem;

		padding-left: 1em;
	}
}

.projects {
	display: grid;
	grid-template-columns: 1fr 1fr;

	aside {
		display: flex;
		align-items: center;
		justify-content: flex-end;
		font-style: italic;
		text-align: right;
		font-size: 0.8rem;
	}

	.project {
		display: grid;
		grid-template-columns: max-content 1fr;
		grid-template-rows: repeat(2, min-content);

		.name {
			font-weight: 600;
		}

		.skills {
			&::before {
				font-style: normal;
				display: inline-block;
				content: "\00a0|\00a0";
			}
		}

		.description {
			grid-column: 1 / 3;
		}
	}
}


.education {
	display: grid;
	grid-template-columns: fit-content(100%) max-content;

	header {
		grid-column: 1 / 3;
	}

	.university {
		font-weight: 600;

		&::after {
			font-weight: normal;
			display: inline-block;
			content: "\00a0\2014\00a0"
		}
	}

	.degree {
		grid-column: 1 / 3;
	}
}


@media print {
	body {
		padding: 0;
		margin: 1.5rem;
	}

	@page {
		margin: 0;
	}

	:root {
		font-size: 14pt;
	}

	section.projects {
		padding-top: 22px;
	}
}