Combine _core.scss from inverse/converse

updates #1091

css/converse.css

@@ -6868,6 +6868,11 @@ body.reset {
   font-size: 14px;
   direction: ltr;
   z-index: 1031; }
+  #conversejs.converse-overlayed > .row {
+    flex-direction: row-reverse; }
+  #conversejs.converse-fullscreen .converse-chatboxes {
+    width: 100vw;
+    right: 15px; }
   #conversejs .brand-heading {
     font-family: "Century Gothic", futura, "URW Gothic L", Verdana, sans-serif; }
     #conversejs .brand-heading .icon-conversejs {
@@ -7201,9 +7206,6 @@ body.reset {
 @media screen and (max-height: 450px) {
   #conversejs {
     left: 0; } }
-#conversejs > .row {
-  flex-direction: row-reverse; }
-
 #conversejs form .form-group {
   margin-bottom: 2em; }
 #conversejs form .form-check-label {

css/fullpage.css

+body {
+    font-family: "Lora", "Helvetica Neue", Helvetica, Arial, sans-serif;
+    color: #ffffff;
+    background-color: #578EA9;
+}
+.brand-heading {
+    font-size: 600%;
+    margin-left: -10%;
+}
+.icon-conversejs {
+    font-size: 88%;
+}
+.brand-heading div.content {
+    height: 100vh;
+    width: 100vw;
+    position: fixed;
+    background-color: #578EA9;
+}
+.brand-heading div.content .inner-content {
+    text-align: center;
+    padding: 7%;
+}
+p.no-chats {
+    padding-right: 10%;
+    font-size: 120%;
+}

css/inverse.css

@@ -6868,6 +6868,11 @@ body.reset {
   font-size: 14px;
   direction: ltr;
   z-index: 1031; }
+  #conversejs.converse-overlayed > .row {
+    flex-direction: row-reverse; }
+  #conversejs.converse-fullscreen .converse-chatboxes {
+    width: 100vw;
+    right: 15px; }
   #conversejs .brand-heading {
     font-family: "Century Gothic", futura, "URW Gothic L", Verdana, sans-serif; }
     #conversejs .brand-heading .icon-conversejs {
@@ -7201,51 +7206,6 @@ body.reset {
 @media screen and (max-height: 450px) {
   #conversejs {
     left: 0; } }
-body {
-  font-family: "Lora", "Helvetica Neue", Helvetica, Arial, sans-serif;
-  color: #ffffff;
-  background-color: #578EA9; }
-  body .brand-heading {
-    font-size: 600%;
-    margin-left: -10%; }
-    body .brand-heading.fade-in {
-      opacity: 0;
-      /* make things invisible upon start */
-      -webkit-animation-name: fadein;
-      -moz-animation-name: fadein;
-      animation-name: fadein;
-      -webkit-animation-fill-mode: forwards;
-      -moz-animation-fill-mode: forwards;
-      animation-fill-mode: forwards;
-      -webkit-animation-duration: 0.75s;
-      -moz-animation-duration: 0.75s;
-      animation-duration: 0.75s;
-      -webkit-animation-timing-function: ease;
-      -moz-animation-timing-function: ease;
-      animation-timing-function: ease;
-      -webkit-animation-delay: 2s;
-      -moz-animation-delay: 2s;
-      animation-delay: 2s; }
-    body .brand-heading .icon-conversejs {
-      font-size: 88%; }
-  body div.content {
-    height: 100vh;
-    width: 100vw;
-    position: fixed;
-    background-color: #578EA9; }
-    body div.content .inner-content {
-      text-align: center;
-      padding: 7%;
-      padding-left: -webkit-calc(5% + 250px);
-      padding-left: calc(5% + 250px); }
-      body div.content .inner-content p.no-chats {
-        padding-right: 10%;
-        font-size: 120%; }
-
-#conversejs.fullscreen .converse-chatboxes {
-  width: 100vw;
-  right: 15px; }
-
 #conversejs form .form-group {
   margin-bottom: 2em; }
 #conversejs form .form-check-label {

dev.html

@@ -9,6 +9,7 @@
     <meta name="author" content="JC Brand" />
     <meta name="keywords" content="xmpp chat webchat converse.js" />
     <link rel="shortcut icon" type="image/ico" href="css/images/favicon.ico"/>
+    <link type="text/css" rel="stylesheet" media="screen" href="css/fullpage.css" />
     <link type="text/css" rel="stylesheet" media="screen" href="css/inverse.css" />
     <script src="node_modules/requirejs/require.js"></script>
     <script src="src/config.js"></script>

fullscreen.html

@@ -8,6 +8,7 @@
     <script type="text/javascript" src="inverse-analytics.js"></script>
     <noscript><p><img src="//stats.opkode.com/piwik.php?idsite=5" style="border:0;" alt="" /></p></noscript>
     <link type="text/css" rel="stylesheet" media="screen" href="css/inverse.css" />
+    <link type="text/css" rel="stylesheet" media="screen" href="css/fullpage.css" />
     <script src="dist/converse.js"></script>
 </head>
 <body class="reset">

sass/_core.scss

@@ -61,6 +61,19 @@ body.reset {
     direction: ltr;
     z-index: 1031; // One more than bootstrap navbar
 
+    &.converse-overlayed {
+        > .row {
+            flex-direction: row-reverse;
+        }
+    }
+
+    &.converse-fullscreen {
+        .converse-chatboxes {
+            width: 100vw;
+            right: 15px; // Hack due to padding added by bootstrap
+        }
+    }
+
     .brand-heading {
         font-family: $heading-font; 
         .icon-conversejs {

sass/converse.scss

@@ -40,7 +40,6 @@
     @import "bootstrap/scss/utilities";
 }
 @import "core";
-@import "converse/core";
 @import "forms";
 @import "profile";
 @import "chatbox";

sass/converse/_core.scss

-#conversejs {
-    > .row {
-        flex-direction: row-reverse;
-    }
-}

sass/inverse.scss

@@ -39,7 +39,6 @@
     @import "bootstrap/scss/utilities";
 }
 @import "core";
-@import "inverse/core";
 @import "forms";
 @import "profile";
 @import "chatbox";

sass/inverse/_core.scss

-body {
-    font-family: "Lora", "Helvetica Neue", Helvetica, Arial, sans-serif;
-    color: #ffffff;
-    background-color: $global-background-color;
-
-    .brand-heading {
-        font-size: 600%;
-        margin-left: -10%;
-        &.fade-in {
-            @include fade-in;
-            @include animation-delay(2s);
-        }
-        .icon-conversejs {
-            font-size: 88%;
-        }
-    }
-
-    div.content {
-        height: 100vh;
-        width: 100vw;
-        position: fixed;
-        background-color: $global-background-color;
-
-        .inner-content {
-            text-align: center;
-            padding: 7%;
-            @include calc(padding-left, '5% + #{$controlbox-width}');
-
-            p.no-chats {
-                padding-right: 10%;
-                font-size: 120%;
-            }
-        }
-    }
-}
-
-#conversejs.fullscreen {
-    .converse-chatboxes {
-        width: 100vw;
-        right: 15px; // Hack due to padding added by bootstrap
-    }
-}