@teselagen/ui 0.7.31 → 0.7.33-beta.1

package/src/BounceLoader/style.css

@@ -1,45 +0,0 @@
-.tg-bounce-loader {
-  width: 50px;
-  height: 40px;
-  text-align: center;
-  font-size: 10px;
-  display: flex;
-  align-items: center;
-}
-
-.tg-bounce-loader > div {
-  background-color: #006cab;
-  height: 100%;
-  max-height: 30px;
-  width: 6px;
-  display: inline-block;
-  margin-right: 3px;
-  animation: sk-stretchdelay 1.2s infinite ease-in-out;
-}
-
-.tg-bounce-loader .rect2 {
-  animation-delay: -1.1s;
-}
-
-.tg-bounce-loader .rect3 {
-  animation-delay: -1s;
-}
-
-.tg-bounce-loader .rect4 {
-  animation-delay: -0.9s;
-}
-
-.tg-bounce-loader .rect5 {
-  animation-delay: -0.8s;
-}
-
-@keyframes sk-stretchdelay {
-  0%,
-  40%,
-  100% {
-    transform: scaleY(0.4);
-  }
-  20% {
-    transform: scaleY(1);
-  }
-}

package/src/CollapsibleCard/index.js

@@ -1,68 +0,0 @@
-import React, { useState } from "react";
-import { Button, Classes, Icon } from "@blueprintjs/core";
-import classNames from "classnames";
-import "./style.css";
-
-export default function CollapsibleCard({
-  title,
-  icon,
-  openTitleElements,
-  noCard = false,
-  className,
-  style,
-  children,
-  initialClosed = false,
-  toggle,
-  isOpen
-}) {
-  let [open, setOpen] = useState(!initialClosed);
-  if (isOpen !== undefined) open = isOpen;
-
-  const toggleCardInfo = () => {
-    if (toggle) toggle();
-    else {
-      setOpen(!open);
-    }
-  };
-
-  return (
-    <div
-      className={classNames({ "tg-card": !noCard, open }, className)}
-      style={{
-        paddingTop: 10,
-        paddingBottom: 10,
-        paddingLeft: 15,
-        paddingRight: 15,
-        ...style
-      }}
-    >
-      <div className="tg-card-header" style={{ marginBottom: 8 }}>
-        <div className="tg-card-header-title">
-          {icon && <Icon icon={icon} />}
-          <h6
-            style={{
-              marginBottom: 0,
-              marginRight: 10,
-              marginLeft: 10
-            }}
-          >
-            {title}
-          </h6>
-          <div>{open && openTitleElements}</div>
-        </div>
-        <div>
-          <Button
-            icon={open ? "minimize" : "maximize"}
-            className={classNames(
-              Classes.MINIMAL,
-              "info-btn",
-              "tg-collapse-toggle"
-            )}
-            onClick={toggleCardInfo}
-          />
-        </div>
-      </div>
-      {open && children}
-    </div>
-  );
-}

package/src/CollapsibleCard/style.css

@@ -1,23 +0,0 @@
-/* Use in the place of .bp3-card */
-.tg-card {
-  padding: 20px;
-  margin-bottom: 20px;
-  border-radius: 5px;
-  background: white;
-  box-shadow:
-    0 1px 3px rgba(0, 0, 0, 0.12),
-    0 1px 2px rgba(0, 0, 0, 0.18);
-}
-
-.tg-card-header {
-  display: flex;
-  flex-direction: row;
-  justify-content: space-between;
-  align-items: center;
-}
-
-.tg-card-header-title {
-  display: flex;
-  flex-direction: row;
-  align-items: center;
-}

package/src/DNALoader/index.js

