@fileverse-dev/fortune-react 1.0.2-mod-26 → 1.0.2-mod-27

package/dist/index.esm.css

@@ -1514,6 +1514,30 @@ line-height: 16px; /* 133.333% */
   min-width: 154px;
 }
 
+/* Add scrollbar styles */
+#fortune-search-replace .table-container {
+  scrollbar-width: thin;
+  scrollbar-color: #babac0 transparent;
+}
+
+#fortune-search-replace .table-container::-webkit-scrollbar {
+  width: 8px;
+  height: 8px;
+}
+
+#fortune-search-replace .table-container::-webkit-scrollbar-track {
+  background-color: transparent;
+}
+
+#fortune-search-replace .table-container::-webkit-scrollbar-thumb {
+  background-color: #babac0;
+  border-radius: 16px;
+}
+
+#fortune-search-replace .table-container::-webkit-scrollbar-button {
+  display: none;
+}
+
 .fortune-link-modify-modal {
   position: absolute;
   overflow: hidden;
@@ -1829,14 +1853,11 @@ line-height: 16px; /* 133.333% */
 }
 
 #range-dialog {
-  box-shadow: 0 4px 16px rgb(0 0 0 / 20%);
+  box-shadow: 2px 2px 10px rgba(0, 0, 0, 0.2);
   background: #fff;
-  background-clip: padding-box;
-  border: 1px solid rgba(0, 0, 0, 0.333);
+  border: 1px solid hsl(var(--color-border-default));
   outline: 0;
   position: absolute;
-  color: #000;
-  padding: 30px 42px;
   z-index: 100003;
   left: 50%;
   top: 50%;
@@ -1902,34 +1923,41 @@ line-height: 16px; /* 133.333% */
 
 .condition-format-sub-menu {
   position: absolute;
-  top: -8px;
-  box-shadow: 0 2px 4px rgb(0 0 0 / 20%);
+  top: -12px;
+  box-shadow: 2px 2px 10px rgba(0, 0, 0, 0.2);
   background: #fff;
-  border: 1px solid rgba(0, 0, 0, 0.2);
+  border: 1px solid hsl(var(--color-border-default));
+  border-radius: 8px;
   cursor: default;
-  font-size: 12px;
+  font-size: 14px;
   z-index: 1004;
   box-sizing: border-box;
   -webkit-user-select: none;
      -moz-user-select: none;
           user-select: none;
   outline: none;
+  padding: 8px;
+  min-width: 190px;
 }
 
 .condition-format-item {
   display: flex;
   justify-content: space-between;
-  padding: 6px 18px;
+  padding: 8px;
   z-index: 1005;
+  border-radius: 4px;
+  cursor: pointer;
 }
 
 .condition-format-item:hover {
-  background: #efefef;
+  background: hsl(var(--color-bg-default-hover));
+  transition: all 0.2s ease-in-out;
 }
 
 .condition-format-item span {
-  font-size: 10px;
-  color: #afafaf;
+  font-size: 14px;
+  color: hsl(var(--color-text-secondary));
+  font-weight: 400;
 }
 
 .horizontal-line {
@@ -1971,8 +1999,11 @@ line-height: 16px; /* 133.333% */
 }
 
 .condition-rules {
-  padding: 0px 42px 34px 42px;
-  font-size: 12px;
+  /* padding: 0px 42px 34px 42px; */
+  font-size: 14px;
+  display: flex;
+  flex-direction: column;
+  gap: 16px;
 }
 
 .condition-rules-title {
@@ -1982,9 +2013,8 @@ line-height: 16px; /* 133.333% */
   margin-bottom: 18px;
 }
 
