@orangesix/react 2.3.1 → 2.4.0-beta.3

package/style/scss/data/_organizationchart.scss

@@ -1,50 +0,0 @@
-.p-organizationchart {
-    .p-organizationchart-node-content {
-        &.p-organizationchart-selectable-node:not(.p-highlight):hover {
-            background: $inputListItemHoverBg;
-            color: $inputListItemTextHoverColor;
-        }
-
-        &.p-highlight {
-            background: $highlightBg;
-            color: $highlightTextColor;
-
-            .p-node-toggler {
-                i {
-                    color: darken($highlightBg, 25%);
-                }
-            }
-        }
-    }
-
-    .p-organizationchart-line-down {
-        background: $organizationChartConnectorColor;
-    }
-
-    .p-organizationchart-line-left {
-        border-right: $panelContentBorder;
-        border-color: $organizationChartConnectorColor;
-    }
-
-    .p-organizationchart-line-top {
-        border-top: $panelContentBorder;
-        border-color: $organizationChartConnectorColor;
-    }
-
-    .p-organizationchart-node-content {
-        border: $panelContentBorder;
-        background: $panelContentBg;
-        color: $panelContentTextColor;
-        padding: $panelContentPadding;
-    }
-
-    .p-organizationchart-node-content .p-node-toggler {
-        background: inherit;
-        color: inherit;
-        border-radius: 50%;
-
-        &:focus-visible {
-            @include focused();
-        }
-    }
-}

package/style/scss/data/_paginator.scss

@@ -1,91 +0,0 @@
-.p-paginator {
-    background: $paginatorBg;
-    color: $paginatorTextColor;
-    border: $paginatorBorder;
-    border-width: $paginatorBorderWidth;
-    padding: $paginatorPadding;
-    border-radius: $borderRadius;
-
-    .p-paginator-first,
-    .p-paginator-prev,
-    .p-paginator-next,
-    .p-paginator-last {
-        background-color: $paginatorElementBg;
-        border: $paginatorElementBorder;
-        color: $paginatorElementIconColor;
-        min-width: $paginatorElementWidth;
-        height: $paginatorElementHeight;
-        margin: $paginatorElementMargin;
-        transition: $listItemTransition;
-        border-radius: $paginatorElementBorderRadius;
-
-        &:not(.p-disabled):not(.p-highlight):hover {
-            background: $paginatorElementHoverBg;
-            border-color: $paginatorElementHoverBorderColor;
-            color: $paginatorElementIconHoverColor;
-        }
-    }
-
-    .p-paginator-first {
-        border-top-left-radius: $paginatorElementBorderRadius;
-        border-bottom-left-radius: $paginatorElementBorderRadius;
-    }
-    
-    .p-paginator-last {
-        border-top-right-radius: $paginatorElementBorderRadius;
-        border-bottom-right-radius: $paginatorElementBorderRadius;
-    }
-
-    .p-dropdown {
-        margin-left: $inlineSpacing;
-        height: $paginatorElementHeight;
-
-        .p-dropdown-label {
-            padding-right: 0;
-        }
-    }
-
-    .p-paginator-page-input {
-        margin-left: $inlineSpacing;
-        margin-right: $inlineSpacing;
-
-        .p-inputtext {
-            max-width: $paginatorElementWidth;
-        }
-    }
-
-    .p-paginator-current {
-        background-color: $paginatorElementBg;
-        border: $paginatorElementBorder;
-        color: $paginatorElementIconColor;
-        min-width: $paginatorElementWidth;
-        height: $paginatorElementHeight;
-        margin: $paginatorElementMargin;
-        padding: 0 $inlineSpacing;
-    }
-
-    .p-paginator-pages {
-        .p-paginator-page {
-            background-color: $paginatorElementBg;
-            border: $paginatorElementBorder;
-            color: $paginatorElementIconColor;
-            min-width: $paginatorElementWidth;
-            height: $paginatorElementHeight;
-            margin: $paginatorElementMargin;
-            transition: $listItemTransition;
-            border-radius: $paginatorElementBorderRadius;
-
-            &.p-highlight {
-                background: $highlightBg;
-                border-color: $highlightBg;
-                color: $highlightTextColor;
-            }
-
-            &:not(.p-highlight):hover {
-                background: $paginatorElementHoverBg;
-                border-color: $paginatorElementHoverBorderColor;
-                color: $paginatorElementIconHoverColor;
-            }
-        }
-    }
-}

