fcr-ui-scene 3.8.1-beta → 3.8.1

package/lib/modules/components/security-menu/index.css

@@ -1,42 +1,42 @@
-.security-menu .fcr-drop-menu-title {
-  color: var(--fcr_ui_scene_icontext1);
-  font-size: 12px;
-  text-align: left;
-  overflow: hidden;
-  text-overflow: ellipsis;
-  white-space: nowrap;
-  font-weight: 700;
-}
-.security-menu .fcr-drop-menu-option {
-  width: auto !important;
-  height: auto !important;
-}
-
-.security-menu .fcr-checkbox-input-wrapper {
-  border-color: transparent;
-  border-radius: var(--fcr_cornerradius_s);
-  width: 24px;
-  height: 24px;
-  border-width: 4px;
-  border-style: solid;
-  position: relative;
-}
-
-.security-menu .fcr-checkbox-inner {
-  position: absolute !important;
-  left: 0;
-  top: 0;
-  --effect-color: var(--fcr_ui_scene_ramp_brand4);
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  background: none;
-}
-
-.security-menu .fcr-checkbox-inner svg:not(.fcr-watermark-rotate-icon) path {
-  fill: var(--fcr_ui_scene_icontext1) !important;
-}
-
-.security-menu .fcr-drop-menu-option:hover svg:not(.fcr-watermark-rotate-icon) path {
-  fill: var(--fcr_ui_scene_ramp_brand6) !important;
-}
+.security-menu .fcr-drop-menu-title {
+  color: var(--fcr_ui_scene_icontext1);
+  font-size: 12px;
+  text-align: left;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+  font-weight: 700;
+}
+.security-menu .fcr-drop-menu-option {
+  width: auto !important;
+  height: auto !important;
+}
+
+.security-menu .fcr-checkbox-input-wrapper {
+  border-color: transparent;
+  border-radius: var(--fcr_cornerradius_s);
+  width: 24px;
+  height: 24px;
+  border-width: 4px;
+  border-style: solid;
+  position: relative;
+}
+
+.security-menu .fcr-checkbox-inner {
+  position: absolute !important;
+  left: 0;
+  top: 0;
+  --effect-color: var(--fcr_ui_scene_ramp_brand4);
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  background: none;
+}
+
+.security-menu .fcr-checkbox-inner svg:not(.fcr-watermark-rotate-icon) path {
+  fill: var(--fcr_ui_scene_icontext1) !important;
+}
+
+.security-menu .fcr-drop-menu-option:hover svg:not(.fcr-watermark-rotate-icon) path {
+  fill: var(--fcr_ui_scene_ramp_brand6) !important;
+}

package/lib/modules/components/tab-frame/index.css

@@ -1,40 +1,40 @@
-.fcr-tabs-frame {
-  display: flex;
-  flex-direction: column;
-  /* height: 100%; */
-  width: 100%;
-}
-
-.fcr-tabs-frame-tabs {
-  padding: 9px 0;
-  display: flex;
-  justify-content: center;
-  -webkit-app-region: drag;
-  cursor: move;
-  position: sticky;
-  top: 0;
-  background: var(--fcr_mobile_ui_scene_color_popup_fill2);
-  width: 100%;
-}
-
-.fcr-tabs-frame-tabs .fcr-tabs {
-  width: 306px;
-  border-radius: var(--fcr_cornerradius_s);
-  -webkit-app-region: no-drag;
-}
-
-.fcr-tabs-frame-tabs .fcr-tabs__nav-item {
-  flex: 1;
-  border-radius: var(--fcr_cornerradius_xs);
-  font-size: 12px;
-}
-
-.fcr-tabs-frame-content {
-  --top: 48px;
-  top: var(--top);
-  height: calc(100% - var(--top));
-  width: 100%;
-  display: flex;
-  justify-content: center;
-  padding: 0px 12px 12px 12px;
-}
+.fcr-tabs-frame {
+  display: flex;
+  flex-direction: column;
+  /* height: 100%; */
+  width: 100%;
+}
+
+.fcr-tabs-frame-tabs {
+  padding: 9px 0;
+  display: flex;
+  justify-content: center;
+  -webkit-app-region: drag;
+  cursor: move;
+  position: sticky;
+  top: 0;
+  background: var(--fcr_mobile_ui_scene_color_popup_fill2);
+  width: 100%;
+}
+
+.fcr-tabs-frame-tabs .fcr-tabs {
+  width: 306px;
+  border-radius: var(--fcr_cornerradius_s);
+  -webkit-app-region: no-drag;
+}
+
+.fcr-tabs-frame-tabs .fcr-tabs__nav-item {
+  flex: 1;
+  border-radius: var(--fcr_cornerradius_xs);
+  font-size: 12px;
+}
+
+.fcr-tabs-frame-content {
+  --top: 48px;
+  top: var(--top);
+  height: calc(100% - var(--top));
+  width: 100%;
+  display: flex;
+  justify-content: center;
+  padding: 0px 12px 12px 12px;
+}

