@finsemble/finsemble-ui 6.3.1 → 6.3.2

package/react/assets/css/userPreferences.css

@@ -1,568 +1,568 @@
-/*!
- * userPreferences.css
- * Copyright 2017 - 2020 by ChartIQ, Inc.
- * All rights reserved.
- */
-
-body {
-	margin: 0px;
-}
-
-img {
-	user-select: none;
-	-moz-user-select: none;
-	-webkit-user-drag: none;
-	-webkit-user-select: none;
-	-ms-user-select: none;
-}
-
-.complex-menu-wrapper {
-	display: flex;
-	height: 100%;
-	overflow: hidden;
-}
-
-.complex-menu-left-nav-header-img {
-	width: 29px;
-	height: 31px;
-	margin-right: 15px;
-	padding-left: 13px;
-	padding-top: 11px;
-	padding-bottom: 7px;
-}
-
-.complex-menu-content-section,
-.complex-menu-left-nav {
-	display: flex;
-}
-
-.complex-menu-left-nav-preference {
-	width: 212px;
-	min-width: 212px;
-	height: 600px;
-	font-size: var(--content-font-size);
-	flex-direction: column;
-	justify-content: start;
-	color: var(--content-font-color);
-	background-color: var(--content-nav-background-color);
-}
-
-.complex-menu-left-nav-header {
-	background-color: var(--content-nav-header-background-color);
-	font-weight: var(--content-nav-header-font-weight);
-	font-size: var(--content-nav-header-font-size);
-	margin-bottom: 30px;
-	padding-left: 30px;
-	height: 49px;
-	display: flex;
-	align-items: center;
-	align-content: center;
-}
-
-.complex-menu-header-wrapper {
-	display: flex;
-	justify-content: space-between;
-}
-
-.content-section-header {
-	display: flex;
-	flex-direction: row;
-	align-self: flex-start;
-	font-size: var(--content-header-font-size);
-	font-weight: var(--font-weight-2);
-	color: var(--content-header-font-color);
-	margin-bottom: 4px;
-}
-
-.content-section-info {
-	color: var(--content-hint-font-color);
-	font-weight: var(--content-font-weight);
-	font-size: 12px;
-	align-items: center;
-	display: flex;
-}
-
-.workspace-list-header > .content-section-info {
-	margin-left: 275px;
-	margin-top: 6px;
-	margin-bottom: 4px;
-}
-
-.content-section-wrapper {
-	display: flex;
-	flex-direction: row;
-	justify-content: space-between;
-}
-
-.workspace-content {
-	display: flex;
-	flex-direction: row;
-	justify-content: space-between;
-}
-
-.complex-menu-header {
-	display: flex;
-	justify-content: Space-between;
-	padding: 6px 6px 0px 11px;
-	font-size: 18px;
-}
-
-.ff-close {
-	cursor: pointer;
-	font-size: var(--content-button-label-font-size);
-}
-
-.ff-close:hover {
-	color: var(--content-close-hover-color);
-}
-
-.complex-menu-section-toggle {
-	padding: 6px 30px;
-	margin-right: 6px;
-	border-radius: 0px 20px 20px 0px;
-	height: 22px;
-	display: flex;
-	align-items: center;
-}
-
-.complex-menu-section-toggle:hover {
-	cursor: pointer;
-	background-color: var(--content-nav-highlighter-hover);
-}
-
-.active-section-toggle {
-	background-color: var(--content-nav-highlighter);
-}
-
-.complex-menu-content-row {
-	flex: 1;
-	padding: 0.75em;
-	align-content: flex-start;
-	user-select: none;
-	background-color: var(--content-background-color);
-	overflow: auto;
-}
-
-.items-header {
-	font-size: 1.4em;
-}
-
-.workspace-list-header-row {
-	padding: 0px;
-}
-
-#UserPreferences-component-wrapper {
-	height: 100%;
-	width: 100%;
-}
-
-.complex-menu-content-section {
-	display: flex;
-	flex-direction: row;
-}
-
-.workspace-section-wrapper {
-	display: flex;
-	justify-content: space-between;
-}
-
-.workspace-list {
-	border: 1px solid var(--content-list-border-color);
-	width: 100%;
-	height: 210px;
-	overflow-y: auto;
-	margin-right: 16px;
-	padding: 5px;
-	border-radius: 3px;
-}
-
-.workspace-item {
-	height: 28px;
-	padding: 4px 10px 0px 10px;
-	display: flex;
-	align-items: center;
-	justify-content: space-between;
-	border: 1px solid transparent;
-	border-radius: 20px;
-	cursor: grab;
-}
-
-.workspace-item:hover {
-	background-color: var(--content-nav-highlighter-hover);
-}
-
-.individual-workspace-actions {
-	display: flex;
-	margin-left: 3px;
-	flex-direction: row;
-	align-items: center;
-	width: 50px;
-	color: var(--content-button-icon-color);
-}
-
-.workspace-item .ff-adp-hamburger {
-	color: var(--content-list-drag-icon-color);
-	margin: -2px 16px 0px 0px;
-}
-
-.workspace-item .workspace-name {
-	width: 260px;
-	height: 16px;
-	padding-left: 1px;
-	text-overflow: ellipsis;
-	white-space: nowrap;
-	overflow: hidden;
-	line-height: 13px;
-}
-
-.individual-workspace-action {
-	cursor: pointer;
-	padding: 4px;
-	margin: 0px 4px;
-	height: 17px;
-	transition: 0.2s color;
-}
-
-.individual-workspace-action:hover {
-	color: var(--content-button-neutral-hover-color);
-}
-
-.individual-workspace-action.disabled-button {
-	border: 0;
-}
-
-.delete-workspace:hover {
-	color: var(--content-close-hover-color);
-}
-
-.active-workspace {
-	font-weight: 700;
-	color: var(--accent-aware);
-}
-
-.focused-workspace-item {
-	background-color: var(--content-list-highlighter);
-}
-
-/* .auto-start-workspace-item {
-    content: "";
-    width: 5px;
-    height: 5px;
-    display: inline-block;
-    border-radius: 50%;
-    margin-left: -15px;
-    margin-right: 10px;
-    background-color: var(--content-list-item-flagged-color);
-} */
-
-.auto-start-workspace-item {
-	font-style: italic;
-}
-
-.action-button {
-	border: 1px solid var(--button-neutral-border-hover-color);
-	padding: 0.25em 0em;
-	display: flex;
-	align-items: center;
-	justify-content: center;
-	margin: 16px 0px 6px 0px;
-	color: var(--content-button-icon-color);
-	transition: 0.2s all;
-}
-
-.action-button:hover {
-	cursor: pointer;
-	border: solid 1px var(--content-button-neutral-hover-color);
-	color: var(--content-button-neutral-hover-color);
-}
-
-.disabled-button,
-.disabled-button:hover {
-	color: var(--content-button-disabled-border-color);
-	cursor: default;
-	border: 1px solid;
-}
-
-.workspace-action-buttons {
-	display: flex;
-	justify-content: space-between;
-}
-
-.workspace-action-button {
-	width: 69px;
-	height: 69px;
-	font-size: var(--content-button-label-font-size);
-	display: flex;
-	flex-direction: column;
-	border-radius: 3px;
-}
-
-.workspace-action-button-icon {
-	font-size: 27px;
-}
-
-.workspace-item > .workspace-editor {
-	padding-left: 4px;
-}
-
-.workspace-item-editing {
-	color: var(--content-list-editor-font-color);
-}
-
-.workspace-editor {
-	border: 1px solid transparent;
-	background-color: transparent;
-	height: 100%;
-	width: 100%;
-	padding-bottom: 2px;
-	font-size: var(--content-font-size);
-	outline-color: transparent;
-	color: var(--content-list-editor-font-color);
-	line-height: 13px;
-	font-family: var(--font-family);
-	font-weight: var(--font-weight);
-}
-
-.workspace-editor:focus {
-	outline: none;
-}
-
-.workspace-editor::selection {
-	background-color: var(--content-list-editor-highlighted-text);
-}
-
-.no-top-border {
-	border-top: 1px solid transparent;
-}
-
-::-webkit-scrollbar-track {
-	border-radius: 3px;
-	background-color: transparent;
-}
-
-::-webkit-scrollbar {
-	width: 5px;
-	background-color: transparent;
-	border-radius: 3px;
-}
-
-::-webkit-scrollbar-thumb {
-	cursor: pointer;
-	border-radius: 9px;
-	background-color: var(--scrollbar-color);
-}
-
-.complex-menu-checkbox-wrapper {
-	display: flex;
-	align-items: center;
-	margin-top: 8px;
-	margin-left: 12px;
-	width: 270px;
-}
-
-.complex-menu-checkbox {
-	border-radius: 1px;
-	width: 14px;
-	height: 14px;
-	margin-right: 8px;
-	border: 1px solid var(--content-checkbox-unchecked-border-color);
-	display: inline-flex;
-	justify-content: center;
-	align-items: center;
-}
-
-.complex-menu-checkbox-label {
-	display: inline-block;
-}
-
-.complex-menu-checkbox.checked {
-	background-color: var(--content-checkbox-background-color);
-	border: 1px solid var(--content-checkbox-background-color);
-	font-size: 8px;
-	color: var(--content-checkbox-check-color);
-}
-
-.ff-check-mark {
-	padding-top: 2px;
-}
-
-.workspace-component-list {
-	border: solid 1px var(--content-list-border-color);
-	padding: 7px;
-	font-size: var(--content-component-list-font-size);
-	width: 140px;
-	height: 114px;
-	overflow-y: auto;
-	color: var(--workspace-component-list-font-color);
-	border-radius: 3px;
-}
-
-.scheduled-restart {
-	margin-top: 0.5em;
-}
-
-.scheduled-restart-select-label {
-	margin-top: 0.45em;
-	margin-left: 4em;
-	margin-right: 0.5em;
-}
-
-.disabled-restart {
-	color: var(--content-nav-highlighter) !important;
-}
-
-select:focus,
-option:focus {
-	outline: none;
-	background-color: var(--content-font-color);
-}
-
-.change-text {
-	color: var(--content-warning-text);
-	font-size: 14px;
-	margin-top: 12px;
-	margin-left: 12px;
-	margin-right: 10px;
-	display: inline-block;
-}
-
-.blue-button {
-	width: 110px;
-	height: 24px;
-	border: 0;
-	background: none;
-	box-shadow: none;
-	background-color: var(--content-restart-button-color);
-	color: var(--content-font-color);
-	font-size: 11px;
-	font-weight: var(--content-font-weight);
-	border-radius: 3px;
-}
-
-.dashbar-items-table {
-	width: 100%;
-	table-layout: fixed;
-}
-
-.dashbar-items-table tr.dashbar-preferences-item td {
-	overflow: hidden;
-	text-overflow: ellipsis;
-	text-align: center;
-}
-
-/* Notifications Preferences */
-
-.notifications-main-preferences__container {
-	display: flex;
-	flex-direction: column;
-	padding: 5px 15px;
-}
-
-.notifications-main-preferences__container .row-section {
-	height: 34px;
-	display: flex;
-	align-items: center;
-}
-
-.row-section .complex-menu-checkbox-wrapper {
-	width: 100%;
-}
-
-.row-section .row-btn,
-.row-section .row,
-.row-section .row-btn-disabled {
-	display: grid;
-	grid-template-columns: min-content auto min-content;
-	grid-template-rows: 100%;
-	height: 100%;
-	padding: 0 10px 0 0;
-	width: 100%;
-	align-items: center;
-}
-
-.row-btn:hover {
-	background: var(--menu-actions-hover-color);
-	border-radius: 0px 20px 20px 0px;
-}
-
-.row-section .row__lbl {
-	overflow: hidden;
-	padding-left: 10px;
-	text-overflow: ellipsis;
-	white-space: nowrap;
-	grid-column-start: 2;
-	width: 250px;
-}
-
-.row-section .row .row_right__icon {
-	margin: 0 18px;
-	cursor: pointer;
-}
-
-.row-section .row .row_right__icon svg {
-	height: 20px;
-}
-
-.row-btn img:first-of-type,
-.row-btn i:first-of-type {
-	margin-left: 10px;
-}
-
-.row-btn i:last-child {
-	margin-left: auto;
-	padding-left: 10px;
-}
-
-.rotate-90::before {
-	transform: rotate(90deg);
-	display: inline-block;
-}
-
-.finsemble-dropdown__btn.push-right {
-	margin-left: auto;
-}
-
-.heading-larger {
-	font-size: var(--font-size-larger);
-	color: var(--core-primary-5);
-}
-
-.notification-sources__header {
-	display: grid;
-	grid-template-columns: min-content auto min-content;
-	grid-template-rows: 100%;
-	height: 100%;
-	width: 100%;
-	align-items: baseline;
-	margin-bottom: 20px;
-}
-
-.notification-sources__types .row .finsemble-icon {
-	cursor: pointer;
-}
-
-.row-btn img,
-.ff-finsemble.default-img {
-	height: 20px;
-	width: 20px;
-}
-
-.ff-finsemble.default-img::before {
-	vertical-align: middle;
-}
-
-.db-col-1 {
-	width: 10%;
-}
-
-.db-col-2 {
-	width: 20%;
-}
-
-.db-col-3 {
-	width: 50%;
-}
-
-.db-col-4 {
-	width: 20%;
-}
+/*!
+ * userPreferences.css
+ * Copyright 2017 - 2020 by ChartIQ, Inc.
+ * All rights reserved.
+ */
+
+body {
+	margin: 0px;
+}
+
+img {
+	user-select: none;
+	-moz-user-select: none;
+	-webkit-user-drag: none;
+	-webkit-user-select: none;
+	-ms-user-select: none;
+}
+
+.complex-menu-wrapper {
+	display: flex;
+	height: 100%;
+	overflow: hidden;
+}
+
+.complex-menu-left-nav-header-img {
+	width: 29px;
+	height: 31px;
+	margin-right: 15px;
+	padding-left: 13px;
+	padding-top: 11px;
+	padding-bottom: 7px;
+}
+
+.complex-menu-content-section,
+.complex-menu-left-nav {
+	display: flex;
+}
+
+.complex-menu-left-nav-preference {
+	width: 212px;
+	min-width: 212px;
+	height: 600px;
+	font-size: var(--content-font-size);
+	flex-direction: column;
+	justify-content: start;
+	color: var(--content-font-color);
+	background-color: var(--content-nav-background-color);
+}
+
+.complex-menu-left-nav-header {
+	background-color: var(--content-nav-header-background-color);
+	font-weight: var(--content-nav-header-font-weight);
+	font-size: var(--content-nav-header-font-size);
+	margin-bottom: 30px;
+	padding-left: 30px;
+	height: 49px;
+	display: flex;
+	align-items: center;
+	align-content: center;
+}
+
+.complex-menu-header-wrapper {
+	display: flex;
+	justify-content: space-between;
+}
+
+.content-section-header {
+	display: flex;
+	flex-direction: row;
+	align-self: flex-start;
+	font-size: var(--content-header-font-size);
+	font-weight: var(--font-weight-2);
+	color: var(--content-header-font-color);
+	margin-bottom: 4px;
+}
+
+.content-section-info {
+	color: var(--content-hint-font-color);
+	font-weight: var(--content-font-weight);
+	font-size: 12px;
+	align-items: center;
+	display: flex;
+}
+
+.workspace-list-header > .content-section-info {
+	margin-left: 275px;
+	margin-top: 6px;
+	margin-bottom: 4px;
+}
+
+.content-section-wrapper {
+	display: flex;
+	flex-direction: row;
+	justify-content: space-between;
+}
+
+.workspace-content {
+	display: flex;
+	flex-direction: row;
+	justify-content: space-between;
+}
+
+.complex-menu-header {
+	display: flex;
+	justify-content: Space-between;
+	padding: 6px 6px 0px 11px;
+	font-size: 18px;
+}
+
+.ff-close {
+	cursor: pointer;
+	font-size: var(--content-button-label-font-size);
+}
+
+.ff-close:hover {
+	color: var(--content-close-hover-color);
+}
+
+.complex-menu-section-toggle {
+	padding: 6px 30px;
+	margin-right: 6px;
+	border-radius: 0px 20px 20px 0px;
+	height: 22px;
+	display: flex;
+	align-items: center;
+}
+
+.complex-menu-section-toggle:hover {
+	cursor: pointer;
+	background-color: var(--content-nav-highlighter-hover);
+}
+
+.active-section-toggle {
+	background-color: var(--content-nav-highlighter);
+}
+
+.complex-menu-content-row {
+	flex: 1;
+	padding: 0.75em;
+	align-content: flex-start;
+	user-select: none;
+	background-color: var(--content-background-color);
+	overflow: auto;
+}
+
+.items-header {
+	font-size: 1.4em;
+}
+
+.workspace-list-header-row {
+	padding: 0px;
+}
+
+#UserPreferences-component-wrapper {
+	height: 100%;
+	width: 100%;
+}
+
+.complex-menu-content-section {
+	display: flex;
+	flex-direction: row;
+}
+
+.workspace-section-wrapper {
+	display: flex;
+	justify-content: space-between;
+}
+
+.workspace-list {
+	border: 1px solid var(--content-list-border-color);
+	width: 100%;
+	height: 210px;
+	overflow-y: auto;
+	margin-right: 16px;
+	padding: 5px;
+	border-radius: 3px;
+}
+
+.workspace-item {
+	height: 28px;
+	padding: 4px 10px 0px 10px;
+	display: flex;
+	align-items: center;
+	justify-content: space-between;
+	border: 1px solid transparent;
+	border-radius: 20px;
+	cursor: grab;
+}
+
+.workspace-item:hover {
+	background-color: var(--content-nav-highlighter-hover);
+}
+
+.individual-workspace-actions {
+	display: flex;
+	margin-left: 3px;
+	flex-direction: row;
+	align-items: center;
+	width: 50px;
+	color: var(--content-button-icon-color);
+}
+
+.workspace-item .ff-adp-hamburger {
+	color: var(--content-list-drag-icon-color);
+	margin: -2px 16px 0px 0px;
+}
+
+.workspace-item .workspace-name {
+	width: 260px;
+	height: 16px;
+	padding-left: 1px;
+	text-overflow: ellipsis;
+	white-space: nowrap;
+	overflow: hidden;
+	line-height: 13px;
+}
+
+.individual-workspace-action {
+	cursor: pointer;
+	padding: 4px;
+	margin: 0px 4px;
+	height: 17px;
+	transition: 0.2s color;
+}
+
+.individual-workspace-action:hover {
+	color: var(--content-button-neutral-hover-color);
+}
+
+.individual-workspace-action.disabled-button {
+	border: 0;
+}
+
+.delete-workspace:hover {
+	color: var(--content-close-hover-color);
+}
+
+.active-workspace {
+	font-weight: 700;
+	color: var(--accent-aware);
+}
+
+.focused-workspace-item {
+	background-color: var(--content-list-highlighter);
+}
+
+/* .auto-start-workspace-item {
+    content: "";
+    width: 5px;
+    height: 5px;
+    display: inline-block;
+    border-radius: 50%;
+    margin-left: -15px;
+    margin-right: 10px;
+    background-color: var(--content-list-item-flagged-color);
+} */
+
+.auto-start-workspace-item {
+	font-style: italic;
+}
+
+.action-button {
+	border: 1px solid var(--button-neutral-border-hover-color);
+	padding: 0.25em 0em;
+	display: flex;
+	align-items: center;
+	justify-content: center;
+	margin: 16px 0px 6px 0px;
+	color: var(--content-button-icon-color);
+	transition: 0.2s all;
+}
+
+.action-button:hover {
+	cursor: pointer;
+	border: solid 1px var(--content-button-neutral-hover-color);
+	color: var(--content-button-neutral-hover-color);
+}
+
+.disabled-button,
+.disabled-button:hover {
+	color: var(--content-button-disabled-border-color);
+	cursor: default;
+	border: 1px solid;
+}
+
+.workspace-action-buttons {
+	display: flex;
+	justify-content: space-between;
+}
+
+.workspace-action-button {
+	width: 69px;
+	height: 69px;
+	font-size: var(--content-button-label-font-size);
+	display: flex;
+	flex-direction: column;
+	border-radius: 3px;
+}
+
+.workspace-action-button-icon {
+	font-size: 27px;
+}
+
+.workspace-item > .workspace-editor {
+	padding-left: 4px;
+}
+
+.workspace-item-editing {
+	color: var(--content-list-editor-font-color);
+}
+
+.workspace-editor {
+	border: 1px solid transparent;
+	background-color: transparent;
+	height: 100%;
+	width: 100%;
+	padding-bottom: 2px;
+	font-size: var(--content-font-size);
+	outline-color: transparent;
+	color: var(--content-list-editor-font-color);
+	line-height: 13px;
+	font-family: var(--font-family);
+	font-weight: var(--font-weight);
+}
+
+.workspace-editor:focus {
+	outline: none;
+}
+
+.workspace-editor::selection {
+	background-color: var(--content-list-editor-highlighted-text);
+}
+
+.no-top-border {
+	border-top: 1px solid transparent;
+}
+
+::-webkit-scrollbar-track {
+	border-radius: 3px;
+	background-color: transparent;
+}
+
+::-webkit-scrollbar {
+	width: 5px;
+	background-color: transparent;
+	border-radius: 3px;
+}
+
+::-webkit-scrollbar-thumb {
+	cursor: pointer;
+	border-radius: 9px;
+	background-color: var(--scrollbar-color);
+}
+
+.complex-menu-checkbox-wrapper {
+	display: flex;
+	align-items: center;
+	margin-top: 8px;
+	margin-left: 12px;
+	width: 270px;
+}
+
+.complex-menu-checkbox {
+	border-radius: 1px;
+	width: 14px;
+	height: 14px;
+	margin-right: 8px;
+	border: 1px solid var(--content-checkbox-unchecked-border-color);
+	display: inline-flex;
+	justify-content: center;
+	align-items: center;
+}
+
+.complex-menu-checkbox-label {
+	display: inline-block;
+}
+
+.complex-menu-checkbox.checked {
+	background-color: var(--content-checkbox-background-color);
+	border: 1px solid var(--content-checkbox-background-color);
+	font-size: 8px;
+	color: var(--content-checkbox-check-color);
+}
+
+.ff-check-mark {
+	padding-top: 2px;
+}
+
+.workspace-component-list {
+	border: solid 1px var(--content-list-border-color);
+	padding: 7px;
+	font-size: var(--content-component-list-font-size);
+	width: 140px;
+	height: 114px;
+	overflow-y: auto;
+	color: var(--workspace-component-list-font-color);
+	border-radius: 3px;
+}
+
+.scheduled-restart {
+	margin-top: 0.5em;
+}
+
+.scheduled-restart-select-label {
+	margin-top: 0.45em;
+	margin-left: 4em;
+	margin-right: 0.5em;
+}
+
+.disabled-restart {
+	color: var(--content-nav-highlighter) !important;
+}
+
+select:focus,
+option:focus {
+	outline: none;
+	background-color: var(--content-font-color);
+}
+
+.change-text {
+	color: var(--content-warning-text);
+	font-size: 14px;
+	margin-top: 12px;
+	margin-left: 12px;
+	margin-right: 10px;
+	display: inline-block;
+}
+
+.blue-button {
+	width: 110px;
+	height: 24px;
+	border: 0;
+	background: none;
+	box-shadow: none;
+	background-color: var(--content-restart-button-color);
+	color: var(--content-font-color);
+	font-size: 11px;
+	font-weight: var(--content-font-weight);
+	border-radius: 3px;
+}
+
+.dashbar-items-table {
+	width: 100%;
+	table-layout: fixed;
+}
+
+.dashbar-items-table tr.dashbar-preferences-item td {
+	overflow: hidden;
+	text-overflow: ellipsis;
+	text-align: center;
+}
+
+/* Notifications Preferences */
+
+.notifications-main-preferences__container {
+	display: flex;
+	flex-direction: column;
+	padding: 5px 15px;
+}
+
+.notifications-main-preferences__container .row-section {
+	height: 34px;
+	display: flex;
+	align-items: center;
+}
+
+.row-section .complex-menu-checkbox-wrapper {
+	width: 100%;
+}
+
+.row-section .row-btn,
+.row-section .row,
+.row-section .row-btn-disabled {
+	display: grid;
+	grid-template-columns: min-content auto min-content;
+	grid-template-rows: 100%;
+	height: 100%;
+	padding: 0 10px 0 0;
+	width: 100%;
+	align-items: center;
+}
+
+.row-btn:hover {
+	background: var(--menu-actions-hover-color);
+	border-radius: 0px 20px 20px 0px;
+}
+
+.row-section .row__lbl {
+	overflow: hidden;
+	padding-left: 10px;
+	text-overflow: ellipsis;
+	white-space: nowrap;
+	grid-column-start: 2;
+	width: 250px;
+}
+
+.row-section .row .row_right__icon {
+	margin: 0 18px;
+	cursor: pointer;
+}
+
+.row-section .row .row_right__icon svg {
+	height: 20px;
+}
+
+.row-btn img:first-of-type,
+.row-btn i:first-of-type {
+	margin-left: 10px;
+}
+
+.row-btn i:last-child {
+	margin-left: auto;
+	padding-left: 10px;
+}
+
+.rotate-90::before {
+	transform: rotate(90deg);
+	display: inline-block;
+}
+
+.finsemble-dropdown__btn.push-right {
+	margin-left: auto;
+}
+
+.heading-larger {
+	font-size: var(--font-size-larger);
+	color: var(--core-primary-5);
+}
+
+.notification-sources__header {
+	display: grid;
+	grid-template-columns: min-content auto min-content;
+	grid-template-rows: 100%;
+	height: 100%;
+	width: 100%;
+	align-items: baseline;
+	margin-bottom: 20px;
+}
+
+.notification-sources__types .row .finsemble-icon {
+	cursor: pointer;
+}
+
+.row-btn img,
+.ff-finsemble.default-img {
+	height: 20px;
+	width: 20px;
+}
+
+.ff-finsemble.default-img::before {
+	vertical-align: middle;
+}
+
+.db-col-1 {
+	width: 10%;
+}
+
+.db-col-2 {
+	width: 20%;
+}
+
+.db-col-3 {
+	width: 50%;
+}
+
+.db-col-4 {
+	width: 20%;
+}