diff options
Diffstat (limited to 'includes')
| -rw-r--r-- | includes/head.php | 188 | ||||
| -rw-r--r-- | includes/style.css | 181 | 
2 files changed, 185 insertions, 184 deletions
diff --git a/includes/head.php b/includes/head.php index 748e4b7..6e0bc4e 100644 --- a/includes/head.php +++ b/includes/head.php @@ -2,204 +2,24 @@  <html lang="en-US">  <head> +	<title>53hornet</title>  	<meta charset="utf-8" />  	<meta name="viewport" content="width=device-width, initial-scale=1" />  	<meta property="og:description" content="The World Wide Web pages of Adam Carpenter" /> -	<meta property="og:image" content="https://nextcloud.53hor.net/index.php/s/Nx9e7iHbw4t99wo/preview" /> +	<meta property="og:image" content="/assets/53hornet.svg" />  	<meta property="og:site_name" content="53hor.net" />  	<meta property="og:title" content="Adam Carpenter (53hornet)" />  	<meta property="og:type" content="website" />  	<meta property="og:url" content="https://www.53hor.net" />  	<style> -		@font-face { -			font-family: "Iosevka Slab"; -			font-display: swap; -			src: url("/assets/iosevka-slab-regular.woff2"); -		} - -		:root { -			--balboa: #195970; -			--ruby: #9b111e; -			--slate: #b9c2ca; -			--charcoal: #798d94; -			--white: white; -			--box-radius: 0.5em; -			--box-border: 0.5em solid var(--white); -		} - -		body { -			font-family: "Iosevka Slab", monospace; -			font-size: 1.5em; -			background-color: var(--balboa); -			color: var(--white); -			max-width: 50em; -			margin: auto; -			padding: 1em; -		} - -		hr { -			color: var(--white); -		} - -		nav { -			list-style-type: none; -			text-align: center; -		} - -		nav ul { -			padding: 0; -			margin: 0; -		} - -		nav li { -			display: inline-block; -			margin: 0.5em; -			padding: 0.5em; -		} - -		nav svg { -			padding-right: 0.5em; -			width: 24px; -			height: 24px; -		} - - -		nav svg path, -		nav svg rect { -			fill: var(--white); -		} - -		nav a:link, -		nav a:visited, -		nav a:hover, -		nav a:active { -			display: flex; -			align-items: center; -			color: var(--white); -			text-decoration: none; -		} - -		a:link { -			color: var(--slate); -		} - -		a:visited { -			color: var(--charcoal); -		} - -		pre { -			white-space: pre-wrap; -			display: block; -			background-color: var(--charcoal); -			padding: 1em; -			border-radius: var(--box-radius); -			border-left: var(--box-border); -			border-right: var(--box-border); -			overflow: auto; -		} - -		.description { -			background-color: var(--ruby); -			padding: 1em; -			border-radius: var(--box-radius); -			border-left: var(--box-border); -			border-right: var(--box-border); -		} - -		h1, -		blockquote { -			font-style: oblique; -		} - -		header { -			text-align: center; -		} - -		article ul { -			list-style: none; -			padding: 0; -			margin: 0; -		} - -		article ul li { -			padding: 0.5em; -		} - -		article ul li:before { -			content: "➙"; -			padding-right: 0.5em; -		} - -		article ol li { -			padding: 0.5em; -		} - -		p img { -			display: block; -			margin-top: 1em; -			margin-left: auto; -			margin-right: auto; -			max-width: 75%; -			height: auto; -			border-radius: var(--box-radius); -			border-left: var(--box-border); -			border-right: var(--box-border); -		} - -		iframe { -			display: block; -			margin-left: auto; -			margin-right: auto; -		} - -		.list { -			overflow-x: auto; -		} - -		.list table { -			width: 100%; -		} - -		.list td, -		th { -			padding: 0.5em; -			text-align: left; -			border-bottom: 1px solid var(--charcoal); -		} - -		.form { -			text-align: center; -		} - -		.form input { -			font-size: 1em; -			margin-top: 1em; -			border-radius: 3em; -			box-sizing: border-box; -			padding: 0.5em; -			border: 0; -		} - -		.form .description { -			display: none; -		} +		<?php include('./includes/style.css'); ?>  	</style> -	<?php -	if (isset($title)) { -		printf('<title>53hornet ➙ %s</title>', $title); -	} else { -		echo '<title>53hornet</title>'; -	} -	?> -  	<link rel="icon" href="/assets/53hornet.svg" type="image/svg+xml">  </head>  <body> -	<?php -	include('nav.php'); -	?> +	<?php include('nav.php'); ?>  	<article> diff --git a/includes/style.css b/includes/style.css new file mode 100644 index 0000000..e3189fd --- /dev/null +++ b/includes/style.css @@ -0,0 +1,181 @@ +@font-face { +  font-family: "Iosevka Slab"; +  font-display: swap; +  src: url("/assets/iosevka-slab-regular.woff2"); +} + +:root { +  --balboa: #195970; +  --ruby: #9b111e; +  --slate: #b9c2ca; +  --charcoal: #798d94; +  --white: white; +  --box-radius: 0.25em; +  --box-border: 0.5em solid var(--white); +} + +body { +  font-family: "Iosevka Slab", monospace; +  font-size: 1.5em; +  background-color: var(--balboa); +  color: var(--white); +  max-width: 50em; +  margin: auto; +  padding: 1em; +} + +hr { +  color: var(--white); +} + +nav { +  list-style-type: none; +  text-align: center; +} + +nav ul { +  padding: 0; +  margin: 0; +} + +nav li { +  display: inline-block; +  margin: 0.5em; +  padding: 0.5em; +} + +nav svg { +  padding-right: 0.5em; +  width: 24px; +  height: 24px; +} + +nav svg path, +nav svg rect { +  fill: var(--white); +} + +a:link { +  color: var(--slate); +  background-color: var(--balboa); +  border-radius: var(--box-radius); +} + +a:visited { +  color: var(--charcoal); +} + +a:hover { +  transition: 0.25s; +  background-color: var(--slate); +  color: var(--balboa); +  text-decoration: none; +} + +nav a:link, +nav a:visited, +nav a:hover, +nav a:active { +  background-color: var(--balboa); +  display: flex; +  align-items: center; +  color: var(--white); +  text-decoration: none; +} + +pre { +  white-space: pre-wrap; +  display: block; +  background-color: var(--charcoal); +  padding: 1em; +  border-radius: var(--box-radius); +  border-left: var(--box-border); +  border-right: var(--box-border); +  overflow: auto; +} + +.description { +  background-color: var(--ruby); +  padding: 1em; +  border-radius: var(--box-radius); +  border-left: var(--box-border); +  border-right: var(--box-border); +} + +h1, +blockquote { +  font-style: oblique; +} + +header { +  text-align: center; +} + +article ul { +  list-style: none; +  padding: 0; +  margin: 0; +} + +article ul li { +  padding: 0.5em; +} + +article ul li:before { +  content: "➙"; +  padding-right: 0.5em; +} + +article ol li { +  padding: 0.5em; +} + +p img { +  display: block; +  margin-top: 1em; +  margin-left: auto; +  margin-right: auto; +  max-width: 75%; +  height: auto; +  border-radius: var(--box-radius); +  border-left: var(--box-border); +  border-right: var(--box-border); +} + +iframe { +  display: block; +  margin-left: auto; +  margin-right: auto; +} + +.list { +  overflow-x: auto; +} + +.list table { +  width: 100%; +} + +.list td, +th { +  padding: 0.5em; +  text-align: left; +  border-bottom: 1px solid var(--charcoal); +} + +.form { +  text-align: center; +} + +.form input { +  font-size: 1em; +  margin-top: 1em; +  border-radius: 3em; +  box-sizing: border-box; +  padding: 0.5em; +  border: 0; +} + +.form .description { +  display: none; +}  |