package/lib/modules/components/toolbar/components/item/style.css

@@ -1,94 +1,94 @@
-.annotation-toolbar-item {
-  min-width: 32px;
-  max-width: 64px;
-  min-height: 32px;
-  max-height: 52px;
-  display: flex;
-  flex-direction: column;
-  align-items: center;
-  justify-content: center;
-  color: var(--fcr_ui_scene_icontext1);
-  cursor: pointer;
-  position: relative;
-}
-
-.annotation-toolbar-item .fcr-popover .fcr-tooltip-inner {
-  overflow: inherit !important;
-}
-
-.annotation-toolbar-item-icon {
-  max-width: 44px;
-  min-width: 32px;
-  height: 32px;
-  border-radius: var(--fcr_cornerradius_xs);
-  display: flex;
-  justify-content: center;
-  align-items: center;
-}
-
-.annotation-toolbar-item-title {
-  margin-top: 4px;
-  font-size: 12px;
-  font-weight: 300;
-}
-
-/* .annotation-toolbar-item:hover > .annotation-toolbar-item-icon {
-  background: var(--fcr_ui_scene_ramp_brand1);
-}
-
-.annotation-toolbar-item.hover > .annotation-toolbar-item-title {
-  color: var(--fcr_ui_scene_ramp_brand6);
-} */
-
-.annotation-toolbar-item.is-active > .annotation-toolbar-item-icon {
-  background: var(--fcr_ui_scene_ramp_brand0);
-}
-
-.annotation-toolbar-item.is-active > .annotation-toolbar-item-title {
-  color: var(--fcr_ui_scene_ramp_brand6);
-}
-
-.annotation-toolbar-item.is-disabled {
-  cursor: not-allowed;
-}
-
-.annotation-toolbar-item.is-disabled > .annotation-toolbar-item-title {
-  color: var(--fcr_ui_scene_icontext3);
-}
-
-.annotation-toolbar-item-context-menu {
-  color: var(--fcr_ui_scene_icontext1);
-  line-height: 100%;
-}
-.annotation-toolbar-item-icon-wrapper {
-  width: 18px;
-  height: 18px;
-  border-radius: 50%;
-  background: conic-gradient(
-    from 180deg at 50% 50%,
-    #ff7171 0deg,
-    #ffa471 30deg,
-    #ffe37f 63.75deg,
-    #e3ff75 91.88deg,
-    #a9ff75 125.63deg,
-    #79ff8f 163.12deg,
-    #72ffe6 189.38deg,
-    #70cff8 210deg,
-    #6880ff 232.5deg,
-    #7856ff 260.62deg,
-    #dd56ff 277.5deg,
-    #ff56da 303.75deg,
-    #ff3797 327.96deg,
-    #ff6464 340.25deg,
-    #ff5656 359.93deg,
-    #ff7171 360deg
-  );
-  display: flex;
-  justify-content: center;
-  align-items: center;
-}
-.annotation-toolbar-item-icon-wrapper > svg {
-  position: absolute;
-  width: 28px;
-  height: 28px;
-}
+.annotation-toolbar-item {
+  min-width: 32px;
+  max-width: 64px;
+  min-height: 32px;
+  max-height: 52px;
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  justify-content: center;
+  color: var(--fcr_ui_scene_icontext1);
+  cursor: pointer;
+  position: relative;
+}
+
+.annotation-toolbar-item .fcr-popover .fcr-tooltip-inner {
+  overflow: inherit !important;
+}
+
+.annotation-toolbar-item-icon {
+  max-width: 44px;
+  min-width: 32px;
+  height: 32px;
+  border-radius: var(--fcr_cornerradius_xs);
+  display: flex;
+  justify-content: center;
+  align-items: center;
+}
+
+.annotation-toolbar-item-title {
+  margin-top: 4px;
+  font-size: 12px;
+  font-weight: 300;
+}
+
+/* .annotation-toolbar-item:hover > .annotation-toolbar-item-icon {
+  background: var(--fcr_ui_scene_ramp_brand1);
+}
+
+.annotation-toolbar-item.hover > .annotation-toolbar-item-title {
+  color: var(--fcr_ui_scene_ramp_brand6);
+} */
+
+.annotation-toolbar-item.is-active > .annotation-toolbar-item-icon {
+  background: var(--fcr_ui_scene_ramp_brand0);
+}
+
+.annotation-toolbar-item.is-active > .annotation-toolbar-item-title {
+  color: var(--fcr_ui_scene_ramp_brand6);
+}
+
+.annotation-toolbar-item.is-disabled {
+  cursor: not-allowed;
+}
+
+.annotation-toolbar-item.is-disabled > .annotation-toolbar-item-title {
+  color: var(--fcr_ui_scene_icontext3);
+}
+
+.annotation-toolbar-item-context-menu {
+  color: var(--fcr_ui_scene_icontext1);
+  line-height: 100%;
+}
+.annotation-toolbar-item-icon-wrapper {
+  width: 18px;
+  height: 18px;
+  border-radius: 50%;
+  background: conic-gradient(
+    from 180deg at 50% 50%,
+    #ff7171 0deg,
+    #ffa471 30deg,
+    #ffe37f 63.75deg,
+    #e3ff75 91.88deg,
+    #a9ff75 125.63deg,
+    #79ff8f 163.12deg,
+    #72ffe6 189.38deg,
+    #70cff8 210deg,
+    #6880ff 232.5deg,
+    #7856ff 260.62deg,
+    #dd56ff 277.5deg,
+    #ff56da 303.75deg,
+    #ff3797 327.96deg,
+    #ff6464 340.25deg,
+    #ff5656 359.93deg,
+    #ff7171 360deg
+  );
+  display: flex;
+  justify-content: center;
+  align-items: center;
+}
+.annotation-toolbar-item-icon-wrapper > svg {
+  position: absolute;
+  width: 28px;
+  height: 28px;
+}

