@moneko/core 2.0.0-beta.15 → 2.0.0-beta.17
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/lib/styles/vars.js +1 -1
- package/lib/styles/vars.js.map +1 -1
- package/package.json +1 -1
package/lib/styles/vars.js
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
function _defineProperty(obj,key,value){if(key in obj){Object.defineProperty(obj,key,{value:value,enumerable:true,configurable:true,writable:true})}else{obj[key]=value}return obj}function _objectSpread(target){for(var i=1;i<arguments.length;i++){var source=arguments[i]!=null?arguments[i]:{};var ownKeys=Object.keys(source);if(typeof Object.getOwnPropertySymbols==="function"){ownKeys=ownKeys.concat(Object.getOwnPropertySymbols(source).filter(function(sym){return Object.getOwnPropertyDescriptor(source,sym).enumerable}))}ownKeys.forEach(function(key){_defineProperty(target,key,source[key])})}return target}function ownKeys(object,enumerableOnly){var keys=Object.keys(object);if(Object.getOwnPropertySymbols){var symbols=Object.getOwnPropertySymbols(object);if(enumerableOnly){symbols=symbols.filter(function(sym){return Object.getOwnPropertyDescriptor(object,sym).enumerable})}keys.push.apply(keys,symbols)}return keys}function _objectSpreadProps(target,source){source=source!=null?source:{};if(Object.getOwnPropertyDescriptors){Object.defineProperties(target,Object.getOwnPropertyDescriptors(source))}else{ownKeys(Object(source)).forEach(function(key){Object.defineProperty(target,key,Object.getOwnPropertyDescriptor(source,key))})}return target}function _taggedTemplateLiteral(strings,raw){if(!raw){raw=strings.slice(0)}return Object.freeze(Object.defineProperties(strings,{raw:{value:Object.freeze(raw)}}))}function _templateObject(){var data=_taggedTemplateLiteral(["\n :root {\n --text-shadow-color: rgba(0, 0, 0, 0.1);\n --font-size-base: 14px;\n --border-color-base: #d9d9d9;\n --border-radius-base: 4px;\n --body-background: #f8f8f8;\n --component-background: #fff;\n --table-header-bg: rgba(0, 0, 0, 0.02);\n --text-color: rgba(0, 0, 0, 0.65);\n --text-color-secondary: rgba(0, 0, 0, 0.45);\n --heading-color: rgba(0, 0, 0, 0.85);\n --text-selection-bg: var(--primary-color-deprecated-bg);\n --box-shadow-small: 0 0 12px rgba(0, 0, 0, 0.1);\n --font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial,\n 'Noto Sans', sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol',\n 'Noto Color Emoji', 'Helvetica', 'Oxygen', 'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans';\n --transition-duration: 0.
|
|
1
|
+
function _defineProperty(obj,key,value){if(key in obj){Object.defineProperty(obj,key,{value:value,enumerable:true,configurable:true,writable:true})}else{obj[key]=value}return obj}function _objectSpread(target){for(var i=1;i<arguments.length;i++){var source=arguments[i]!=null?arguments[i]:{};var ownKeys=Object.keys(source);if(typeof Object.getOwnPropertySymbols==="function"){ownKeys=ownKeys.concat(Object.getOwnPropertySymbols(source).filter(function(sym){return Object.getOwnPropertyDescriptor(source,sym).enumerable}))}ownKeys.forEach(function(key){_defineProperty(target,key,source[key])})}return target}function ownKeys(object,enumerableOnly){var keys=Object.keys(object);if(Object.getOwnPropertySymbols){var symbols=Object.getOwnPropertySymbols(object);if(enumerableOnly){symbols=symbols.filter(function(sym){return Object.getOwnPropertyDescriptor(object,sym).enumerable})}keys.push.apply(keys,symbols)}return keys}function _objectSpreadProps(target,source){source=source!=null?source:{};if(Object.getOwnPropertyDescriptors){Object.defineProperties(target,Object.getOwnPropertyDescriptors(source))}else{ownKeys(Object(source)).forEach(function(key){Object.defineProperty(target,key,Object.getOwnPropertyDescriptor(source,key))})}return target}function _taggedTemplateLiteral(strings,raw){if(!raw){raw=strings.slice(0)}return Object.freeze(Object.defineProperties(strings,{raw:{value:Object.freeze(raw)}}))}function _templateObject(){var data=_taggedTemplateLiteral(["\n :root {\n --text-shadow-color: rgba(0, 0, 0, 0.1);\n --font-size-base: 14px;\n --border-color-base: #d9d9d9;\n --border-radius-base: 4px;\n --body-background: #f8f8f8;\n --component-background: #fff;\n --table-header-bg: rgba(0, 0, 0, 0.02);\n --text-color: rgba(0, 0, 0, 0.65);\n --text-color-secondary: rgba(0, 0, 0, 0.45);\n --heading-color: rgba(0, 0, 0, 0.85);\n --text-selection-bg: var(--primary-color-deprecated-bg);\n --box-shadow-small: 0 0 12px rgba(0, 0, 0, 0.1);\n --box-shadow-base: 0 3px 6px -4px rgba(0, 0, 0, 0.12), 0 6px 16px 0 rgba(0, 0, 0, 0.08),\n 0 9px 28px 8px rgba(0, 0, 0, 0.05);\n --font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial,\n 'Noto Sans', sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol',\n 'Noto Color Emoji', 'Helvetica', 'Oxygen', 'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans';\n --transition-duration: 0.3s;\n --transition-timing-function: cubic-bezier(0.94, -0.1, 0.1, 1.2);\n --antd-wave-shadow-color: var(--primary-color-outline);\n --disable-color: rgba(0, 0, 0, 0.25);\n --btn-disable-bg: var(--disable-color);\n --btn-disable-border: var(--disable-color);\n --menu-dark-item-active-bg: #0e3ab3;\n ","\n }\n [data-theme='dark'] {\n --text-selection-bg: var(--primary-color-deprecated-bg);\n --text-color-secondary: rgba(255, 255, 255, 0.25);\n --text-shadow-color: rgba(255, 255, 255, 0.1);\n --header-shadow: rgba(255, 255, 255, 0.05);\n --body-background: #000;\n --component-background: #141414;\n --header-bg: rgba(20, 20, 20, 0.9);\n --text-color: #ffffffd9;\n --border-color-base: #303030;\n --heading-color: rgba(255, 255, 255, 0.85);\n --disabled-color: rgba(255, 255, 255, 0.3);\n ","\n }\n"]);_templateObject=function _templateObject(){return data};return data}function _templateObject1(){var data=_taggedTemplateLiteral(["\n html,\n body {\n width: 100vw;\n height: 100vh;\n padding: 0;\n overflow: hidden;\n margin: 0;\n color: var(--text-color);\n font-size: var(--font-size-base);\n font-family: var(--font-family);\n line-height: 1.8;\n background-color: var(--body-background);\n transition-duration: var(--transition-duration);\n transition-property: background-color, color;\n transition-timing-function: var(--transition-timing-function);\n -webkit-text-size-adjust: 100%;\n }\n main {\n display: block;\n }\n input,\n textarea {\n caret-color: plum;\n }\n\n :-webkit-autofill,\n :-webkit-autofill:hover,\n :-webkit-autofill:focus {\n font-weight: 400;\n border: none;\n border-radius: 5px;\n box-shadow: 0 0 0 1000px transparent inset;\n transition: background-color var(--transition-duration) var(--transition-timing-function);\n -webkit-text-fill-color: var(--text-color);\n caret-color: transparent;\n }\n\n ::-webkit-scrollbar {\n width: 5px;\n height: 5px;\n opacity: 0;\n }\n\n ::-webkit-scrollbar-track {\n background-color: transparent;\n }\n\n ::-webkit-scrollbar-thumb {\n background-color: transparent;\n border-radius: 5px;\n }\n\n :hover::-webkit-scrollbar-thumb {\n background-color: rgba(78, 78, 78, 0.15);\n }\n\n ::-webkit-scrollbar-thumb:hover {\n background-color: rgba(176, 139, 227, 0.5);\n }\n\n ::-webkit-scrollbar-thumb:active {\n background-color: rgba(247, 138, 224, 0.5);\n }\n\n ::-webkit-scrollbar-button {\n display: none;\n }\n\n .text-ellipsis,\n .text-ellipsis-2 {\n overflow: hidden;\n text-overflow: ellipsis;\n }\n\n .text-ellipsis {\n white-space: nowrap;\n }\n\n .text-ellipsis-2 {\n display: -webkit-box;\n -webkit-line-clamp: 2;\n /*! autoprefixer: off */\n -webkit-box-orient: vertical;\n }\n\n .flex {\n display: flex;\n }\n\n .f-row {\n flex-direction: row;\n }\n\n .f-a-c {\n align-items: center;\n }\n\n .mr5 {\n margin-right: 5px;\n }\n\n .pos-r-0 {\n position: absolute;\n right: 0;\n }\n\n .login-toolbox {\n height: 64px;\n\n button {\n margin-right: 16px;\n }\n }\n"]);_templateObject1=function _templateObject1(){return data};return data}function _templateObject2(){var data=_taggedTemplateLiteral(["\n #root {\n display: flex;\n flex-direction: column;\n width: 100%;\n height: 100%;\n -webkit-overflow-scrolling: touch;\n\n > main {\n display: block;\n flex: 1;\n width: 100%;\n overflow-y: auto;\n animation: "," var(--transition-duration);\n }\n }\n"]);_templateObject2=function _templateObject2(){return data};return data}import{css}from"@emotion/react";import{routeInKeyframes}from"./animation";import tinycolor from"tinycolor2";import colorPalette from"../utils/color-palette";export var menuDarkBg="#1C222E";export var getColorPalette=function(name,color){var type=arguments.length>2&&arguments[2]!==void 0?arguments[2]:"light",bg=arguments.length>3&&arguments[3]!==void 0?arguments[3]:"#fff";var vars={};if(type==="light"){var i=1;while(i<=7){vars["--".concat(name,"-").concat(i)]=colorPalette(color,i);i++}}else{var _obj;Object.assign(vars,(_obj={},_defineProperty(_obj,"--".concat(name,"-1"),tinycolor.mix(colorPalette(color,8),bg,.15)),_defineProperty(_obj,"--".concat(name,"-2"),tinycolor.mix(colorPalette(color,7),bg,.25)),_defineProperty(_obj,"--".concat(name,"-3"),tinycolor.mix(color,bg,.3)),_defineProperty(_obj,"--".concat(name,"-4"),tinycolor.mix(color,bg,.45)),_defineProperty(_obj,"--".concat(name,"-5"),tinycolor.mix(color,bg,.65)),_defineProperty(_obj,"--".concat(name,"-6"),color),_defineProperty(_obj,"--".concat(name,"-7"),tinycolor.mix(colorPalette(color,5),bg,.9)),_obj))}var _obj1;return _objectSpreadProps(_objectSpread({},vars),(_obj1={},_defineProperty(_obj1,"--".concat(name,"-color-deprecated-bg"),"var(--".concat(name,"-1)")),_defineProperty(_obj1,"--".concat(name,"-color-deprecated-border"),"var(--".concat(name,"-3)")),_defineProperty(_obj1,"--".concat(name,"-color-hover"),"var(--".concat(name,"-5)")),_defineProperty(_obj1,"--".concat(name,"-color"),color),_defineProperty(_obj1,"--".concat(name,"-color-outline"),tinycolor(color).setAlpha(.2).toRgbString()),_defineProperty(_obj1,"--".concat(name,"-color-active"),"var(--".concat(name,"-7)")),_obj1))};var keyword=["primary","warning","error","success"];export var setThemeColor=function(options){keyword.forEach(function(name){var color=options[name];if(color){var colors=getColorPalette(name,color,options.type,options.componentBackground);if(name==="primary"||name==="error"){Object.assign(colors,_defineProperty({},name==="primary"?"--menu-dark-item-active-bg":"--menu-dark-item-active-danger-bg",tinycolor.mix(colorPalette(color,8),menuDarkBg||"#141414",.15).toRgbString()))}for(var key in colors){if(Object.prototype.hasOwnProperty.call(colors,key)){var newColor=colors[key];if(getComputedStyle(document.documentElement).getPropertyValue(key)!==newColor){document.documentElement.style.setProperty(key,newColor)}}}}});if(options.tableHeaderBg){document.documentElement.style.setProperty("--table-header-bg",options.tableHeaderBg)}};var rootStatusColor=_objectSpread({},getColorPalette("normal","rgba(0, 0, 0, 0.85)","light","#fff"),getColorPalette("primary","#1890ff","light","#fff"),getColorPalette("success","#52c41a","light","#fff"),getColorPalette("warning","#faad14","light","#fff"),getColorPalette("error","#ff4d4f","light","#fff"));var rootStatusColorVariables="";Object.entries(rootStatusColor).forEach(function(e){rootStatusColorVariables+="".concat(e.join(": "),";\n")});var rootStatusColorDark=_objectSpread({},getColorPalette("normal","rgba(255, 255, 255, 0.85)","dark","#141414"),getColorPalette("primary","#177ddc","dark","#141414"),getColorPalette("success","#49aa19","dark","#141414"),getColorPalette("warning","#d89614","dark","#141414"),getColorPalette("error","#a61d24","dark","#141414"));var rootStatusColorDarkVariables="";Object.entries(rootStatusColorDark).forEach(function(e){rootStatusColorDarkVariables+="".concat(e.join(": "),";\n")});export var rootVariables=css(_templateObject(),rootStatusColorVariables,rootStatusColorDarkVariables);export var globalStyles=css(_templateObject1());export var rootStyle=css(_templateObject2(),routeInKeyframes);
|
|
2
2
|
//# sourceMappingURL=vars.js.map
|
package/lib/styles/vars.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../src/styles/vars.ts"],"sourcesContent":["import { css } from '@emotion/react';\nimport { routeInKeyframes } from './animation';\nimport tinycolor from 'tinycolor2';\nimport colorPalette from '../utils/color-palette';\n\nexport const menuDarkBg = '#1C222E';\nexport const getColorPalette = (\n name: string,\n color: string,\n type: 'light' | 'dark' = 'light',\n bg = '#fff'\n) => {\n const vars: Record<string, string> = {};\n\n if (type === 'light') {\n let i = 1;\n\n while (i <= 7) {\n vars[`--${name}-${i}`] = colorPalette(color, i);\n i++;\n }\n } else {\n Object.assign(vars, {\n [`--${name}-1`]: tinycolor.mix(colorPalette(color, 8), bg, 0.15),\n [`--${name}-2`]: tinycolor.mix(colorPalette(color, 7), bg, 0.25),\n [`--${name}-3`]: tinycolor.mix(color, bg, 0.3),\n [`--${name}-4`]: tinycolor.mix(color, bg, 0.45),\n [`--${name}-5`]: tinycolor.mix(color, bg, 0.65),\n [`--${name}-6`]: color,\n [`--${name}-7`]: tinycolor.mix(colorPalette(color, 5), bg, 0.9),\n });\n }\n\n return {\n ...vars,\n [`--${name}-color-deprecated-bg`]: `var(--${name}-1)`,\n [`--${name}-color-deprecated-border`]: `var(--${name}-3)`,\n [`--${name}-color-hover`]: `var(--${name}-5)`,\n [`--${name}-color`]: color,\n [`--${name}-color-outline`]: tinycolor(color).setAlpha(0.2).toRgbString(),\n [`--${name}-color-active`]: `var(--${name}-7)`,\n };\n};\n\nexport type ThemeColorOptions<T = 'light' | 'dark'> = {\n primary?: string;\n warning?: string;\n error?: string;\n success?: string;\n componentBackground?: string;\n tableHeaderBg?: string;\n type?: T;\n};\n\nconst keyword = ['primary', 'warning', 'error', 'success'];\n\nexport const setThemeColor = (options: ThemeColorOptions) => {\n keyword.forEach((name) => {\n const color = options[name as 'primary' | 'warning' | 'error' | 'success'];\n\n if (color) {\n const colors = getColorPalette(name, color, options.type, options.componentBackground);\n\n if (name === 'primary' || name === 'error') {\n Object.assign(colors, {\n [name === 'primary' ? '--menu-dark-item-active-bg' : '--menu-dark-item-active-danger-bg']:\n tinycolor.mix(colorPalette(color, 8), menuDarkBg || '#141414', 0.15).toRgbString(),\n });\n }\n for (const key in colors) {\n if (Object.prototype.hasOwnProperty.call(colors, key)) {\n const newColor = colors[key as keyof typeof colors];\n\n if (getComputedStyle(document.documentElement).getPropertyValue(key) !== newColor) {\n document.documentElement.style.setProperty(key, newColor);\n }\n }\n }\n }\n });\n if (options.tableHeaderBg) {\n document.documentElement.style.setProperty('--table-header-bg', options.tableHeaderBg);\n }\n};\n\nconst rootStatusColor = {\n ...getColorPalette('normal', 'rgba(0, 0, 0, 0.85)', 'light', '#fff'),\n ...getColorPalette('primary', '#1890ff', 'light', '#fff'),\n ...getColorPalette('success', '#52c41a', 'light', '#fff'),\n ...getColorPalette('warning', '#faad14', 'light', '#fff'),\n ...getColorPalette('error', '#ff4d4f', 'light', '#fff'),\n};\nlet rootStatusColorVariables = '';\n\nObject.entries(rootStatusColor).forEach((e) => {\n rootStatusColorVariables += `${e.join(': ')};\\n`;\n});\nconst rootStatusColorDark = {\n ...getColorPalette('normal', 'rgba(255, 255, 255, 0.85)', 'dark', '#141414'),\n ...getColorPalette('primary', '#177ddc', 'dark', '#141414'),\n ...getColorPalette('success', '#49aa19', 'dark', '#141414'),\n ...getColorPalette('warning', '#d89614', 'dark', '#141414'),\n ...getColorPalette('error', '#a61d24', 'dark', '#141414'),\n};\nlet rootStatusColorDarkVariables = '';\n\nObject.entries(rootStatusColorDark).forEach((e) => {\n rootStatusColorDarkVariables += `${e.join(': ')};\\n`;\n});\n\nexport const rootVariables = css`\n :root {\n --text-shadow-color: rgba(0, 0, 0, 0.1);\n --font-size-base: 14px;\n --border-color-base: #d9d9d9;\n --border-radius-base: 4px;\n --body-background: #f8f8f8;\n --component-background: #fff;\n --table-header-bg: rgba(0, 0, 0, 0.02);\n --text-color: rgba(0, 0, 0, 0.65);\n --text-color-secondary: rgba(0, 0, 0, 0.45);\n --heading-color: rgba(0, 0, 0, 0.85);\n --text-selection-bg: var(--primary-color-deprecated-bg);\n --box-shadow-small: 0 0 12px rgba(0, 0, 0, 0.1);\n --font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial,\n 'Noto Sans', sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol',\n 'Noto Color Emoji', 'Helvetica', 'Oxygen', 'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans';\n --transition-duration: 0.3;\n --transition-timing-function: cubic-bezier(0.94, -0.1, 0.1, 1.2);\n --antd-wave-shadow-color: var(--primary-color-outline);\n --disable-color: rgba(0, 0, 0, 0.25);\n --btn-disable-bg: var(--disable-color);\n --btn-disable-border: var(--disable-color);\n --menu-dark-item-active-bg: #0e3ab3;\n ${rootStatusColorVariables}\n }\n [data-theme='dark'] {\n --text-selection-bg: var(--primary-color-deprecated-bg);\n --text-color-secondary: rgba(255, 255, 255, 0.25);\n --text-shadow-color: rgba(255, 255, 255, 0.1);\n --header-shadow: rgba(255, 255, 255, 0.05);\n --body-background: #000;\n --component-background: #141414;\n --header-bg: rgba(20, 20, 20, 0.9);\n --text-color: #ffffffd9;\n --border-color-base: #303030;\n --heading-color: rgba(255, 255, 255, 0.85);\n --disabled-color: rgba(255, 255, 255, 0.3);\n ${rootStatusColorDarkVariables}\n }\n`;\n\nexport const globalStyles = css`\n html,\n body {\n width: 100vw;\n height: 100vh;\n padding: 0;\n overflow: hidden;\n margin: 0;\n color: var(--text-color);\n font-size: var(--font-size-base);\n font-family: var(--font-family);\n line-height: 1.8;\n background-color: var(--body-background);\n transition-duration: var(--transition-duration);\n transition-property: background-color, color;\n transition-timing-function: var(--transition-timing-function);\n -webkit-text-size-adjust: 100%;\n }\n main {\n display: block;\n }\n input,\n textarea {\n caret-color: plum;\n }\n\n :-webkit-autofill,\n :-webkit-autofill:hover,\n :-webkit-autofill:focus {\n font-weight: 400;\n border: none;\n border-radius: 5px;\n box-shadow: 0 0 0 1000px transparent inset;\n transition: background-color var(--transition-duration) var(--transition-timing-function);\n -webkit-text-fill-color: var(--text-color);\n caret-color: transparent;\n }\n\n ::-webkit-scrollbar {\n width: 5px;\n height: 5px;\n opacity: 0;\n }\n\n ::-webkit-scrollbar-track {\n background-color: transparent;\n }\n\n ::-webkit-scrollbar-thumb {\n background-color: transparent;\n border-radius: 5px;\n }\n\n :hover::-webkit-scrollbar-thumb {\n background-color: rgba(78, 78, 78, 0.15);\n }\n\n ::-webkit-scrollbar-thumb:hover {\n background-color: rgba(176, 139, 227, 0.5);\n }\n\n ::-webkit-scrollbar-thumb:active {\n background-color: rgba(247, 138, 224, 0.5);\n }\n\n ::-webkit-scrollbar-button {\n display: none;\n }\n\n .text-ellipsis,\n .text-ellipsis-2 {\n overflow: hidden;\n text-overflow: ellipsis;\n }\n\n .text-ellipsis {\n white-space: nowrap;\n }\n\n .text-ellipsis-2 {\n display: -webkit-box;\n -webkit-line-clamp: 2;\n /*! autoprefixer: off */\n -webkit-box-orient: vertical;\n }\n\n .flex {\n display: flex;\n }\n\n .f-row {\n flex-direction: row;\n }\n\n .f-a-c {\n align-items: center;\n }\n\n .mr5 {\n margin-right: 5px;\n }\n\n .pos-r-0 {\n position: absolute;\n right: 0;\n }\n\n .login-toolbox {\n height: 64px;\n\n button {\n margin-right: 16px;\n }\n }\n`;\nexport const rootStyle = css`\n #root {\n display: flex;\n flex-direction: column;\n width: 100%;\n height: 100%;\n -webkit-overflow-scrolling: touch;\n\n > main {\n display: block;\n flex: 1;\n width: 100%;\n overflow-y: auto;\n animation: ${routeInKeyframes} var(--transition-duration);\n }\n }\n`;\n"],"names":["css","routeInKeyframes","tinycolor","colorPalette","menuDarkBg","getColorPalette","name","color","type","bg","vars","i","Object","assign","mix","setAlpha","toRgbString","keyword","setThemeColor","options","forEach","colors","componentBackground","key","prototype","hasOwnProperty","call","newColor","getComputedStyle","document","documentElement","getPropertyValue","style","setProperty","tableHeaderBg","rootStatusColor","rootStatusColorVariables","entries","e","join","rootStatusColorDark","rootStatusColorDarkVariables","rootVariables","globalStyles","rootStyle"],"mappings":"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"}
|
|
1
|
+
{"version":3,"sources":["../../src/styles/vars.ts"],"sourcesContent":["import { css } from '@emotion/react';\nimport { routeInKeyframes } from './animation';\nimport tinycolor from 'tinycolor2';\nimport colorPalette from '../utils/color-palette';\n\nexport const menuDarkBg = '#1C222E';\nexport const getColorPalette = (\n name: string,\n color: string,\n type: 'light' | 'dark' = 'light',\n bg = '#fff'\n) => {\n const vars: Record<string, string> = {};\n\n if (type === 'light') {\n let i = 1;\n\n while (i <= 7) {\n vars[`--${name}-${i}`] = colorPalette(color, i);\n i++;\n }\n } else {\n Object.assign(vars, {\n [`--${name}-1`]: tinycolor.mix(colorPalette(color, 8), bg, 0.15),\n [`--${name}-2`]: tinycolor.mix(colorPalette(color, 7), bg, 0.25),\n [`--${name}-3`]: tinycolor.mix(color, bg, 0.3),\n [`--${name}-4`]: tinycolor.mix(color, bg, 0.45),\n [`--${name}-5`]: tinycolor.mix(color, bg, 0.65),\n [`--${name}-6`]: color,\n [`--${name}-7`]: tinycolor.mix(colorPalette(color, 5), bg, 0.9),\n });\n }\n\n return {\n ...vars,\n [`--${name}-color-deprecated-bg`]: `var(--${name}-1)`,\n [`--${name}-color-deprecated-border`]: `var(--${name}-3)`,\n [`--${name}-color-hover`]: `var(--${name}-5)`,\n [`--${name}-color`]: color,\n [`--${name}-color-outline`]: tinycolor(color).setAlpha(0.2).toRgbString(),\n [`--${name}-color-active`]: `var(--${name}-7)`,\n };\n};\n\nexport type ThemeColorOptions<T = 'light' | 'dark'> = {\n primary?: string;\n warning?: string;\n error?: string;\n success?: string;\n componentBackground?: string;\n tableHeaderBg?: string;\n type?: T;\n};\n\nconst keyword = ['primary', 'warning', 'error', 'success'];\n\nexport const setThemeColor = (options: ThemeColorOptions) => {\n keyword.forEach((name) => {\n const color = options[name as 'primary' | 'warning' | 'error' | 'success'];\n\n if (color) {\n const colors = getColorPalette(name, color, options.type, options.componentBackground);\n\n if (name === 'primary' || name === 'error') {\n Object.assign(colors, {\n [name === 'primary' ? '--menu-dark-item-active-bg' : '--menu-dark-item-active-danger-bg']:\n tinycolor.mix(colorPalette(color, 8), menuDarkBg || '#141414', 0.15).toRgbString(),\n });\n }\n for (const key in colors) {\n if (Object.prototype.hasOwnProperty.call(colors, key)) {\n const newColor = colors[key as keyof typeof colors];\n\n if (getComputedStyle(document.documentElement).getPropertyValue(key) !== newColor) {\n document.documentElement.style.setProperty(key, newColor);\n }\n }\n }\n }\n });\n if (options.tableHeaderBg) {\n document.documentElement.style.setProperty('--table-header-bg', options.tableHeaderBg);\n }\n};\n\nconst rootStatusColor = {\n ...getColorPalette('normal', 'rgba(0, 0, 0, 0.85)', 'light', '#fff'),\n ...getColorPalette('primary', '#1890ff', 'light', '#fff'),\n ...getColorPalette('success', '#52c41a', 'light', '#fff'),\n ...getColorPalette('warning', '#faad14', 'light', '#fff'),\n ...getColorPalette('error', '#ff4d4f', 'light', '#fff'),\n};\nlet rootStatusColorVariables = '';\n\nObject.entries(rootStatusColor).forEach((e) => {\n rootStatusColorVariables += `${e.join(': ')};\\n`;\n});\nconst rootStatusColorDark = {\n ...getColorPalette('normal', 'rgba(255, 255, 255, 0.85)', 'dark', '#141414'),\n ...getColorPalette('primary', '#177ddc', 'dark', '#141414'),\n ...getColorPalette('success', '#49aa19', 'dark', '#141414'),\n ...getColorPalette('warning', '#d89614', 'dark', '#141414'),\n ...getColorPalette('error', '#a61d24', 'dark', '#141414'),\n};\nlet rootStatusColorDarkVariables = '';\n\nObject.entries(rootStatusColorDark).forEach((e) => {\n rootStatusColorDarkVariables += `${e.join(': ')};\\n`;\n});\n\nexport const rootVariables = css`\n :root {\n --text-shadow-color: rgba(0, 0, 0, 0.1);\n --font-size-base: 14px;\n --border-color-base: #d9d9d9;\n --border-radius-base: 4px;\n --body-background: #f8f8f8;\n --component-background: #fff;\n --table-header-bg: rgba(0, 0, 0, 0.02);\n --text-color: rgba(0, 0, 0, 0.65);\n --text-color-secondary: rgba(0, 0, 0, 0.45);\n --heading-color: rgba(0, 0, 0, 0.85);\n --text-selection-bg: var(--primary-color-deprecated-bg);\n --box-shadow-small: 0 0 12px rgba(0, 0, 0, 0.1);\n --box-shadow-base: 0 3px 6px -4px rgba(0, 0, 0, 0.12), 0 6px 16px 0 rgba(0, 0, 0, 0.08),\n 0 9px 28px 8px rgba(0, 0, 0, 0.05);\n --font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial,\n 'Noto Sans', sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol',\n 'Noto Color Emoji', 'Helvetica', 'Oxygen', 'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans';\n --transition-duration: 0.3s;\n --transition-timing-function: cubic-bezier(0.94, -0.1, 0.1, 1.2);\n --antd-wave-shadow-color: var(--primary-color-outline);\n --disable-color: rgba(0, 0, 0, 0.25);\n --btn-disable-bg: var(--disable-color);\n --btn-disable-border: var(--disable-color);\n --menu-dark-item-active-bg: #0e3ab3;\n ${rootStatusColorVariables}\n }\n [data-theme='dark'] {\n --text-selection-bg: var(--primary-color-deprecated-bg);\n --text-color-secondary: rgba(255, 255, 255, 0.25);\n --text-shadow-color: rgba(255, 255, 255, 0.1);\n --header-shadow: rgba(255, 255, 255, 0.05);\n --body-background: #000;\n --component-background: #141414;\n --header-bg: rgba(20, 20, 20, 0.9);\n --text-color: #ffffffd9;\n --border-color-base: #303030;\n --heading-color: rgba(255, 255, 255, 0.85);\n --disabled-color: rgba(255, 255, 255, 0.3);\n ${rootStatusColorDarkVariables}\n }\n`;\n\nexport const globalStyles = css`\n html,\n body {\n width: 100vw;\n height: 100vh;\n padding: 0;\n overflow: hidden;\n margin: 0;\n color: var(--text-color);\n font-size: var(--font-size-base);\n font-family: var(--font-family);\n line-height: 1.8;\n background-color: var(--body-background);\n transition-duration: var(--transition-duration);\n transition-property: background-color, color;\n transition-timing-function: var(--transition-timing-function);\n -webkit-text-size-adjust: 100%;\n }\n main {\n display: block;\n }\n input,\n textarea {\n caret-color: plum;\n }\n\n :-webkit-autofill,\n :-webkit-autofill:hover,\n :-webkit-autofill:focus {\n font-weight: 400;\n border: none;\n border-radius: 5px;\n box-shadow: 0 0 0 1000px transparent inset;\n transition: background-color var(--transition-duration) var(--transition-timing-function);\n -webkit-text-fill-color: var(--text-color);\n caret-color: transparent;\n }\n\n ::-webkit-scrollbar {\n width: 5px;\n height: 5px;\n opacity: 0;\n }\n\n ::-webkit-scrollbar-track {\n background-color: transparent;\n }\n\n ::-webkit-scrollbar-thumb {\n background-color: transparent;\n border-radius: 5px;\n }\n\n :hover::-webkit-scrollbar-thumb {\n background-color: rgba(78, 78, 78, 0.15);\n }\n\n ::-webkit-scrollbar-thumb:hover {\n background-color: rgba(176, 139, 227, 0.5);\n }\n\n ::-webkit-scrollbar-thumb:active {\n background-color: rgba(247, 138, 224, 0.5);\n }\n\n ::-webkit-scrollbar-button {\n display: none;\n }\n\n .text-ellipsis,\n .text-ellipsis-2 {\n overflow: hidden;\n text-overflow: ellipsis;\n }\n\n .text-ellipsis {\n white-space: nowrap;\n }\n\n .text-ellipsis-2 {\n display: -webkit-box;\n -webkit-line-clamp: 2;\n /*! autoprefixer: off */\n -webkit-box-orient: vertical;\n }\n\n .flex {\n display: flex;\n }\n\n .f-row {\n flex-direction: row;\n }\n\n .f-a-c {\n align-items: center;\n }\n\n .mr5 {\n margin-right: 5px;\n }\n\n .pos-r-0 {\n position: absolute;\n right: 0;\n }\n\n .login-toolbox {\n height: 64px;\n\n button {\n margin-right: 16px;\n }\n }\n`;\nexport const rootStyle = css`\n #root {\n display: flex;\n flex-direction: column;\n width: 100%;\n height: 100%;\n -webkit-overflow-scrolling: touch;\n\n > main {\n display: block;\n flex: 1;\n width: 100%;\n overflow-y: auto;\n animation: ${routeInKeyframes} var(--transition-duration);\n }\n }\n`;\n"],"names":["css","routeInKeyframes","tinycolor","colorPalette","menuDarkBg","getColorPalette","name","color","type","bg","vars","i","Object","assign","mix","setAlpha","toRgbString","keyword","setThemeColor","options","forEach","colors","componentBackground","key","prototype","hasOwnProperty","call","newColor","getComputedStyle","document","documentElement","getPropertyValue","style","setProperty","tableHeaderBg","rootStatusColor","rootStatusColorVariables","entries","e","join","rootStatusColorDark","rootStatusColorDarkVariables","rootVariables","globalStyles","rootStyle"],"mappings":"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"}
|