Extract styles into stylesheet.

schungx · schungx · commit b72f190e6475 · 2021-07-13T14:24:13.000+08:00
diff --git a/index.html b/index.html
@@ -12,76 +12,7 @@
     <meta name="theme-color" content="#ffd675">
 
     <link rel="shortcut icon" href="https://rhai.rs/book/favicon.png">
-
-    <style>
-        * {
-            margin: 0;
-            padding: 0;
-            box-sizing: border-box;
-            font-family: sans-serif;
-        }
-
-        body {
-            /* Gradient from logo */
-            background: #f67501;
-            background: linear-gradient(180deg, #ffd675 0%, #f67501 100%);
-        }
-
-        .center {
-            margin: 1rem;
-            min-height: calc(100vh - 2rem);
-            display: flex;
-            justify-content: center;
-            align-items: center;
-            text-align: center;
-        }
-
-        main {
-            max-width: 42rem;
-            padding: 1rem;
-            background: white;
-            border-radius: 0.5rem;
-            line-height: 1.5rem;
-        }
-
-        .space-lg {
-            margin-top: 1.5rem;
-        }
-
-        .space-sm {
-            margin-top: 0.5rem;
-        }
-
-        .logo {
-            display: block;
-            max-width: 50%;
-            margin: 0 auto;
-        }
-
-        .icon {
-            height: 1.25rem;
-            display: inline-block;
-            vertical-align: bottom;
-            margin-right: 0.1rem;
-        }
-
-        a {
-            text-decoration: none;
-        }
-
-        a:hover {
-            text-decoration: underline;
-        }
-
-        h1 {
-            font-size: 1.3rem;
-        }
-
-        .item {
-            display: inline-block;
-            margin: 0.2rem 0.25rem;
-        }
-    </style>
+    <link rel="stylesheet" type="text/css" href="styles.css" />
 </head>
 
 <body>
diff --git a/styles.css b/styles.css
@@ -0,0 +1,67 @@
+* {
+	margin: 0;
+	padding: 0;
+	box-sizing: border-box;
+	font-family: sans-serif;
+}
+
+body {
+	/* Gradient from logo */
+	background: #f67501;
+	background: linear-gradient(180deg, #ffd675 0%, #f67501 100%);
+}
+
+.center {
+	margin: 1rem;
+	min-height: calc(100vh - 2rem);
+	display: flex;
+	justify-content: center;
+	align-items: center;
+	text-align: center;
+}
+
+main {
+	max-width: 42rem;
+	padding: 1rem;
+	background: white;
+	border-radius: 0.5rem;
+	line-height: 1.5rem;
+}
+
+.space-lg {
+	margin-top: 1.5rem;
+}
+
+.space-sm {
+	margin-top: 0.5rem;
+}
+
+.logo {
+	display: block;
+	max-width: 50%;
+	margin: 0 auto;
+}
+
+.icon {
+	height: 1.25rem;
+	display: inline-block;
+	vertical-align: bottom;
+	margin-right: 0.1rem;
+}
+
+a {
+	text-decoration: none;
+}
+
+a:hover {
+	text-decoration: underline;
+}
+
+h1 {
+	font-size: 1.3rem;
+}
+
+.item {
+	display: inline-block;
+	margin: 0.2rem 0.25rem;
+}
