bundling de css usando o esbuild

1 files changed, 108 insertions, 0 deletions

diff --git a/styles/base.css b/styles/base.css
new file mode 100644
index 0000000..e4f3bdd
--- /dev/null
+++ b/styles/base.css
@@ -0,0 +1,108 @@
+* {
+    box-sizing: border-box;
+}
+
+body {
+	color: #999;
+	background-color: #000;
+
+	width: 90%;
+	max-width: 1000px;
+	margin: 20px auto;
+	font-size: 16px;
+}
+
+header {
+	margin: auto;
+}
+
+header h1 {
+	display: inline;
+	margin: 1px;
+}
+
+header h2 {
+	margin: 1px;
+}
+
+main {
+	display: flex;
+	flex-direction: column;
+	line-height: 1.6;
+}
+
+main > div {
+	margin: 5px;
+}
+
+footer {
+    font-size: 0.8rem;
+    text-align: center;
+    opacity: 0.7;
+}
+
+a, a:visited {
+	color: #0077aa;
+}
+
+a:hover {
+	color: #00aaee;
+}
+
+pre {
+	max-width: 100%;
+	overflow: auto;
+	background: #050505; 
+	padding: 10px;
+	border: 1px dashed #999;
+}
+
+nav {
+	display: block;
+	padding-top: 5px;
+}
+
+.header-container {
+	display: flex;
+	flex-direction: column;
+}
+
+.esquizo {
+	width: 100px;
+	display: inline;
+}
+
+.content {
+	padding: 5px;
+	flex-grow: 1;
+	overflow: auto;
+	border: dashed 1px #999;
+	background: #050505;
+}
+
+.bottom-align { 
+	display: flex; 
+	flex-direction: column; 
+	justify-content: flex-end; 
+}
+
+.image-container {
+	text-align: center;
+}
+
+.image-container > img {
+	display: inline;
+	max-width: 100%;
+}
+
+@media (min-width: 1000px) {
+    .header-container {
+		justify-content: center;
+        flex-direction: row;
+    }
+
+	main {
+		flex-direction: row;
+	}
+}
+