package/style/scss/data/_picklist.scss

@@ -1,74 +0,0 @@
-.p-picklist {
-  .p-picklist-buttons {
-    padding: $panelContentPadding;
-
-    .p-button {
-      margin-bottom: $inlineSpacing !important;
-    }
-  }
-
-  .p-picklist-header {
-    background: $panelHeaderBg;
-    color: $panelHeaderTextColor;
-    border: $panelHeaderBorder;
-    padding: $panelHeaderPadding;
-    font-weight: $panelHeaderFontWeight;
-    border-bottom: 0 none;
-    border-top-right-radius: $borderRadius;
-    border-top-left-radius: $borderRadius;
-  }
-
-  .p-picklist-filter-container {
-    padding: $panelHeaderPadding;
-    background: $panelContentBg;
-    border: $panelHeaderBorder;
-    border-bottom: 0 none;
-
-    .p-picklist-filter-input {
-      padding-right: nth($inputPadding, 2) + $primeIconFontSize;
-    }
-
-    .p-picklist-filter-icon {
-      right: nth($inputPadding, 2);
-      color: $inputIconColor;
-    }
-  }
-
-  .p-picklist-list {
-    border: $panelContentBorder;
-    background: $panelContentBg;
-    color: $panelContentTextColor;
-    padding: $inputListPadding;
-    border-bottom-right-radius: $borderRadius;
-    border-bottom-left-radius: $borderRadius;
-    outline: 0 none;
-
-    .p-picklist-item {
-      padding: $inputListItemPadding;
-      margin: $inputListItemMargin;
-      border: $inputListItemBorder;
-      color: $inputListItemTextColor;
-      background: $inputListItemBg;
-      transition: transform $transitionDuration, $listItemTransition;
-
-      &:not(.p-highlight):hover {
-        background: $inputListItemHoverBg;
-        color: $inputListItemTextHoverColor;
-      }
-
-      &.p-focus {
-        color: $inputListItemTextFocusColor;
-        background: $inputListItemFocusBg;
-      }
-
-      &.p-highlight {
-        color: $highlightTextColor;
-        background: $highlightBg;
-
-        &.p-focus {
-          background: $highlightFocusBg;
-        }
-      }
-    }
-  }
-}

package/style/scss/data/_timeline.scss

@@ -1,38 +0,0 @@
-.p-timeline {
-    .p-timeline-event-marker {
-        border: $timelineEventMarkerBorder; 
-        border-radius: $timelineEventMarkerBorderRadius;
-        width: $timelineEventMarkerWidth;
-        height: $timelineEventMarkerHeight;
-        background-color: $timelineEventMarkerBackground;
-    }
-
-    .p-timeline-event-connector {
-        background-color: $timelineEventColor;
-    }
-
-    &.p-timeline-vertical {
-        .p-timeline-event-opposite,
-        .p-timeline-event-content  {
-            padding: $timelineVerticalEventContentPadding;
-        }
-
-        .p-timeline-event-connector {
-            width: $timelineEventConnectorSize;
-        }
-    }
-
-    &.p-timeline-horizontal {
-        .p-timeline-event-opposite,
-        .p-timeline-event-content  {
-            padding: $timelineHorizontalEventContentPadding;
-        }
-
-        .p-timeline-event-connector {
-            height: $timelineEventConnectorSize;
-        }
-    }
-}
-
-
-

package/style/scss/data/_tree.scss

