@finsemble/finsemble-ui 1.0.0-beta-1 → 1.0.0-beta-5

package/react/components/sdd/css/export.css

@@ -1,178 +0,0 @@
-.export-block {
-	max-width: 500px;
-}
-
-.export-block p {
-	margin-right: 60px;
-	margin-left: 0;
-}
-
-.export-methods .export-method {
-	display: flex;
-	justify-content: flex-start;
-	flex-direction: column;
-	flex-basis: 0;
-	flex-grow: 1;
-	position: relative; /* Creating an offset parent for the buttons in these blocks */
-}
-
-.export-publish-url {
-	text-align: center;
-	display: flex;
-	align-items: center;
-}
-
-.export-publish-url input {
-	width: 428px;
-	margin-left: 1em;
-}
-
-.export-method-actions {
-	margin: 0;
-	display: flex;
-	justify-content: flex-end;
-}
-
-.export-method h2 {
-	margin-bottom: 1.6em;
-}
-
-.export-publish-uploaded p {
-	margin-left: 1em;
-	margin-top: 2em;
-}
-
-.export-publish-uploaded input[type="text"] {
-	background-color: #22262f;
-}
-
-/* May be dead */
-.export-publish-progress-indicator {
-	display: flex;
-	align-items: center;
-	justify-content: center;
-}
-
-/* May be dead */
-.export-publish-progress-indicator > div {
-	width: 5em;
-}
-
-.export-publish-progress {
-	padding-left: 60px;
-}
-
-.publish-progress-container {
-	display: flex;
-	margin-top: 0.9em;
-	margin-bottom: 0.9em;
-	margin-left: 8em;
-	align-items: center;
-}
-
-.publish-progress-icon {
-	margin-right: 0.9em;
-	width: 26px;
-	display: flex;
-	justify-content: center;
-	align-items: center;
-}
-
-.publish-progress-text {
-	opacity: 0.75;
-}
-
-.publish-progress-indicator {
-	width: 1.5em;
-	height: 1.5em;
-}
-
-.publish-progress-pending {
-	border: 0.25em solid #ccc;
-	width: 1.5em;
-	height: 1.5em;
-	border-radius: 1em;
-	opacity: 0.5;
-	animation: progress-pending 1s ease-in-out infinite;
-}
-
-.publish-progress-error-icon {
-	color: #f26666;
-}
-
-.publish-progress-success-icon {
-	color: #2cc13f;
-	font-size: 18px;
-}
-
-.export-publish-has-error .publish-progress-pending {
-	opacity: 0;
-	animation: none;
-}
-
-@keyframes progress-pending {
-	0% {
-		opacity: 0.5;
-	}
-
-	50% {
-		opacity: 0.75;
-	}
-}
-
-.export-method-button {
-	background-color: #42a5ba;
-	border-radius: 3px;
-}
-
-.export-method-button:hover {
-	background-color: #36788b;
-}
-
-.export-publish-error button:not(:last-child) {
-	margin-right: 1em;
-}
-
-.export-error-actions {
-	float: right;
-}
-
-.export-error-btn {
-	margin-left: 0.625em;
-}
-
-.last-export-error {
-	color: #da5c5c;
-}
-
-.last-export-time-icon {
-	color: #2cc13f;
-}
-
-.deployInfoContainer {
-	margin-top: 10px;
-}
-
-.export-project-name {
-	display: flex;
-	align-items: center;
-	margin-top: 15px;
-}
-
-.export-project-name label {
-	flex-grow: 0;
-	margin-right: 5px;
-}
-
-.export-project-name input {
-	flex-grow: 1;
-}
-
-.export-block .complex-menu-checkbox {
-	width: 20px;
-}
-
-.export-block .complex-menu-checkbox-label {
-	color: white;
-	opacity: 0.75;
-}

package/react/components/sdd/css/getting-started.css