package/lib/modules/components/toolbar/components/panel/style.css

@@ -1,86 +1,86 @@
-.fcr-annotation-toolbar-panel {
-  max-width: 300px;
-  padding: 0 6px;
-  height: auto;
-  background: var(fcr_mobile_ui_scene_color_popup_fill2);
-  border-radius: var(--fcr_cornerradius_l);
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  --small-width: 148px;
-}
-
-.fcr-annotation-toolbar-panel.small {
-  box-sizing: content-box;
-  border-radius: 8px;
-}
-
-.fcr-annotation-toolbar-panel.medium {
-  padding: 12px;
-}
-
-.fcr-annotation-toolbar-panel.small > div {
-  min-height: 36px;
-  display: flex;
-  gap: 0;
-  box-sizing: content-box;
-}
-
-.fcr-annotation-toolbar-panel.medium > div {
-  min-height: 36px;
-  display: flex;
-  gap: 12px;
-  box-sizing: content-box;
-}
-
-.fcr-annotation-toolbar-panel .annotation-toolbar-item {
-  width: 36px;
-}
-
-.fcr-annotation-toolbar-panel.medium .fcr-annotation-toolbar-panel-footer {
-  border-top: 1px solid var(--fcr_ui_scene_line1);
-  padding-top: 8px;
-  margin-top: 8px;
-}
-
-.fcr-annotation-toolbar-panel.small .fcr-annotation-toolbar-panel-footer {
-  border-top: 1px solid var(--fcr_ui_scene_line1);
-  font-size: 12px;
-  color: var(--fcr_ui_scene_black3);
-  min-height: 24px;
-  text-align: center;
-  line-height: 1.2;
-  border-top: 1px solid var(--fcr_ui_scene_black1);
-  max-width: var(--small-width);
-}
-
-.fcr-annotation-toolbar-panel.vertical {
-  flex-direction: column;
-}
-.fcr-annotation-toolbar-panel.vertical .fcr-annotation-toolbar-panel-header {
-  padding: 6px 0;
-  gap: 6px;
-  flex-direction: column;
-}
-.fcr-annotation-toolbar-panel.vertical .fcr-annotation-toolbar-panel-footer {
-  padding: 6px 0;
-  gap: 6px;
-  flex-direction: column;
-}
-.fcr-annotation-toolbar-panel.horizontal {
-  flex-direction: row;
-}
-.fcr-annotation-toolbar-panel.horizontal .fcr-annotation-toolbar-panel-header {
-  flex-direction: row;
-}
-
-.fcr-annotation-toolbar-panel.horizontal .fcr-annotation-toolbar-panel-footer {
-  flex-direction: row;
-}
-
-.fcr-annotation-toolbar-panel-content {
-  width: var(--small-width);
-  display: flex;
-  flex-wrap: wrap;
-  padding: 8px;
-}
+.fcr-annotation-toolbar-panel {
+  max-width: 300px;
+  padding: 0 6px;
+  height: auto;
+  background: var(fcr_mobile_ui_scene_color_popup_fill2);
+  border-radius: var(--fcr_cornerradius_l);
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  --small-width: 148px;
+}
+
+.fcr-annotation-toolbar-panel.small {
+  box-sizing: content-box;
+  border-radius: 8px;
+}
+
+.fcr-annotation-toolbar-panel.medium {
+  padding: 12px;
+}
+
+.fcr-annotation-toolbar-panel.small > div {
+  min-height: 36px;
+  display: flex;
+  gap: 0;
+  box-sizing: content-box;
+}
+
+.fcr-annotation-toolbar-panel.medium > div {
+  min-height: 36px;
+  display: flex;
+  gap: 12px;
+  box-sizing: content-box;
+}
+
+.fcr-annotation-toolbar-panel .annotation-toolbar-item {
+  width: 36px;
+}
+
+.fcr-annotation-toolbar-panel.medium .fcr-annotation-toolbar-panel-footer {
+  border-top: 1px solid var(--fcr_ui_scene_line1);
+  padding-top: 8px;
+  margin-top: 8px;
+}
+
+.fcr-annotation-toolbar-panel.small .fcr-annotation-toolbar-panel-footer {
+  border-top: 1px solid var(--fcr_ui_scene_line1);
+  font-size: 12px;
+  color: var(--fcr_ui_scene_black3);
+  min-height: 24px;
+  text-align: center;
+  line-height: 1.2;
+  border-top: 1px solid var(--fcr_ui_scene_black1);
+  max-width: var(--small-width);
+}
+
+.fcr-annotation-toolbar-panel.vertical {
+  flex-direction: column;
+}
+.fcr-annotation-toolbar-panel.vertical .fcr-annotation-toolbar-panel-header {
+  padding: 6px 0;
+  gap: 6px;
+  flex-direction: column;
+}
+.fcr-annotation-toolbar-panel.vertical .fcr-annotation-toolbar-panel-footer {
+  padding: 6px 0;
+  gap: 6px;
+  flex-direction: column;
+}
+.fcr-annotation-toolbar-panel.horizontal {
+  flex-direction: row;
+}
+.fcr-annotation-toolbar-panel.horizontal .fcr-annotation-toolbar-panel-header {
+  flex-direction: row;
+}
+
+.fcr-annotation-toolbar-panel.horizontal .fcr-annotation-toolbar-panel-footer {
+  flex-direction: row;
+}
+
+.fcr-annotation-toolbar-panel-content {
+  width: var(--small-width);
+  display: flex;
+  flex-wrap: wrap;
+  padding: 8px;
+}