Index: includes/styleguide/style.html |
=================================================================== |
new file mode 100644 |
--- /dev/null |
+++ b/includes/styleguide/style.html |
@@ -0,0 +1,104 @@ |
+<style> |
+ |
+.sg-body |
+{ |
+ margin: 70px auto; |
+ padding: 0 60px; |
+ max-width: 700px; |
+} |
+ |
+.sg-section |
+{ |
+ margin-bottom: 100px; |
+} |
+ |
+.sg-section .sg-section |
+{ |
+ margin-bottom: 50px; |
+} |
+ |
+[class^=sg-h], |
+.sg-p |
+{ |
+ font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue" !important; |
+ text-transform: none !important; |
+ margin: 0 !important; |
+ padding: 0 !important; |
+ color: slategray !important; |
+ position: relative !important; |
+} |
+ |
+[class^=sg-h] |
+{ |
+ font-weight: 700 !important; |
+} |
+ |
+[class^=sg-h]:before |
+{ |
+ position: absolute !important; |
+ top: 0 !important; |
+} |
+ |
+.sg-h1:before |
+{ |
+ content: "#" !important; |
+ left: -30px !important; |
+} |
+ |
+.sg-h2:before |
+{ |
+ content: "##" !important; |
+ left: -40px !important; |
+} |
+ |
+.sg-h3:before |
+{ |
+ content: "###" !important; |
+ left: -50px !important; |
+} |
+ |
+.sg-h1 |
+{ |
+ margin-bottom: 20px !important; |
+ font-size: 30px !important; |
+} |
+ |
+.sg-h2 |
+{ |
+ margin-bottom: 50px !important; |
+ font-size: 26px !important; |
+} |
+ |
+.sg-h3 |
+{ |
+ margin-bottom: 20px !important; |
+ font-size: 22px !important; |
+} |
+ |
+.sg-p |
+{ |
+ font-size: 16px !important; |
+ font-weight: 300 !important; |
+} |
+ |
+.sg-input-group |
+{ |
+ max-width: 50%; |
+} |
+ |
+[dir="rtl"] .sg-h1:before |
+{ |
+ right: -30px !important; |
+} |
+ |
+[dir="rtl"] .sg-h2:before |
+{ |
+ right: -40px !important; |
+} |
+ |
+[dir="rtl"] .sg-h3:before |
+{ |
+ right: -50px !important; |
+} |
+ |
+</style> |