@colijnit/transaction 12.1.33 → 12.1.35

package/lib/style/transaction-globals.scss

@@ -4,7 +4,39 @@
 
 @import "./variables";
 
-.co-transaction-default-flex-row {
+$thumbColor: #484f60;
+$trackColor: #e8eceb;
+$stopPoint: 10%;
+
+.co-transaction-small-toolbar {
+  overflow: auto;
+  &::-webkit-scrollbar {
+    -webkit-appearance: none;
+  }
+
+  &::-webkit-scrollbar:vertical {
+    width: 15px;
+  }
+
+  &::-webkit-scrollbar:horizontal {
+    height: 15px;
+  }
+
+  &::-webkit-scrollbar-thumb:vertical {
+    background: linear-gradient(to left, $thumbColor, $thumbColor $stopPoint, transparent $stopPoint, transparent);
+  }
+  &::-webkit-scrollbar-track:vertical {
+    background: linear-gradient(to left, $trackColor, $trackColor $stopPoint, transparent $stopPoint, transparent);
+  }
+  &::-webkit-scrollbar-thumb:horizontal {
+    background: linear-gradient(to top, $thumbColor, $thumbColor $stopPoint, transparent $stopPoint, transparent);
+  }
+  &::-webkit-scrollbar-track:horizontal {
+    background: linear-gradient(to top, $trackColor, $trackColor $stopPoint, transparent $stopPoint, transparent);
+  }
+}
+
+.co-transaction-default-popup-row {
   display: flex;
   flex-direction: row;
   align-items: center;
@@ -12,6 +44,15 @@
   padding: 8px 10px;
   overflow: hidden;
   margin: 0 0 5px 0;
+  user-select: none;
+  border-radius: $tp-default-border-radius;
+  background-color: $tp-default-background-accent;
+  .checkbox-list-label-wrapper {
+    cursor: pointer;
+    display: flex;
+    flex-direction: row;
+    column-gap: 10px;
+  }
 }
 
 .co-transaction-check::after {
@@ -29,6 +70,13 @@
   font-size: 23px;
 }
 
+.co-transaction-default-flex-row {
+  display: flex;
+  flex-direction: row;
+  align-items: center;
+  column-gap: $tp-default-column-gap;
+}
+
 .co-transaction-label {
   font-size: $tp-font-size-small;
   color: $tp-color-label;
@@ -39,3 +87,33 @@
   overflow: hidden;
   text-overflow: ellipsis;
 }
+
+.co-transaction-dialog-header-title {
+  font-size: $tp-transaction-dialog-header-title-font-size;
+  margin: $tp-transaction-dialog-header-title-margin;
+  font-weight: $tp-transaction-dialog-header-title-font-weight;
+}
+
+.transaction-line-button {
+  font-size: $tp-font-size;
+  cursor: pointer;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  height: $tp-transaction-line-button-height;
+  column-gap: $tp-transaction-line-button-column-gap;
+  padding: $tp-transaction-line-button-padding;
+  &:not(.no-border) {
+    border: $tp-transaction-line-button-border;
+    border-color: $tp-transaction-line-button-border-color;
+    border-radius: $tp-transaction-line-button-radius;
+    background-color: $tp-transaction-line-button-background-color;
+  }
+  &:not(.custom-width) {
+    width: $tp-transaction-line-button-width;
+    &.big {
+      width: $tp-transaction-line-button-big-width;
+    }
+  }
+}
+

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@colijnit/transaction",
-  "version": "12.1.33",
+  "version": "12.1.35",
   "description": "Colijn IT transaction module for Angular 12",
   "private": false,
   "peerDependencies": {