消息

TUIKit/assets/styles/common.scss

@@ -0,0 +1,59 @@
+body, div, ul, ol, dt, dd, li, dl, h1, h2, h3, h4, p {
+  margin:0;
+  padding:0;
+  font-style:normal;
+
+  /* font:12px/22px"\5B8B\4F53",Arial,Helvetica,sans-serif; */
+}
+
+ol, ul, li {
+  list-style:none;
+}
+
+img {
+  border:0;
+  vertical-align:middle;
+  pointer-events:none;
+}
+
+body {
+  color:#000;
+  background:#FFF;
+}
+
+.clear {
+  clear:both;
+  height:1px;
+  width:100%;
+  overflow:hidden;
+  margin-top:-1px;
+}
+
+a {
+  color:#000;
+  text-decoration:none;
+  cursor: pointer;
+}
+
+a:hover {
+  text-decoration:none;
+}
+
+input, textarea {
+  user-select: auto;
+}
+
+input:focus, input:active, textarea:focus, textarea:active {
+  outline: none;
+}
+
+.chat-aside {
+  position: absolute;
+  top: 50px;
+  right: 0;
+  box-sizing: border-box;
+  width: 360px !important;
+  border-radius: 8px 0 0 8px;
+  z-index: 9999;
+  max-height: calc(100% - 50px);
+}

TUIKit/assets/styles/sample.scss

@@ -0,0 +1,99 @@
+/* stylelint-disable */
+.TUIKit {
+  display: flex;
+  width: 100vw;
+  height: 100vh;
+  overflow: hidden;
+  text-align: left;
+  .TUIKit-navbar {
+    background: #e8e8e9;
+    overflow: hidden;
+    .TUIKit-navbar-item {
+      padding: 10px;
+      color: #147aff;
+      font-weight: 500;
+      cursor: pointer;
+    }
+    .TUIKit-navbar-item-active {
+      background: #dddddd;
+    }
+  }
+  .TUIKit-main-container {
+    flex: 1;
+    display: flex;
+    overflow: hidden;
+    .TUIKit-main {
+      flex: 1;
+      display: flex;
+      .TUIKit-main-aside {
+        min-width: 285px;
+        flex: 0 0 24%;
+        border-right: 1px solid #f4f5f9;
+      }
+      .TUIKit-main-main {
+        flex: 1;
+        display: flex;
+        .chat{
+          flex: 1;
+        }
+        .chat-aside {
+          position: absolute;
+          top: 50px;
+          right: 0;
+          box-sizing: border-box;
+          max-width: 360px;
+          max-height: calc(100% - 50px);
+          border-radius: 8px 0 0 8px;
+          z-index: 9999;
+        }
+      }
+    }
+    .callkit-container {
+      position: fixed;
+      left: calc(50% - 25rem);
+      top: calc(50% - 18rem);
+      width: 50rem;
+      height: 36rem;
+    }
+    .callkit-container.miniMized {
+      left: auto;
+      right: 10px;
+      top: 70px;
+      background: transparent;
+    }
+  }
+}
+.TUIKit-h5 {
+  display: flex;
+  flex-direction: column-reverse;
+  .TUIKit-navbar {
+    display: flex;
+    flex-direction: row;
+    .TUIKit-navbar-item {
+      flex: 1;
+      text-align: center;
+      cursor: none;
+    }
+  }
+  .TUIKit-main-container {
+    flex: 1;
+    .TUIKit-main {
+      .TUIKit-main-aside {
+        flex: 1;
+      }
+      .TUIKit-main-main {
+        .chat-popup {
+          position: absolute;
+          max-width: 100%;
+          max-height: 100%;
+        }
+      }
+    }
+    .callkit-container {
+      left: 0;
+      top: 0;
+      width: 100%;
+      height: 100%;
+    }
+  }
+}