-.conditin-rules-value {
-  margin: 5px 0;
-  font-weight: 600;
+.condition-rules-value {
+  margin-bottom: 4px;
 }
 
 .condition-rules-inpbox {
@@ -2014,40 +2044,45 @@ line-height: 16px; /* 133.333% */
 }
 
 .condition-rules-setbox {
-  border: 1px solid #d4d4d4;
+  display: flex;
+  flex-direction: column;
+  gap: 8px;
 }
 
 .condition-rules-set {
-  padding: 5px 10px;
+  width: 100%;
+  display: flex;
+  align-items: center;
+  gap: 8px;
 }
 
 .condition-rules-color {
-  height: 30px;
-  line-height: 30px;
-  position: relative;
+  display: flex;
+  align-items: center;
+  gap: 8px;
 }
 
 .condition-rules-check {
-  float: left;
-  margin-top: 10px;
+  /* float: left; */
+  /* margin-top: 10px; */
 }
 
 .condition-rules-label {
   display: inline-block;
-  width: 80px;
+  width: 70px;
   -webkit-user-select: none;
      -moz-user-select: none;
           user-select: none;
 }
 
 .condition-rules-select-color {
-  padding: 2px;
-  border: solid 1px #e5e5e5;
-  background: #f5f5f5;
-  position: absolute;
-  top: 50%;
-  left: 50%;
-  transform: translate(20%, -50%);
+  background: hsl(var(--color-bg-default));
+  width: 2.5rem;
+  height: 1.5rem;
+  border-radius: 4px;
+  padding: 0;
+  margin: 0;
+  cursor: pointer;
 }
 
 .condition-rules-between-box {
@@ -2071,23 +2106,37 @@ line-height: 16px; /* 133.333% */
 }
 
 .condition-rules-date {
-  width: 98%;
-  border: none;
-  line-height: 26px;
+  width: 100%;
 }
 
 .condition-rules-select {
-  width: 150px;
-  height: 30px;
+  width: 100%;
+  z-index: 999999;
 }
 
 .condition-rules-project-box {
   display: flex;
   align-items: center;
+  gap: 8px;
 }
 
 .condition-rules-project-input {
-  margin: 0px 6px;
+  margin: 0px;
+  width: -moz-fit-content;
+  width: fit-content;
+  max-width: 55px !important;
+}
+
+/* Hide arrows for Chrome, Safari, Edge */
+input[type="number"].condition-rules-project-input::-webkit-outer-spin-button,
+input[type="number"].condition-rules-project-input::-webkit-inner-spin-button {
+  -webkit-appearance: none;
+  margin: 0;
+}
+
+/* Hide arrows for Firefox */
+input[type="number"].condition-rules-project-input {
+  -moz-appearance: textfield;
 }
 
 .fortune-toolbar {
@@ -2119,7 +2168,7 @@ line-height: 16px; /* 133.333% */
 .fortune-toolbar-menu-divider {
   width: "100%";
   height: 1px;
-  margin: 2px 6px;
+  margin: 8px 0px;
   background-color: #e0e0e0;
 }
 
@@ -2185,14 +2234,14 @@ line-height: 16px; /* 133.333% */
 .fortune-toolbar-select,
 .fortune-toolbar-color-picker {
   box-shadow: 2px 2px 10px rgba(0, 0, 0, 0.2);
-  padding: 10px;
-  border-radius: 6px;
+  padding: 0.5rem;
+  border: 1px solid hsl(var(--color-border-default));
+  border-radius: 8px;
   background: white;
+  min-width: 240px;
 }
 
 .fortune-toolbar-select {
-  padding-left: 0;
-  padding-right: 0;
   overflow: auto;
   max-height: 75vh;
 }
@@ -2204,7 +2253,7 @@ line-height: 16px; /* 133.333% */
 .fortune-toolbar-select-option {
   font-size: 12px;
   min-width: 60px;
-  padding: 8px 12px;
+  padding: 8px;
   cursor: pointer;
   -webkit-user-select: none;
      -moz-user-select: none;
@@ -2212,7 +2261,9 @@ line-height: 16px; /* 133.333% */
 }
 
 .fortune-toolbar-select-option:hover {
-  background: #efefef;
+  background: hsl(var(--color-bg-default-hover));
+  border-radius: 4px;
+  transition: all 0.2s ease-in-out;
 }
 
 .fortune-toolbar-select::-webkit-scrollbar {
@@ -2411,6 +2462,7 @@ line-height: 16px; /* 133.333% */
   background: #efefef;
   cursor: pointer;
 }
+
 /*函数公式查找样式*/
 #luckysheet-search-formula {
   font-size: 12px;
@@ -3075,30 +3127,30 @@ label {
 }
 
 .fortune-context-menu {
+  min-width: 240px;
   max-height: 100%;
   overflow-y: auto;
   border-radius: 4px;
-  box-shadow: 2px 2px 20px rgba(0, 0, 0, 0.15);
+  box-shadow: 2px 2px 10px rgba(0, 0, 0, 0.2);
   transition: opacity 0.218s;
   background: #fff;
-  border: 1px solid #E8EBEC;
-  border: 1px solid #E8EBEC;
+  border: 1px solid hsl(var(--color-border-default));
   cursor: default;
   font-size: 13px;
   margin: 0;
   outline: none;
-  padding: 6px 0;
+  padding: 8px;
   position: absolute;
   z-index: 1004;
   box-sizing: border-box;
   -webkit-user-select: none;
      -moz-user-select: none;
           user-select: none;
-  font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif;
+  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
   font-size: 14px;
   max-width: 250px;
   box-shadow: 0px 4px 6px rgba(0, 0, 0, 0.1), 0px 1px 3px rgba(0, 0, 0, 0.08);
-  color: #363B3F;
+  color: #363b3f;
   line-height: 20px;
 }
 
@@ -3106,8 +3158,14 @@ label {
   display: flex;
   align-items: center;
   height: 20px;
+  cursor: pointer;
+  border-radius: 4px;
 }
 
+.context-item:hover {
+  background: hsl(var(--color-bg-default-hover));
+  transition: all 0.2s ease-in-out;
+}
 
 .fortune-context-menu input.luckysheet-mousedown-cancel {
   width: 35px;
@@ -3129,20 +3187,19 @@ label {
   cursor: pointer;
   list-style: none;
   margin: 0;
-  padding: 1px 6em 1px 20px;
   white-space: nowrap;
-  padding-left: 8px;
   vertical-align: middle;
-  padding-right: 24px;
   -webkit-user-select: none;
      -moz-user-select: none;
           user-select: none;
+  border-radius: 4px;
 }
 
 /* 右击菜单项目 hover背景色 */
 .luckysheet-cols-menu .luckysheet-cols-menuitem:hover,
 .luckysheet-cols-menu .luckysheet-cols-menuitem-hover {
-  background: #efefef;
+  background: hsl(var(--color-bg-default-hover));
+  transition: all 0.2s ease-in-out;
 }
 
 .luckysheet-cols-menu
@@ -3153,11 +3210,14 @@ label {
   cursor: pointer;
   list-style: none;
   margin: 0;
-  padding: 6px 10px 6px 10px !important;
+  padding: 8px !important;
   white-space: nowrap;
   -webkit-user-select: none;
      -moz-user-select: none;
           user-select: none;
+  display: flex;
+  align-items: center;
+  gap: 8px;
 }
 
 .fortune-filter-menu .luckysheet-cols-menuitem {
@@ -3376,30 +3436,10 @@ label {
   right: -18px;
 }
 
-.fortune-sort-title {
-  background-color: #fff;
-  color: #000;
-  cursor: default;
-  font-size: 16px;
-  font-weight: 400;
-  line-height: 24px;
-  margin: 0 0 16px;
+.tippy-box {
+  background-color: transparent !important;
 }
-
-.fortune-sort-modal > div {
-  margin-bottom: 10px;
-}
-
-.fortune-sort-tablec td {
-  padding: 5px;
-  white-space: nowrap;
-}
-
-.fortune-sort-button {
-  margin-top: 10px;
-  margin-bottom: 25px;
-}
-
+.tippy-box[data-animation=fade][data-state=hidden]{opacity:0}[data-tippy-root]{max-width:calc(100vw - 10px)}.tippy-box{position:relative;background-color:#333;color:#fff;border-radius:4px;font-size:14px;line-height:1.4;white-space:normal;outline:0;transition-property:transform,visibility,opacity}.tippy-box[data-placement^=top]>.tippy-arrow{bottom:0}.tippy-box[data-placement^=top]>.tippy-arrow:before{bottom:-7px;left:0;border-width:8px 8px 0;border-top-color:initial;transform-origin:center top}.tippy-box[data-placement^=bottom]>.tippy-arrow{top:0}.tippy-box[data-placement^=bottom]>.tippy-arrow:before{top:-7px;left:0;border-width:0 8px 8px;border-bottom-color:initial;transform-origin:center bottom}.tippy-box[data-placement^=left]>.tippy-arrow{right:0}.tippy-box[data-placement^=left]>.tippy-arrow:before{border-width:8px 0 8px 8px;border-left-color:initial;right:-7px;transform-origin:center left}.tippy-box[data-placement^=right]>.tippy-arrow{left:0}.tippy-box[data-placement^=right]>.tippy-arrow:before{left:-7px;border-width:8px 8px 8px 0;border-right-color:initial;transform-origin:center right}.tippy-box[data-inertia][data-state=visible]{transition-timing-function:cubic-bezier(.54,1.5,.38,1.11)}.tippy-arrow{width:16px;height:16px;color:#333}.tippy-arrow:before{content:"";position:absolute;border-color:transparent;border-style:solid}.tippy-content{position:relative;padding:5px 9px;z-index:1}
 #fortune-change-color {
   min-width: 164px;
   height: 252px;