@@ -1,28 +0,0 @@
-@import url("./appearance.css");
-
-.getting-started-actions {
-	display: flex;
-	justify-content: center;
-	width: 100%;
-	flex-wrap: wrap;
-}
-
-.hero {
-	width: 100%;
-	text-align: center;
-	margin-top: 45px;
-}
-
-.hero img {
-	position: relative;
-	z-index: 2;
-}
-
-.getting-started-gray-back {
-	width: 100%;
-	position: absolute;
-	z-index: 1;
-	top: 487px;
-	height: 100px;
-	background: linear-gradient(#6e7178, #373b43);
-}

package/react/components/sdd/css/nav.css

@@ -1,117 +0,0 @@
-@import url("./appearance.css");
-
-.nav-container {
-	height: 100%;
-	background-color: #171a20;
-	min-width: 18.3em;
-	box-sizing: border-box;
-	display: flex;
-	flex-direction: column;
-	align-items: flex-start;
-	padding-top: 50px;
-}
-
-.nav {
-	list-style: none;
-	padding: 0;
-	margin: 0;
-	height: 100%;
-}
-
-.nav-anchor {
-	align-self: center;
-}
-
-.export-method-button {
-	background-color: #42a5ba;
-}
-
-.nav-anchor button {
-	background-color: #42a5ba;
-}
-
-.nav-anchor button:hover {
-	background-color: #36788b;
-}
-
-.nav-anchor-reset .button-container-danger button {
-	color: white;
-	border-color: white;
-}
-
-.nav-anchor-reset {
-	text-align: center;
-}
-
-.nav-anchor-reset .button-container-danger button:hover {
-	color: #f26666;
-	border-color: #f26666;
-	background-color: transparent;
-}
-
-.nav-anchor-reset .version-info {
-	font-style: italic;
-	margin-bottom: 15px;
-}
-
-.bottom-nav-wrapper {
-	display: flex;
-	justify-content: space-evenly;
-	width: 100%;
-	margin-top: 80px;
-}
-
-.nav-item {
-	padding: 0;
-	margin: 0;
-}
-
-.nav-item [role="tab"] {
-	width: 50%;
-	margin-left: 10px;
-	color: #ddd;
-	display: flex;
-	align-items: center;
-	padding: 0.75em 2.4rem 0.75em 2.5rem;
-	background-color: rgb(255 255 255 / 0%);
-	text-decoration: none;
-	user-select: none;
-	cursor: default;
-	border-radius: 2em;
-	transition: all 0.25s;
-	font-weight: bold;
-	white-space: nowrap;
-	position: relative;
-}
-
-.nav-item:hover [role="tab"] {
-	background-color: #373b43;
-}
-
-.nav-item[aria-selected="true"] [role="tab"] {
-	background-color: #373b43;
-}
-
-.nav-icon {
-	font-size: 1.3rem;
-	margin-right: 10px;
-}
-
-.nav-error-icon {
-	position: absolute;
-	left: 5px;
-	top: 11px;
-}
-
-.nav-section {
-	width: 100%;
-	margin-bottom: 30px;
-}
-
-.nav-label {
-	opacity: 0.75;
-	border-bottom: 1px solid white;
-	width: 100%;
-	margin-left: 20px;
-	margin-bottom: 10px;
-}

package/react/components/sdd/css/project-errors.css

@@ -1,15 +0,0 @@
-.project-error {
-	margin-bottom: 5px;
-	display: flex;
-	align-items: center;
-}
-
-.project-error-icon {
-	color: #f5a623;
-	font-size: 1.3rem;
-	margin-right: 0.5em;
-}
-
-.project-errors-container {
-	margin-left: 1em;
-}

package/react/components/sdd/css/project-header.css

@@ -1,122 +0,0 @@
-.project-header {
-	padding: 2.1rem 0;
-	display: flex;
-	align-items: center;
-	position: relative;
-	overflow: visible;
-	background-color: #373b43;
-}
-
-.project-name {
-	margin-left: 2.1rem;
-}
-
-.text-icon {
-	display: flex;
-	justify-content: center;
-	align-items: center;
-	border-radius: 50%;
-	border: 0.1em solid var(--font-color);
-	height: 1.3em;
-	width: 1.3em;
-}
-
-.project-title-icon {
-	font-size: 2em;
-	z-index: 10000;
-	position: absolute;
-	margin-left: -0.8em;
-}
-
-.project-name-field {
-	font-size: inherit;
-}
-
-.project-name-field input[type="text"] {
-	font-size: 16px;
-	font-weight: bold;
-	transition: border-color 0.25s;
-	padding: 0.25rem 0 0;
-	border-color: transparent;
-	min-width: 15em;
-	max-width: 20em;
-	height: 1.5em;
-	letter-spacing: 0.4px;
-}
-
-.project-name-field input[type="text"]:hover,
-.project-name-field input[type="text"]:focus {
-	cursor: text;
-	border-color: #42a5ba;
-}
-
-.project-name-field input[type="text"]::placeholder {
-	color: #fff;
-}
-
-.project-name-field input[type="text"]:focus::placeholder {
-	color: rgb(255 255 255 / 75%);
-}
-
-.project-name-actions {
-	opacity: 0;
-	padding: 0.75em;
-	z-index: 100;
-}
-
-.is-editing-project-name .project-name-actions {
-	opacity: 1;
-}
-
-.is-editing-project-name .project-name-container::before {
-	opacity: 1;
-}
-
-/* stylelint-disable-next-line no-descending-specificity */
-.is-editing-project-name input[type="text"] {
-	cursor: text;
-	border-color: #42a5ba;
-}
-
-.project-name-actions button:disabled {
-	opacity: 0.25;
-}
-
-.is-editing-project-name.is-invalid-project-name input[type="text"] {
-	border-color: #da5c5c;
-}
-
-.is-invalid-project-name input {
-	color: #da5c5c;
-}
-
-.project-name-error-icon {
-	font-size: 12px;
-	display: inline-block;
-	position: absolute;
-	left: 5px;
-	top: 32px;
-}
-
-.current-project-path {
-	margin-left: 10px;
-	font-size: 0.9em;
-	white-space: nowrap;
-	max-width: 100%;
-	overflow: hidden;
-	text-overflow: ellipsis;
-	cursor: pointer;
-}
-
-/* stylelint-disable-next-line no-descending-specificity */
-.change-project-path-button button {
-	color: #acb2c0;
-	padding: 0;
-	font-size: 17px;
-	margin-left: 2px;
-}
-
-.project-path-container {
-	display: flex;
-	flex-wrap: nowrap;
-}

package/react/components/sdd/css/styles.css

@@ -1,184 +0,0 @@
-@import url("./nav.css");
-@import url("./views.css");
-@import url("./getting-started.css");
-@import url("./project-header.css");
-
-body,
-html {
-	padding: 0;
-	margin: 0;
-	width: 100vw;
-	height: 100vh;
-	font-size: 13px;
-	background-color: #22262f;
-}
-
-p {
-	opacity: 0.75;
-	line-height: 1.7em;
-}
-
-h2 {
-	margin: 0;
-}
-
-* {
-	-webkit-font-smoothing: antialiased;
-	-moz-osx-font-smoothing: grayscale;
-}
-
-*,
-*::after,
-*::before {
-	user-select: none;
-	-webkit-user-drag: none;
-	-webkit-app-region: no-drag;
-	cursor: default;
-}
-
-button {
-	border-radius: 3px;
-	font-family: OpenSans;
-	font-weight: 600;
-	padding: 0.5em 1em;
-	background-color: transparent;
-	border: 0 solid transparent;
-	color: #fff;
-	font-size: 0.9rem;
-	transition: all 0.2s ease-in;
-	cursor: pointer;
-}
-
-.tile-type-button {
-	width: 13.6em;
-	height: 8.5em;
-	flex-grow: 0;
-	flex-shrink: 0;
-	flex-direction: column;
-	justify-content: center;
-	align-items: center;
-	padding-top: 1.3em;
-	margin: 0.5em;
-	background-color: #373b43;
-	border-radius: 0.5em;
-	font-size: 1.1em;
-	transition: all 0.25s;
-	border: 2px solid transparent;
-}
-
-.tile-type-button:hover {
-	border-color: #36788b;
-}
-
-button[type="submit"] {
-	background-color: #42a5ba;
-}
-
-fieldset {
-	padding: 0;
-	margin: 0;
-	border: 0;
-}
-
-legend {
-	margin: 0;
-	padding: 0;
-}
-
-input[type="text"] {
-	border: 0 transparent solid;
-	border-bottom: 2px solid transparent;
-}
-
-textarea {
-	padding: 1em 0;
-	border: 0;
-	border-bottom: 2px transparent solid;
-	cursor: text;
-}
-
-input[type="text"],
-textarea {
-	font-family: OpenSans;
-	font-size: 0.9em;
-	height: 2.9em;
-	padding-left: 0.5em;
-	color: #fff;
-	border-bottom: 2px solid #3d4455;
-	background-color: #22262f;
-	transition: all 0.2s ease-in;
-	cursor: text;
-}
-
-input[type="text"]:focus,
-textarea:focus {
-	outline: none;
-	border-color: #42a5ba;
-}
-
-input[type="text"][aria-invalid="true"] {
-	border-bottom: 2px solid #f26666;
-}
-
-.invalid-message {
-	font-size: 10px;
-	color: #f26666;
-	display: block;
-}
-
-#smartDesktopDesigner {
-	position: relative;
-	height: 100%;
-	width: 100%;
-}
-
-.config-container {
-	top: 0;
-	left: 0;
-	right: 0;
-	bottom: 0;
-	max-width: 100%;
-	max-height: 100%;
-	position: absolute;
-	display: flex;
-	flex-direction: column;
-	overflow: hidden;
-}
-
-.project-container {
-	display: flex;
-	flex-grow: 1;
-	max-height: 100%;
-	overflow: auto;
-}
-
-/* width: 8px, per @DanNicolai */
-
-::-webkit-scrollbar {
-	width: 12px;
-}
-
-/* Track */
-
-::-webkit-scrollbar-track {
-	background: none;
-}
-
-/* Handle */
-
-::-webkit-scrollbar-thumb {
-	background: #f1f1f1;
-	border-radius: 6px;
-}
-
-/* Handle on hover */
-
-::-webkit-scrollbar-thumb:hover {
-	background: #555;
-}
-
-input[type="file"] {
-	font-family: OpenSans;
-	font-size: 1em;
-	font-weight: 600;
-}

package/react/components/sdd/css/views.css

@@ -1,23 +0,0 @@
-@import url("./applications.css");
-
-.view-container {
-	display: flex;
-	flex-direction: column;
-	flex-grow: 1;
-
-	/* height: 100%; */
-	overflow-x: hidden;
-	overflow-y: auto;
-	position: relative;
-	background-color: #373b43;
-}
-
-.content-container {
-	display: flex;
-	flex-direction: column;
-	flex-grow: 1;
-}
-
-.view-content {
-	margin: 0 2.1rem;
-}

package/react/components/sdd/fixtures/apps.d.ts

@@ -1,9 +0,0 @@
-import { ApplicationsProps } from "../Applications";
-import { services } from "@finsemble/finsemble-api";
-import { ToolbarProps } from "../Toolbar";
-declare type AppDefinition = services.Interop.types.AppDefinition;
-export declare const default_apps: AppDefinition[];
-export declare const temporary_apps: AppDefinition[];
-export declare const getApplicationsArgs: (init: "default" | "empty" | "long" | "temporary") => ApplicationsProps;
-export declare const getToolbarArgs: (init: "default" | "empty" | "long" | "temporary") => ToolbarProps;
-export {};