@@ -1,20 +0,0 @@
-import React from "react";
-import classNames from "classnames";
-import "./style.css";
-
-export default function DNALoader({ style, className }) {
-  return (
-    <div className={classNames("dna-loader", className)} style={style}>
-      <div className="nucleobase" />
-      <div className="nucleobase" />
-      <div className="nucleobase" />
-      <div className="nucleobase" />
-      <div className="nucleobase" />
-      <div className="nucleobase" />
-      <div className="nucleobase" />
-      <div className="nucleobase" />
-      <div className="nucleobase" />
-      <div className="nucleobase" />
-    </div>
-  );
-}

package/src/DNALoader/style.css

@@ -1,251 +0,0 @@
-.dna-loader {
-  display: inline-block;
-  position: relative;
-  transform: scale(0.45);
-}
-
-.nucleobase {
-  display: inline-block;
-  position: relative;
-  vertical-align: middle;
-}
-
-.nucleobase:not(:last-child) {
-  margin-right: 4.86vh;
-}
-
-.nucleobase:before,
-.nucleobase:after {
-  content: "";
-  display: inline-block;
-  width: 3vh;
-  height: 3vh;
-  border-radius: 50%;
-  position: absolute;
-}
-
-.nucleobase:nth-child(10) {
-  animation-delay: -1.869s;
-}
-
-.nucleobase:nth-child(10):before {
-  animation: animBefore 2.1s cubic-bezier(0.42, 0, 0.58, 1) infinite;
-  animation-delay: -1.869s;
-  background-color: #339bb9;
-}
-
-.nucleobase:nth-child(10):after {
-  animation: animAfter 2.1s cubic-bezier(0.42, 0, 0.58, 1) infinite;
-  animation-delay: -1.869s;
-  background-color: #006cab;
-}
-
-.nucleobase:nth-child(9) {
-  animation-delay: -3.738s;
-}
-
-.nucleobase:nth-child(9):before {
-  animation: animBefore 2.1s cubic-bezier(0.42, 0, 0.58, 1) infinite;
-  animation-delay: -3.738s;
-  background-color: #339bb9;
-}
-
-.nucleobase:nth-child(9):after {
-  animation: animAfter 2.1s cubic-bezier(0.42, 0, 0.58, 1) infinite;
-  animation-delay: -3.738s;
-  background-color: #006cab;
-}
-
-.nucleobase:nth-child(8) {
-  animation-delay: -5.607s;
-}
-
-.nucleobase:nth-child(8):before {
-  animation: animBefore 2.1s cubic-bezier(0.42, 0, 0.58, 1) infinite;
-  animation-delay: -5.607s;
-  background-color: #339bb9;
-}
-
-.nucleobase:nth-child(8):after {
-  animation: animAfter 2.1s cubic-bezier(0.42, 0, 0.58, 1) infinite;
-  animation-delay: -5.607s;
-  background-color: #006cab;
-}
-
-.nucleobase:nth-child(7) {
-  animation-delay: -7.476s;
-}
-
-.nucleobase:nth-child(7):before {
-  animation: animBefore 2.1s cubic-bezier(0.42, 0, 0.58, 1) infinite;
-  animation-delay: -7.476s;
-  background-color: #339bb9;
-}
-
-.nucleobase:nth-child(7):after {
-  animation: animAfter 2.1s cubic-bezier(0.42, 0, 0.58, 1) infinite;
-  animation-delay: -7.476s;
-  background-color: #006cab;
-}
-
-.nucleobase:nth-child(6) {
-  animation-delay: -9.345s;
-}
-
-.nucleobase:nth-child(6):before {
-  animation: animBefore 2.1s cubic-bezier(0.42, 0, 0.58, 1) infinite;
-  animation-delay: -9.345s;
-  background-color: #339bb9;
-}
-
-.nucleobase:nth-child(6):after {
-  animation: animAfter 2.1s cubic-bezier(0.42, 0, 0.58, 1) infinite;
-  animation-delay: -9.345s;
-  background-color: #006cab;
-}
-
-.nucleobase:nth-child(5) {
-  animation-delay: -11.214s;
-}
-
-.nucleobase:nth-child(5):before {
-  animation: animBefore 2.1s cubic-bezier(0.42, 0, 0.58, 1) infinite;
-  animation-delay: -11.214s;
-  background-color: #339bb9;
-}
-
-.nucleobase:nth-child(5):after {
-  animation: animAfter 2.1s cubic-bezier(0.42, 0, 0.58, 1) infinite;
-  animation-delay: -11.214s;
-  background-color: #006cab;
-}
-
-.nucleobase:nth-child(4) {
-  animation-delay: -13.083s;
-}
-
-.nucleobase:nth-child(4):before {
-  animation: animBefore 2.1s cubic-bezier(0.42, 0, 0.58, 1) infinite;
-  animation-delay: -13.083s;
-  background-color: #339bb9;
-}
-
-.nucleobase:nth-child(4):after {
-  animation: animAfter 2.1s cubic-bezier(0.42, 0, 0.58, 1) infinite;
-  animation-delay: -13.083s;
-  background-color: #006cab;
-}
-
-.nucleobase:nth-child(3) {
-  animation-delay: -14.952s;
-}
-
-.nucleobase:nth-child(3):before {
-  animation: animBefore 2.1s cubic-bezier(0.42, 0, 0.58, 1) infinite;
-  animation-delay: -14.952s;
-  background-color: #339bb9;
-}
-
-.nucleobase:nth-child(3):after {
-  animation: animAfter 2.1s cubic-bezier(0.42, 0, 0.58, 1) infinite;
-  animation-delay: -14.952s;
-  background-color: #006cab;
-}
-
-.nucleobase:nth-child(2) {
-  animation-delay: -16.821s;
-}
-
-.nucleobase:nth-child(2):before {
-  animation: animBefore 2.1s cubic-bezier(0.42, 0, 0.58, 1) infinite;
-  animation-delay: -16.821s;
-  background-color: #339bb9;
-}
-
-.nucleobase:nth-child(2):after {
-  animation: animAfter 2.1s cubic-bezier(0.42, 0, 0.58, 1) infinite;
-  animation-delay: -16.821s;
-  background-color: #006cab;
-}
-
-.nucleobase:nth-child(1) {
-  animation-delay: -18.69s;
-}
-
-.nucleobase:nth-child(1):before {
-  animation: animBefore 2.1s cubic-bezier(0.42, 0, 0.58, 1) infinite;
-  animation-delay: -18.69s;
-  background-color: #339bb9;
-}
-
-.nucleobase:nth-child(1):after {
-  animation: animAfter 2.1s cubic-bezier(0.42, 0, 0.58, 1) infinite;
-  animation-delay: -18.69s;
-  background-color: #006cab;
-}
-
-@keyframes animBefore {
-  0% {
-    top: -6vh;
-    z-index: 1;
-  }
-  25% {
-    transform: scale(1.2);
-    z-index: 1;
-  }
-  50% {
-    top: 6vh;
-    z-index: -1;
-  }
-  75% {
-    background-color: #5bc0de;
-    transform: scale(0.8);
-    z-index: -1;
-  }
-  100% {
-    top: -6vh;
-    z-index: -1;
-  }
-}
-
-@keyframes animAfter {
-  0% {
-    top: 6vh;
-    z-index: -1;
-  }
-  25% {
-    background-color: #055e75;
-    transform: scale(0.8);
-    z-index: -1;
-  }
-  50% {
-    top: -6vh;
-    z-index: 1;
-  }
-  75% {
-    transform: scale(1.2);
-    z-index: 1;
-  }
-  100% {
-    top: 6vh;
-    z-index: 1;
-  }
-}
-
-@keyframes animDotBar {
-  0% {
-    height: 8.25vh;
-  }
-  25% {
-    height: 0;
-  }
-  50% {
-    height: 8.25vh;
-  }
-  75% {
-    height: 0;
-  }
-  100% {
-    height: 8.25vh;
-  }
-}