@@ -1,184 +0,0 @@
-// core
-.p-tree-container {
-	margin: 0;
-	padding: 0;
-	list-style-type: none;
-	overflow: auto;
-}
-
-.p-treenode-children {
-	margin: 0;
-	padding: 0;
-	list-style-type: none;
-}
-
-.p-treenode-selectable {
-	cursor: pointer;
-	user-select: none;
-}
-
-.p-tree-toggler {
-	cursor: pointer;
-	user-select: none;
-	display: inline-flex;
-	align-items: center;
-	justify-content: center;
-	overflow: hidden;
-	position: relative;
-	flex-shrink: 0;
-}
-
-.p-treenode-leaf > .p-treenode-content .p-tree-toggler {
-	visibility: hidden;
-}
-
-.p-treenode-content {
-	display: flex;
-	align-items: center;
-}
-
-.p-tree-filter {
-	width: 100%;
-}
-
-.p-tree-filter-container {
-	position: relative;
-	display: block;
-	width: 100%;
-}
-
-.p-tree-filter-icon {
-	position: absolute;
-	top: 50%;
-	margin-top: -0.5rem;
-}
-
-.p-tree-loading {
-	position: relative;
-	min-height: 4rem;
-}
-
-.p-tree .p-tree-loading-overlay {
-	position: absolute;
-	z-index: 1;
-	display: flex;
-	align-items: center;
-	justify-content: center;
-}
-
-// TODO: Should be removed after implementing the new scrollable prop to Tree
-// .p-tree-flex-scrollable {
-//     display: flex;
-//     flex: 1;
-//     height: 100%;
-//     flex-direction: column;
-// }
-
-// .p-tree-flex-scrollable .p-tree-wrapper {
-//     flex: 1;
-// }
-
-// theme
-.p-tree {
-	border: $panelContentBorder;
-	background: $panelContentBg;
-	color: $panelContentTextColor;
-	padding: $panelContentPadding;
-	border-radius: $borderRadius;
-
-	.p-tree-container {
-			.p-treenode {
-					padding: $treeNodePadding;
-					outline: 0 none;
-
-					&:focus > .p-treenode-content {
-							@include focused-listitem();
-					}
-
-					.p-treenode-content {
-							border-radius: $borderRadius;
-							transition: $listItemTransition;
-							padding: $treeNodeContentPadding;
-
-							.p-tree-toggler {
-									margin-right: $inlineSpacing;
-									@include action-icon();
-							}
-
-							.p-treenode-icon {
-									margin-right: $inlineSpacing;
-									color: $treeNodeIconColor;
-							}
-
-							.p-checkbox {
-									margin-right: $inlineSpacing;
-
-									&.p-indeterminate {
-											.p-checkbox-icon {
-													color: $textColor;
-											}
-									}
-							}
-
-							&.p-highlight {
-									background: $highlightBg;
-									color: $highlightTextColor;
-
-									.p-tree-toggler,
-									.p-treenode-icon {
-											color: $highlightTextColor;
-
-											&:hover {
-													color: $highlightTextColor;
-											}
-									}
-							}
-
-							&.p-treenode-selectable:not(.p-highlight):hover {
-									background: $inputListItemHoverBg;
-									color: $inputListItemTextHoverColor;
-							}
-
-							&.p-treenode-dragover {
-								background: $inputListItemHoverBg;
-								color: $inputListItemTextHoverColor;
-							}
-					}
-			}
-	}
-
-	.p-tree-filter-container {
-			margin-bottom: $inlineSpacing;
-
-			.p-tree-filter {
-					width: 100%;
-					padding-right: nth($inputPadding, 2) + $primeIconFontSize;
-			}
-
-			.p-tree-filter-icon {
-					right: nth($inputPadding, 2);
-					color: $inputIconColor;
-			}
-	}
-
-	.p-treenode-children {
-			padding: $treeNodeChildrenPadding;
-	}
-
-	.p-tree-loading-icon {
-			font-size: $loadingIconFontSize;
-
-			&.p-icon {
-					width:  $loadingIconFontSize;
-					height: $loadingIconFontSize;
-			}
-	}
-
-	.p-treenode-droppoint {
-		height: $inlineSpacing;
-
-		&.p-treenode-droppoint-active {
-			background: scale-color($highlightBg, $lightness: -20%);
-		}
-	}
-}