Use SCSS for stylesheets

3 files changed, 250 insertions, 0 deletions

diff --git a/theme/admin/rsrc/css/import/_font-awesome.scss b/theme/admin/rsrc/css/import/_font-awesome.scss
new file mode 100644
index 0000000..448491f
--- /dev/null
+++ b/theme/admin/rsrc/css/import/_font-awesome.scss
@@ -0,0 +1,138 @@
+/*++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
+# FontAwesome Main
+++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++*/
+.fa {
+	font: normal normal normal 14px/1 "FontAwesome";
+	font-size: inherit;
+	speak: none;
+	display: inline-block;
+	-webkit-font-smoothing: antialiased;
+	-moz-osx-font-smoothing: grayscale
+}
+
+/*++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
+# FontAwesome Icons
+++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++*/
+.fa-bug:before {
+	content: "\f188";
+}
+
+.fa-key:before {
+	content: "\f084";
+}
+
+.fa-link:before {
+	content: "\f0c1";
+}
+
+.fa-bold:before {
+	content: "\f032";
+}
+
+.fa-code:before {
+	content: "\f121";
+}
+
+.fa-user:before {
+	content: "\f007";
+}
+
+.fa-book:before {
+	content: "\f02d";
+}
+
+.fa-italic:before {
+	content: "\f033";
+}
+
+.fa-header:before {
+	content: "\f1dc";
+}
+
+.fa-search:before {
+	content: "\f002";
+}
+
+.fa-trash-o:before {
+	content: "\f014";
+}
+
+.fa-sign-in:before {
+	content: "\f090";
+}
+
+.fa-clock-o:before {
+	content: "\f017";
+}
+
+.fa-list-ul:before {
+	content: "\f0ca";
+}
+
+.fa-list-ol:before {
+	content: "\f0cb";
+}
+
+.fa-database:before {
+	content: "\f1c0";
+}
+
+.fa-language:before {
+	content: "\f1ab";
+}
+
+.fa-sign-out:before {
+	content: "\f08b";
+}
+
+.fa-dashboard:before {
+	content: "\f0e4";
+}
+
+.fa-picture-o:before {
+	content: "\f03e";
+}
+
+.fa-envelope-o:before {
+	content: "\f003";
+}
+
+.fa-arrow-left:before {
+	content: "\f060";
+}
+
+.fa-quote-right:before {
+	content: "\f10e";
+}
+
+.fa-user-secret:before {
+	content: "\f21b";
+}
+
+.fa-file-text-o:before {
+	content: "\f0f6";
+}
+
+.fa-newspaper-o:before {
+	content: "\f1ea";
+}
+
+.fa-arrow-right:before {
+	content: "\f061";
+}
+
+.fa-external-link:before {
+	content: "\f08e";
+}
+
+.fa-github-square:before {
+	content: "\f092";
+}
+
+.fa-pencil-square-o:before {
+	content: "\f044";
+}
+
+.fa-exclamation-triangle:before {
+	content: "\f071";
+}
diff --git a/theme/admin/rsrc/css/import/_fonts.scss b/theme/admin/rsrc/css/import/_fonts.scss
new file mode 100644
index 0000000..2145065
--- /dev/null
+++ b/theme/admin/rsrc/css/import/_fonts.scss
@@ -0,0 +1,32 @@
+/*++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
+# Font "Font Awesome" [4.7.0] (by Fontello): SIL Open Font License (OFL)
+++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++*/
+@font-face {
+	font-family: "FontAwesome";
+	font-weight: 400;
+	src: url("../font/font-awesome-fontello.woff2") format("woff2");
+}
+
+/*++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
+# Font "Kadwa": SIL Open Font License (OFL)
+++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++*/
+@font-face {
+	font-family: "Kadwa";
+	font-weight: 400;
+	src: url("../font/kadwa-n-400.woff2") format("woff2");
+}
+
+/*++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
+# Font "Ruda": SIL Open Font License (OFL)
+++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++*/
+@font-face {
+	font-family: "Ruda";
+	font-weight: 400;
+	src: url("../font/ruda-n-400.woff2") format("woff2");
+}
+
+@font-face {
+	font-family: "Ruda";
+	font-weight: 700;
+	src: url("../font/ruda-n-700.woff2") format("woff2");
+}
diff --git a/theme/admin/rsrc/css/import/_responsive.scss b/theme/admin/rsrc/css/import/_responsive.scss
new file mode 100644
index 0000000..a8275bf
--- /dev/null
+++ b/theme/admin/rsrc/css/import/_responsive.scss
@@ -0,0 +1,80 @@
+/*++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
+# Responsive Level #1
+++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++*/
+@media only screen and (max-width: 50em) {
+	html {
+		font-size: 1.125rem; /*18px*/
+		background-image: none !important;
+	}
+}
+
+/*++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
+# Responsive Level #2
+++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++*/
+@media only screen and (max-width: 37.5em) {
+	.flex.flex-responsive {
+		display: block;
+		width: auto;
+
+		> .flex-item {
+			width: 100%;
+
+			+ .flex-item {
+				border-top: 0.05rem solid #AAA;
+			}
+		}
+	}
+
+	#main-navi {
+		font-size: 1rem;
+
+		li {
+			span {
+				display: none;
+			}
+
+			.fa {
+				margin-right: 0;
+			}
+		}
+
+		a {
+			padding: 0.5rem;
+		}
+	}
+
+	.flex-emoticons {
+		display: none;
+	}
+
+	.actions {
+		float: none;
+		display: flex;
+		width: 100%;
+		flex-grow: 1;
+		justify-content: center;
+		overflow: hidden;
+		box-sizing: border-box;
+
+		li {
+			flex-grow: 1;
+
+			+ li {
+				border-left: none;
+			}
+		}
+	}
+
+	.actions-before {
+		float: none;
+	}
+
+	.arguments {
+		font-size: 0.5rem;
+		line-height: 0.75rem;
+	}
+
+	main {
+		padding: 0.5rem;
+	}
+}