vault backup: 2025-09-09 18:47:34
This commit is contained in:
CrazyJasonwell committed
1 parent
bdf9404fe6
commit
d978eae3c5
64 files changed
+19950
-5498
No files matched your search
+143
-274
@@ -3,59 +3,45 @@
|
||||
var obsidian = require('obsidian');
|
||||
var crypto = require('crypto');
|
||||
|
||||
/******************************************************************************
|
||||
Copyright (c) Microsoft Corporation.
|
||||
|
||||
Permission to use, copy, modify, and/or distribute this software for any
|
||||
purpose with or without fee is hereby granted.
|
||||
|
||||
THE SOFTWARE IS PROVIDED "AS IS" AND THE AUTHOR DISCLAIMS ALL WARRANTIES WITH
|
||||
REGARD TO THIS SOFTWARE INCLUDING ALL IMPLIED WARRANTIES OF MERCHANTABILITY
|
||||
AND FITNESS. IN NO EVENT SHALL THE AUTHOR BE LIABLE FOR ANY SPECIAL, DIRECT,
|
||||
INDIRECT, OR CONSEQUENTIAL DAMAGES OR ANY DAMAGES WHATSOEVER RESULTING FROM
|
||||
LOSS OF USE, DATA OR PROFITS, WHETHER IN AN ACTION OF CONTRACT, NEGLIGENCE OR
|
||||
OTHER TORTIOUS ACTION, ARISING OUT OF OR IN CONNECTION WITH THE USE OR
|
||||
PERFORMANCE OF THIS SOFTWARE.
|
||||
***************************************************************************** */
|
||||
|
||||
function __awaiter(thisArg, _arguments, P, generator) {
|
||||
function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
|
||||
return new (P || (P = Promise))(function (resolve, reject) {
|
||||
function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
|
||||
function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
|
||||
function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
|
||||
step((generator = generator.apply(thisArg, _arguments || [])).next());
|
||||
});
|
||||
}
|
||||
|
||||
typeof SuppressedError === "function" ? SuppressedError : function (error, suppressed, message) {
|
||||
var e = new Error(message);
|
||||
return e.name = "SuppressedError", e.error = error, e.suppressed = suppressed, e;
|
||||
/******************************************************************************
|
||||
Copyright (c) Microsoft Corporation.
|
||||
|
||||
Permission to use, copy, modify, and/or distribute this software for any
|
||||
purpose with or without fee is hereby granted.
|
||||
|
||||
THE SOFTWARE IS PROVIDED "AS IS" AND THE AUTHOR DISCLAIMS ALL WARRANTIES WITH
|
||||
REGARD TO THIS SOFTWARE INCLUDING ALL IMPLIED WARRANTIES OF MERCHANTABILITY
|
||||
AND FITNESS. IN NO EVENT SHALL THE AUTHOR BE LIABLE FOR ANY SPECIAL, DIRECT,
|
||||
INDIRECT, OR CONSEQUENTIAL DAMAGES OR ANY DAMAGES WHATSOEVER RESULTING FROM
|
||||
LOSS OF USE, DATA OR PROFITS, WHETHER IN AN ACTION OF CONTRACT, NEGLIGENCE OR
|
||||
OTHER TORTIOUS ACTION, ARISING OUT OF OR IN CONNECTION WITH THE USE OR
|
||||
PERFORMANCE OF THIS SOFTWARE.
|
||||
***************************************************************************** */
|
||||
|
||||
function __awaiter(thisArg, _arguments, P, generator) {
|
||||
function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
|
||||
return new (P || (P = Promise))(function (resolve, reject) {
|
||||
function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
|
||||
function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
|
||||
function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
|
||||
step((generator = generator.apply(thisArg, _arguments || [])).next());
|
||||
});
|
||||
}
|
||||
|
||||
typeof SuppressedError === "function" ? SuppressedError : function (error, suppressed, message) {
|
||||
var e = new Error(message);
|
||||
return e.name = "SuppressedError", e.error = error, e.suppressed = suppressed, e;
|
||||
};
|
||||
|
||||
// العربية
|
||||
var ar = {};
|
||||
|
||||
// čeština
|
||||
var cz = {};
|
||||
|
||||
// Dansk
|
||||
var da = {};
|
||||
|
||||
// Deutsch
|
||||
var de = {};
|
||||
|
||||
// English
|
||||
var en = {
|
||||
// settings
|
||||
IMAGE_TOOLKIT_SETTINGS_TITLE: 'Image Toolkit Settings',
|
||||
// >>>Common Settings:
|
||||
COMMON_SETTINGS: 'Common Settings:',
|
||||
VIEW_MODE_NAME: 'Choose a mode to view images',
|
||||
VIEW_MODE_NORMAL: '🖼 Normal',
|
||||
VIEW_MODE_PIN: '📌 Pin',
|
||||
RESET: 'reset to default',
|
||||
// >>>View Trigger Settings:
|
||||
VIEW_TRIGGER_SETTINGS: 'View Trigger Settings:',
|
||||
VIEW_TRIGGER_SETTINGS: 'View trigger',
|
||||
VIEW_IMAGE_GLOBAL_NAME: 'Click and view an image globally',
|
||||
VIEW_IMAGE_GLOBAL_DESC: 'You can zoom, rotate, drag, and invert it on the popup layer when clicking an image.',
|
||||
VIEW_IMAGE_IN_EDITOR_NAME: 'Click and view an image in the Editor Area',
|
||||
@@ -68,7 +54,7 @@ var en = {
|
||||
VIEW_IMAGE_OTHER_NAME: 'Click and view in the other areas except the above',
|
||||
VIEW_IMAGE_OTHER_DESC: 'Except for the above mentioned, it also supports other areas, like some modal user interface components.',
|
||||
// >>> PIN_MODE_SETTINGS
|
||||
PIN_MODE_SETTINGS: "Pin Mode Settings:",
|
||||
PIN_MODE_SETTINGS: "Pin mode",
|
||||
PIN_MODE_NAME: "📌 Pin an image",
|
||||
PIN_MODE_DESC: "You can pin an image onto the top of the screen. And have more options by right click. (press Esc to close the image where your mouse cursor is hovering)",
|
||||
PIN_MAXIMUM_NAME: "The maximum images you can pin",
|
||||
@@ -76,7 +62,7 @@ var en = {
|
||||
PIN_COVER_DESC: "After those pinned images reach maximum, you can cover the earliest pinned image when you click an image once again.",
|
||||
PIN_MAXIMUM_NOTICE: "Exceeded maximum images you can pin (non cover mode)",
|
||||
// >>>View Detail Settings:
|
||||
VIEW_DETAILS_SETTINGS: 'View Detail Settings:',
|
||||
VIEW_DETAILS_SETTINGS: 'View details',
|
||||
IMAGE_MOVE_SPEED_NAME: 'Set the moving speed of the image',
|
||||
IMAGE_MOVE_SPEED_DESC: 'When you move an image on the popup layer by keyboard (up, down, left, right), the moving speed of the image can be set here.',
|
||||
IMAGE_TIP_TOGGLE_NAME: "Display the image's zoom number",
|
||||
@@ -86,14 +72,14 @@ var en = {
|
||||
FIT: 'Fit',
|
||||
FILL: 'Fill',
|
||||
STRETCH: 'Stretch',
|
||||
IMG_VIEW_BACKGROUND_COLOR_NAME: "Set the background color of the previewed image (Only support the image with transparent background)",
|
||||
IMG_VIEW_BACKGROUND_COLOR_NAME: "Background color of the previewed image (Only support the image with transparent background)",
|
||||
// >>>Image Border Settings:
|
||||
IMAGE_BORDER_SETTINGS: 'Image Border Settings:',
|
||||
IMAGE_BORDER_SETTINGS: 'Image border',
|
||||
IMAGE_BORDER_TOGGLE_NAME: "Display the image's border",
|
||||
IMAGE_BORDER_TOGGLE_DESC: "The clicked image's border can be displayed after you exit previewing and close the popup layer.",
|
||||
IMAGE_BORDER_WIDTH_NAME: "Set the image's border width",
|
||||
IMAGE_BORDER_STYLE_NAME: "Set the image's border style",
|
||||
IMAGE_BORDER_COLOR_NAME: "Set the image's border color",
|
||||
IMAGE_BORDER_WIDTH_NAME: "Image border width",
|
||||
IMAGE_BORDER_STYLE_NAME: "Image border style",
|
||||
IMAGE_BORDER_COLOR_NAME: "Image border color",
|
||||
// IMG_BORDER_WIDTH options:
|
||||
THIN: 'thin',
|
||||
MEDIUM: 'medium',
|
||||
@@ -129,23 +115,23 @@ var en = {
|
||||
GOLD: 'gold',
|
||||
YELLOW: 'yellow',
|
||||
// >>>Gallery Navbar Settings:
|
||||
GALLERY_NAVBAR_SETTINGS: 'Gallery Navbar Settings (Experimental):',
|
||||
GALLERY_NAVBAR_SETTINGS: 'Gallery navbar (experimental)',
|
||||
GALLERY_NAVBAR_TOGGLE_NAME: "Display gallery navbar",
|
||||
GALLERY_NAVBAR_TOGGLE_DESC: "All of the images in the current pane view can be displayed at the bottom of the popup layer.",
|
||||
GALLERY_NAVBAR_DEFAULT_COLOR_NAME: "Set the background color of the gallery navbar (default state)",
|
||||
GALLERY_NAVBAR_HOVER_COLOR_NAME: "Set the background color of the gallery navbar (hovering state)",
|
||||
GALLERY_NAVBAR_DEFAULT_COLOR_NAME: "Background color of the gallery navbar (default state)",
|
||||
GALLERY_NAVBAR_HOVER_COLOR_NAME: "Background color of the gallery navbar (hovering state)",
|
||||
GALLERY_IMG_BORDER_TOGGLE_NAME: "Display the selected image on the gallery navbar",
|
||||
GALLERY_IMG_BORDER_TOGGLE_DESC: "When you select an image, the image's border will be displayed, so you can know which image is currently active.",
|
||||
GALLERY_IMG_BORDER_ACTIVE_COLOR_NAME: 'Set the border color of the selected image',
|
||||
GALLERY_IMG_BORDER_ACTIVE_COLOR_NAME: 'Border color of the selected image',
|
||||
// >>>HOTKEYS_SETTINGS:
|
||||
HOTKEY_SETTINGS: "Hotkey Settings:",
|
||||
HOTKEY_SETTINGS: "Hotkeys",
|
||||
HOTKEY_SETTINGS_DESC: "📢 You cannot set the same hotkey for 'Move the image' and 'Switch the image' at the same time. (NOT SUPPORT in Pin Mode)",
|
||||
MOVE_THE_IMAGE_NAME: "Set the hotkey for moving the image",
|
||||
MOVE_THE_IMAGE_NAME: "Hotkey for moving the image",
|
||||
MOVE_THE_IMAGE_DESC: "You can move the image on the popup layer by hotkey.",
|
||||
SWITCH_THE_IMAGE_NAME: "Set the hotkey for switching the image",
|
||||
SWITCH_THE_IMAGE_NAME: "Hotkey for switching the image",
|
||||
SWITCH_THE_IMAGE_DESC: "You can switch to the previous/next image on the gallery navbar by hotkey. (NOTE: You need to turn on 'Display gallery navbar' first, if you wanna use this hotkey.)",
|
||||
DOUBLE_CLICK_TOOLBAR_NAME: "Double click",
|
||||
VIEW_TRIGGER_HOTKEY_NAME: "Set the hotkey for triggering viewing an image",
|
||||
VIEW_TRIGGER_HOTKEY_NAME: "Hotkey for triggering viewing an image",
|
||||
VIEW_TRIGGER_HOTKEY_DESC: "When you set 'None', you can directly click and preview an image without holding any modifier keys; otherwise, you must hold the configured modifier keys to click and preview an image.",
|
||||
// MODIFIER_HOTKEYS
|
||||
NONE: "None",
|
||||
@@ -174,66 +160,13 @@ var en = {
|
||||
COPY_IMAGE_ERROR: 'Fail to copy the image!'
|
||||
};
|
||||
|
||||
// British English
|
||||
var enGB = {};
|
||||
|
||||
// Español
|
||||
var es = {};
|
||||
|
||||
// français
|
||||
var fr = {};
|
||||
|
||||
// हिन्दी
|
||||
var hi = {};
|
||||
|
||||
// Bahasa Indonesia
|
||||
var id = {};
|
||||
|
||||
// Italiano
|
||||
var it = {};
|
||||
|
||||
// 日本語
|
||||
var ja = {};
|
||||
|
||||
// 한국어
|
||||
var ko = {};
|
||||
|
||||
// Nederlands
|
||||
var nl = {};
|
||||
|
||||
// Norsk
|
||||
var no = {};
|
||||
|
||||
// język polski
|
||||
var pl = {};
|
||||
|
||||
// Português
|
||||
var pt = {};
|
||||
|
||||
// Português do Brasil
|
||||
// Brazilian Portuguese
|
||||
var ptBR = {};
|
||||
|
||||
// Română
|
||||
var ro = {};
|
||||
|
||||
// русский
|
||||
var ru = {};
|
||||
|
||||
// Türkçe
|
||||
var tr = {};
|
||||
|
||||
// 简体中文
|
||||
var zhCN = {
|
||||
// settings
|
||||
IMAGE_TOOLKIT_SETTINGS_TITLE: "Image Toolkit 设置",
|
||||
// >>>Common Settings:
|
||||
COMMON_SETTINGS: '通用设置：',
|
||||
VIEW_MODE_NAME: '选择查看模式',
|
||||
VIEW_MODE_NORMAL: '🖼 普通',
|
||||
VIEW_MODE_PIN: '📌 贴图',
|
||||
// >>> 预览触发配置：
|
||||
VIEW_TRIGGER_SETTINGS: '预览触发配置：',
|
||||
VIEW_TRIGGER_SETTINGS: '预览触发配置',
|
||||
VIEW_IMAGE_GLOBAL_NAME: '支持全局预览图片',
|
||||
VIEW_IMAGE_GLOBAL_DESC: '开启后，在任何地方点击图片都可以弹出预览界面，可对图片进行缩放、旋转、拖动、和反色等。',
|
||||
VIEW_IMAGE_IN_EDITOR_NAME: '支持在编辑区域预览图片',
|
||||
@@ -246,7 +179,7 @@ var zhCN = {
|
||||
VIEW_IMAGE_OTHER_NAME: '支持除上述其他地方来预览图片',
|
||||
VIEW_IMAGE_OTHER_DESC: '除上述支持范围外，还支持一些其他区域，如Modal用户界面组件。',
|
||||
// >>> PIN_MODE_SETTINGS
|
||||
PIN_MODE_SETTINGS: "贴图模式设置：",
|
||||
PIN_MODE_SETTINGS: "贴图模式设置",
|
||||
PIN_MODE_NAME: "📌 将所点击的图片贴到屏幕上",
|
||||
PIN_MODE_DESC: "你可以将当前所点击的图片贴到屏幕上，并且可以通过右击图片选择更多操作（按 Esc 关闭已贴图片的展示）",
|
||||
PIN_MAXIMUM_NAME: "最大贴图数量",
|
||||
@@ -254,7 +187,7 @@ var zhCN = {
|
||||
PIN_COVER_DESC: "当贴图数量达到最大值后，此时再次点击图片，该图片会覆盖最早弹出的那个贴图。",
|
||||
PIN_MAXIMUM_NOTICE: "超过最大Pin图设置（非覆盖模式）",
|
||||
// >>>查看细节设置：
|
||||
VIEW_DETAILS_SETTINGS: '查看细节设置：',
|
||||
VIEW_DETAILS_SETTINGS: '查看细节设置',
|
||||
IMAGE_MOVE_SPEED_NAME: '图片移动速度设置',
|
||||
IMAGE_MOVE_SPEED_DESC: '当使用键盘（上、下、左、右）移动图片时，可对图片移动速度进行设置。',
|
||||
IMAGE_TIP_TOGGLE_NAME: "展示缩放比例提示",
|
||||
@@ -266,7 +199,7 @@ var zhCN = {
|
||||
STRETCH: '拉伸',
|
||||
IMG_VIEW_BACKGROUND_COLOR_NAME: "设置预览图片的背景色（仅对透明背景的图片生效）",
|
||||
// >>>图片边框设置：
|
||||
IMAGE_BORDER_SETTINGS: '图片边框设置：',
|
||||
IMAGE_BORDER_SETTINGS: '图片边框设置',
|
||||
IMAGE_BORDER_TOGGLE_NAME: "展示被点击图片的边框",
|
||||
IMAGE_BORDER_TOGGLE_DESC: "当离开图片预览和关闭弹出层后，突出展示被点击图片的边框。",
|
||||
IMAGE_BORDER_WIDTH_NAME: "设置图片边框宽度",
|
||||
@@ -307,7 +240,7 @@ var zhCN = {
|
||||
GOLD: '金色',
|
||||
YELLOW: '黄色',
|
||||
// >>>Gallery Navbar Settings:
|
||||
GALLERY_NAVBAR_SETTINGS: '图片导航设置 (体验版):',
|
||||
GALLERY_NAVBAR_SETTINGS: '图片导航设置 (体验版)',
|
||||
GALLERY_NAVBAR_TOGGLE_NAME: "展示图片导航",
|
||||
GALLERY_NAVBAR_TOGGLE_DESC: "当前文档的所有图片会展示在弹出层的底部，可随意切换展示不同图片。",
|
||||
GALLERY_NAVBAR_DEFAULT_COLOR_NAME: "设置图片导航底栏背景色（默认展示）",
|
||||
@@ -316,7 +249,7 @@ var zhCN = {
|
||||
GALLERY_IMG_BORDER_TOGGLE_DESC: "当你选中正查看某一图片，对应图片导航底栏上将突出显示该缩略图片的边框。",
|
||||
GALLERY_IMG_BORDER_ACTIVE_COLOR_NAME: '设置被选中图片的边框色',
|
||||
// >>>HOTKEYS_SETTINGS:
|
||||
HOTKEY_SETTINGS: "快捷键设置:",
|
||||
HOTKEY_SETTINGS: "快捷键设置",
|
||||
HOTKEY_SETTINGS_DESC: "📢 你无法为'移动图片'和'切换图片'设置相同的快捷键。（不支持贴图模式）",
|
||||
MOVE_THE_IMAGE_NAME: "为移动图片设置快捷键",
|
||||
MOVE_THE_IMAGE_DESC: "你可以利用快捷键来移动弹出层上的图片。",
|
||||
@@ -347,8 +280,6 @@ var zhCN = {
|
||||
|
||||
// 繁體中文
|
||||
var zhTW = {
|
||||
// settings
|
||||
IMAGE_TOOLKIT_SETTINGS_TITLE: "image toolkit 設定",
|
||||
// toolbar icon title
|
||||
ZOOM_IN: "放大",
|
||||
ZOOM_OUT: "縮小",
|
||||
@@ -364,27 +295,7 @@ var zhTW = {
|
||||
};
|
||||
|
||||
const localeMap = {
|
||||
ar,
|
||||
cs: cz,
|
||||
da,
|
||||
de,
|
||||
en,
|
||||
"en-gb": enGB,
|
||||
es,
|
||||
fr,
|
||||
hi,
|
||||
id,
|
||||
it,
|
||||
ja,
|
||||
ko,
|
||||
nl,
|
||||
nn: no,
|
||||
pl,
|
||||
pt,
|
||||
"pt-br": ptBR,
|
||||
ro,
|
||||
ru,
|
||||
tr,
|
||||
"zh-cn": zhCN,
|
||||
"zh-tw": zhTW,
|
||||
};
|
||||
@@ -591,24 +502,6 @@ const SWITCH_THE_IMAGE = {
|
||||
};
|
||||
const IMG_DEFAULT_BACKGROUND_COLOR = '#00000000';
|
||||
|
||||
function getDefaultExportFromCjs (x) {
|
||||
return x && x.__esModule && Object.prototype.hasOwnProperty.call(x, 'default') ? x['default'] : x;
|
||||
}
|
||||
|
||||
function createCommonjsModule(fn) {
|
||||
var module = { exports: {} };
|
||||
return fn(module, module.exports), module.exports;
|
||||
}
|
||||
|
||||
/*! Pickr 1.9.1 MIT | https://github.com/Simonwep/pickr */
|
||||
|
||||
var pickr_min = createCommonjsModule(function (module, exports) {
|
||||
!function(t,e){module.exports=e();}(self,(()=>(()=>{var t={d:(e,o)=>{for(var n in o)t.o(o,n)&&!t.o(e,n)&&Object.defineProperty(e,n,{enumerable:!0,get:o[n]});},o:(t,e)=>Object.prototype.hasOwnProperty.call(t,e),r:t=>{"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(t,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(t,"__esModule",{value:!0});}},e={};t.d(e,{default:()=>E});var o={};function n(t,e,o,n,i={}){e instanceof HTMLCollection||e instanceof NodeList?e=Array.from(e):Array.isArray(e)||(e=[e]),Array.isArray(o)||(o=[o]);for(const s of e)for(const e of o)s[t](e,n,{capture:!1,...i});return Array.prototype.slice.call(arguments,1)}t.r(o),t.d(o,{adjustableInputNumbers:()=>p,createElementFromString:()=>r,createFromTemplate:()=>a,eventPath:()=>l,off:()=>s,on:()=>i,resolveElement:()=>c});const i=n.bind(null,"addEventListener"),s=n.bind(null,"removeEventListener");function r(t){const e=document.createElement("div");return e.innerHTML=t.trim(),e.firstElementChild}function a(t){const e=(t,e)=>{const o=t.getAttribute(e);return t.removeAttribute(e),o},o=(t,n={})=>{const i=e(t,":obj"),s=e(t,":ref"),r=i?n[i]={}:n;s&&(n[s]=t);for(const n of Array.from(t.children)){const t=e(n,":arr"),i=o(n,t?{}:r);t&&(r[t]||(r[t]=[])).push(Object.keys(i).length?i:n);}return n};return o(r(t))}function l(t){let e=t.path||t.composedPath&&t.composedPath();if(e)return e;let o=t.target.parentElement;for(e=[t.target,o];o=o.parentElement;)e.push(o);return e.push(document,window),e}function c(t){return t instanceof Element?t:"string"==typeof t?t.split(/>>/g).reduce(((t,e,o,n)=>(t=t.querySelector(e),o<n.length-1?t.shadowRoot:t)),document):null}function p(t,e=(t=>t)){function o(o){const n=[.001,.01,.1][Number(o.shiftKey||2*o.ctrlKey)]*(o.deltaY<0?1:-1);let i=0,s=t.selectionStart;t.value=t.value.replace(/[\d.]+/g,((t,o)=>o<=s&&o+t.length>=s?(s=o,e(Number(t),n,i)):(i++,t))),t.focus(),t.setSelectionRange(s,s),o.preventDefault(),t.dispatchEvent(new Event("input"));}i(t,"focus",(()=>i(window,"wheel",o,{passive:!1}))),i(t,"blur",(()=>s(window,"wheel",o)));}const{min:u,max:h,floor:d,round:m}=Math;function f(t,e,o){e/=100,o/=100;const n=d(t=t/360*6),i=t-n,s=o*(1-e),r=o*(1-i*e),a=o*(1-(1-i)*e),l=n%6;return [255*[o,r,s,s,a,o][l],255*[a,o,o,r,s,s][l],255*[s,s,a,o,o,r][l]]}function v(t,e,o){const n=(2-(e/=100))*(o/=100)/2;return 0!==n&&(e=1===n?0:n<.5?e*o/(2*n):e*o/(2-2*n)),[t,100*e,100*n]}function b(t,e,o){const n=u(t/=255,e/=255,o/=255),i=h(t,e,o),s=i-n;let r,a;if(0===s)r=a=0;else {a=s/i;const n=((i-t)/6+s/2)/s,l=((i-e)/6+s/2)/s,c=((i-o)/6+s/2)/s;t===i?r=c-l:e===i?r=1/3+n-c:o===i&&(r=2/3+l-n),r<0?r+=1:r>1&&(r-=1);}return [360*r,100*a,100*i]}function y(t,e,o,n){e/=100,o/=100;return [...b(255*(1-u(1,(t/=100)*(1-(n/=100))+n)),255*(1-u(1,e*(1-n)+n)),255*(1-u(1,o*(1-n)+n)))]}function g(t,e,o){e/=100;const n=2*(e*=(o/=100)<.5?o:1-o)/(o+e)*100,i=100*(o+e);return [t,isNaN(n)?0:n,i]}function _(t){return b(...t.match(/.{2}/g).map((t=>parseInt(t,16))))}function w(t){t=t.match(/^[a-zA-Z]+$/)?function(t){if("black"===t.toLowerCase())return "#000";const e=document.createElement("canvas").getContext("2d");return e.fillStyle=t,"#000"===e.fillStyle?null:e.fillStyle}(t):t;const e={cmyk:/^cmyk\D+([\d.]+)\D+([\d.]+)\D+([\d.]+)\D+([\d.]+)/i,rgba:/^rgba?\D+([\d.]+)(%?)\D+([\d.]+)(%?)\D+([\d.]+)(%?)\D*?(([\d.]+)(%?)|$)/i,hsla:/^hsla?\D+([\d.]+)\D+([\d.]+)\D+([\d.]+)\D*?(([\d.]+)(%?)|$)/i,hsva:/^hsva?\D+([\d.]+)\D+([\d.]+)\D+([\d.]+)\D*?(([\d.]+)(%?)|$)/i,hexa:/^#?(([\dA-Fa-f]{3,4})|([\dA-Fa-f]{6})|([\dA-Fa-f]{8}))$/i},o=t=>t.map((t=>/^(|\d+)\.\d+|\d+$/.test(t)?Number(t):void 0));let n;t:for(const i in e)if(n=e[i].exec(t))switch(i){case"cmyk":{const[,t,e,s,r]=o(n);if(t>100||e>100||s>100||r>100)break t;return {values:y(t,e,s,r),type:i}}case"rgba":{let[,t,,e,,s,,,r]=o(n);if(t="%"===n[2]?t/100*255:t,e="%"===n[4]?e/100*255:e,s="%"===n[6]?s/100*255:s,r="%"===n[9]?r/100:r,t>255||e>255||s>255||r<0||r>1)break t;return {values:[...b(t,e,s),r],a:r,type:i}}case"hexa":{let[,t]=n;4!==t.length&&3!==t.length||(t=t.split("").map((t=>t+t)).join(""));const e=t.substring(0,6);let o=t.substring(6);return o=o?parseInt(o,16)/255:void 0,{values:[..._(e),o],a:o,type:i}}case"hsla":{let[,t,e,s,,r]=o(n);if(r="%"===n[6]?r/100:r,t>360||e>100||s>100||r<0||r>1)break t;return {values:[...g(t,e,s),r],a:r,type:i}}case"hsva":{let[,t,e,s,,r]=o(n);if(r="%"===n[6]?r/100:r,t>360||e>100||s>100||r<0||r>1)break t;return {values:[t,e,s,r],a:r,type:i}}}return {values:null,type:null}}function A(t=0,e=0,o=0,n=1){const i=(t,e)=>(o=-1)=>e(~o?t.map((t=>Number(t.toFixed(o)))):t),s={h:t,s:e,v:o,a:n,toHSVA(){const t=[s.h,s.s,s.v,s.a];return t.toString=i(t,(t=>`hsva(${t[0]}, ${t[1]}%, ${t[2]}%, ${s.a})`)),t},toHSLA(){const t=[...v(s.h,s.s,s.v),s.a];return t.toString=i(t,(t=>`hsla(${t[0]}, ${t[1]}%, ${t[2]}%, ${s.a})`)),t},toRGBA(){const t=[...f(s.h,s.s,s.v),s.a];return t.toString=i(t,(t=>`rgba(${t[0]}, ${t[1]}, ${t[2]}, ${s.a})`)),t},toCMYK(){const t=function(t,e,o){const n=f(t,e,o),i=n[0]/255,s=n[1]/25Line truncated
|
||||
|
||||
});
|
||||
|
||||
var Pickr = /*@__PURE__*/getDefaultExportFromCjs(pickr_min);
|
||||
|
||||
const DEFAULT_SETTINGS = {
|
||||
viewMode: ViewMode.Normal,
|
||||
viewImageInEditor: true,
|
||||
@@ -645,7 +538,6 @@ class ImageToolkitSettingTab extends obsidian.PluginSettingTab {
|
||||
display() {
|
||||
let { containerEl } = this;
|
||||
containerEl.empty();
|
||||
containerEl.createEl('h2', { text: t("IMAGE_TOOLKIT_SETTINGS_TITLE") });
|
||||
// Common Settings:
|
||||
this.displayCommonSettings(containerEl);
|
||||
// View Trigger Settings:
|
||||
@@ -653,7 +545,7 @@ class ImageToolkitSettingTab extends obsidian.PluginSettingTab {
|
||||
// Pin Mode Settings:
|
||||
this.displayPinModeSettings(containerEl);
|
||||
//region >>> VIEW_DETAILS_SETTINGS
|
||||
containerEl.createEl('h3', { text: t("VIEW_DETAILS_SETTINGS") });
|
||||
new obsidian.Setting(containerEl).setName(t("VIEW_DETAILS_SETTINGS")).setHeading();
|
||||
let imgMoveSpeedScaleText;
|
||||
new obsidian.Setting(containerEl)
|
||||
.setName(t("IMAGE_MOVE_SPEED_NAME"))
|
||||
@@ -694,10 +586,28 @@ class ImageToolkitSettingTab extends obsidian.PluginSettingTab {
|
||||
yield this.plugin.saveSettings();
|
||||
}));
|
||||
}));
|
||||
this.createPickrSetting(containerEl, 'IMG_VIEW_BACKGROUND_COLOR_NAME', IMG_DEFAULT_BACKGROUND_COLOR);
|
||||
new obsidian.Setting(containerEl)
|
||||
.setName(t("IMG_VIEW_BACKGROUND_COLOR_NAME"))
|
||||
.addColorPicker(picker => {
|
||||
picker
|
||||
.setValue(this.plugin.settings.imgViewBackgroundColor || DEFAULT_SETTINGS.imgViewBackgroundColor)
|
||||
.onChange((value) => __awaiter(this, void 0, void 0, function* () {
|
||||
this.plugin.settings.imgViewBackgroundColor = value;
|
||||
yield this.plugin.saveSettings();
|
||||
}));
|
||||
})
|
||||
.addExtraButton(button => {
|
||||
button.setIcon('rotate-ccw')
|
||||
.setTooltip(t('RESET'))
|
||||
.onClick(() => __awaiter(this, void 0, void 0, function* () {
|
||||
this.plugin.settings.imgViewBackgroundColor = DEFAULT_SETTINGS.imgViewBackgroundColor;
|
||||
yield this.plugin.saveSettings();
|
||||
this.display();
|
||||
}));
|
||||
});
|
||||
//endregion
|
||||
//region >>> IMAGE_BORDER_SETTINGS
|
||||
containerEl.createEl('h3', { text: t("IMAGE_BORDER_SETTINGS") });
|
||||
new obsidian.Setting(containerEl).setName(t("IMAGE_BORDER_SETTINGS")).setHeading();
|
||||
new obsidian.Setting(containerEl)
|
||||
.setName(t("IMAGE_BORDER_TOGGLE_NAME"))
|
||||
.setDesc(t("IMAGE_BORDER_TOGGLE_DESC"))
|
||||
@@ -748,8 +658,9 @@ class ImageToolkitSettingTab extends obsidian.PluginSettingTab {
|
||||
}));
|
||||
//endregion
|
||||
//region >>> GALLERY_NAVBAR_SETTINGS
|
||||
let galleryNavbarDefaultColorSetting, galleryNavbarHoverColorSetting, galleryImgBorderToggleSetting, galleryImgBorderActiveColorSetting;
|
||||
containerEl.createEl('h3', { text: t("GALLERY_NAVBAR_SETTINGS") });
|
||||
//let galleryNavbarDefaultColorSetting: Setting, galleryNavbarHoverColorSetting: Setting,
|
||||
// galleryImgBorderToggleSetting: Setting, galleryImgBorderActiveColorSetting: Setting;
|
||||
new obsidian.Setting(containerEl).setName(t("GALLERY_NAVBAR_SETTINGS")).setHeading();
|
||||
new obsidian.Setting(containerEl)
|
||||
.setName(t("GALLERY_NAVBAR_TOGGLE_NAME"))
|
||||
.setDesc(t("GALLERY_NAVBAR_TOGGLE_DESC"))
|
||||
@@ -760,9 +671,45 @@ class ImageToolkitSettingTab extends obsidian.PluginSettingTab {
|
||||
this.switchSettingsDisabled(!value, galleryNavbarDefaultColorSetting, galleryNavbarHoverColorSetting, galleryImgBorderToggleSetting, galleryImgBorderActiveColorSetting);
|
||||
yield this.plugin.saveSettings();
|
||||
})));
|
||||
galleryNavbarDefaultColorSetting = this.createPickrSetting(containerEl, 'GALLERY_NAVBAR_DEFAULT_COLOR_NAME', GALLERY_NAVBAR_DEFAULT_COLOR);
|
||||
galleryNavbarHoverColorSetting = this.createPickrSetting(containerEl, 'GALLERY_NAVBAR_HOVER_COLOR_NAME', GALLERY_NAVBAR_HOVER_COLOR);
|
||||
galleryImgBorderToggleSetting = new obsidian.Setting(containerEl)
|
||||
const galleryNavbarDefaultColorSetting = new obsidian.Setting(containerEl)
|
||||
.setName(t("GALLERY_NAVBAR_DEFAULT_COLOR_NAME"))
|
||||
.addColorPicker(picker => {
|
||||
picker
|
||||
.setValue(this.plugin.settings.galleryNavbarDefaultColor || DEFAULT_SETTINGS.galleryNavbarDefaultColor)
|
||||
.onChange((value) => __awaiter(this, void 0, void 0, function* () {
|
||||
this.plugin.settings.galleryNavbarDefaultColor = value;
|
||||
yield this.plugin.saveSettings();
|
||||
}));
|
||||
})
|
||||
.addExtraButton(button => {
|
||||
button.setIcon('rotate-ccw')
|
||||
.setTooltip(t('RESET'))
|
||||
.onClick(() => __awaiter(this, void 0, void 0, function* () {
|
||||
this.plugin.settings.galleryNavbarDefaultColor = DEFAULT_SETTINGS.galleryNavbarDefaultColor;
|
||||
yield this.plugin.saveSettings();
|
||||
this.display();
|
||||
}));
|
||||
});
|
||||
const galleryNavbarHoverColorSetting = new obsidian.Setting(containerEl)
|
||||
.setName(t("GALLERY_NAVBAR_HOVER_COLOR_NAME"))
|
||||
.addColorPicker(picker => {
|
||||
picker
|
||||
.setValue(this.plugin.settings.galleryNavbarHoverColor || DEFAULT_SETTINGS.galleryNavbarHoverColor)
|
||||
.onChange((value) => __awaiter(this, void 0, void 0, function* () {
|
||||
this.plugin.settings.galleryNavbarHoverColor = value;
|
||||
yield this.plugin.saveSettings();
|
||||
}));
|
||||
})
|
||||
.addExtraButton(button => {
|
||||
button.setIcon('rotate-ccw')
|
||||
.setTooltip(t('RESET'))
|
||||
.onClick(() => __awaiter(this, void 0, void 0, function* () {
|
||||
this.plugin.settings.galleryNavbarHoverColor = DEFAULT_SETTINGS.galleryNavbarHoverColor;
|
||||
yield this.plugin.saveSettings();
|
||||
this.display();
|
||||
}));
|
||||
});
|
||||
const galleryImgBorderToggleSetting = new obsidian.Setting(containerEl)
|
||||
.setName(t("GALLERY_IMG_BORDER_TOGGLE_NAME"))
|
||||
.setDesc(t("GALLERY_IMG_BORDER_TOGGLE_DESC"))
|
||||
.addToggle(toggle => toggle
|
||||
@@ -771,12 +718,28 @@ class ImageToolkitSettingTab extends obsidian.PluginSettingTab {
|
||||
this.plugin.settings.galleryImgBorderActive = value;
|
||||
yield this.plugin.saveSettings();
|
||||
})));
|
||||
galleryImgBorderActiveColorSetting = this.createPickrSetting(containerEl, 'GALLERY_IMG_BORDER_ACTIVE_COLOR_NAME', GALLERY_IMG_BORDER_ACTIVE_COLOR);
|
||||
const galleryImgBorderActiveColorSetting = new obsidian.Setting(containerEl)
|
||||
.setName(t("GALLERY_IMG_BORDER_ACTIVE_COLOR_NAME"))
|
||||
.addColorPicker(picker => {
|
||||
picker.setValue(this.plugin.settings.galleryImgBorderActiveColor || DEFAULT_SETTINGS.galleryImgBorderActiveColor)
|
||||
.onChange((value) => __awaiter(this, void 0, void 0, function* () {
|
||||
this.plugin.settings.galleryImgBorderActiveColor = value;
|
||||
yield this.plugin.saveSettings();
|
||||
}));
|
||||
})
|
||||
.addExtraButton(button => {
|
||||
button.setIcon('rotate-ccw')
|
||||
.setTooltip(t('RESET'))
|
||||
.onClick(() => __awaiter(this, void 0, void 0, function* () {
|
||||
this.plugin.settings.imgViewBackgroundColor = DEFAULT_SETTINGS.galleryImgBorderActiveColor;
|
||||
yield this.plugin.saveSettings();
|
||||
this.display();
|
||||
}));
|
||||
});
|
||||
this.switchSettingsDisabled(!this.plugin.settings.galleryNavbarToggle, galleryNavbarDefaultColorSetting, galleryNavbarHoverColorSetting, galleryImgBorderToggleSetting, galleryImgBorderActiveColorSetting);
|
||||
//endregion
|
||||
//region >>> HOTKEYS_SETTINGS
|
||||
containerEl.createEl('h3', { text: t("HOTKEY_SETTINGS") });
|
||||
containerEl.createEl('p', { text: t("HOTKEY_SETTINGS_DESC") });
|
||||
new obsidian.Setting(containerEl).setName(t("HOTKEY_SETTINGS")).setDesc(t("HOTKEY_SETTINGS_DESC")).setHeading();
|
||||
if (this.plugin.settings.moveTheImageHotkey === this.plugin.settings.switchTheImageHotkey) {
|
||||
this.plugin.settings.moveTheImageHotkey = MOVE_THE_IMAGE.DEFAULT_HOTKEY;
|
||||
}
|
||||
@@ -792,12 +755,10 @@ class ImageToolkitSettingTab extends obsidian.PluginSettingTab {
|
||||
yield this.plugin.saveSettings();
|
||||
}));
|
||||
})).then((setting) => {
|
||||
setting.controlEl.appendChild(createDiv('setting-editor-extra-setting-button hotkeys-settings-plus', (el) => {
|
||||
el.innerHTML = "+";
|
||||
}));
|
||||
setting.controlEl.appendChild(createDiv('setting-editor-extra-setting-button', (el) => {
|
||||
el.innerHTML = MOVE_THE_IMAGE.SVG;
|
||||
}));
|
||||
setting.addExtraButton(button => {
|
||||
button.setIcon('plus').setDisabled(true);
|
||||
});
|
||||
setting.controlEl.appendChild(obsidian.sanitizeHTMLToDom(MOVE_THE_IMAGE.SVG));
|
||||
});
|
||||
if (this.plugin.settings.switchTheImageHotkey === this.plugin.settings.moveTheImageHotkey) {
|
||||
this.plugin.settings.switchTheImageHotkey = SWITCH_THE_IMAGE.DEFAULT_HOTKEY;
|
||||
@@ -814,12 +775,10 @@ class ImageToolkitSettingTab extends obsidian.PluginSettingTab {
|
||||
yield this.plugin.saveSettings();
|
||||
}));
|
||||
})).then((setting) => {
|
||||
setting.controlEl.appendChild(createDiv('setting-editor-extra-setting-button hotkeys-settings-plus', (el) => {
|
||||
el.innerHTML = "+";
|
||||
}));
|
||||
setting.controlEl.appendChild(createDiv('setting-editor-extra-setting-button', (el) => {
|
||||
el.innerHTML = SWITCH_THE_IMAGE.SVG;
|
||||
}));
|
||||
setting.addExtraButton(button => {
|
||||
button.setIcon('plus').setDisabled(true);
|
||||
});
|
||||
setting.controlEl.appendChild(obsidian.sanitizeHTMLToDom(SWITCH_THE_IMAGE.SVG));
|
||||
});
|
||||
if (switchTheImageSetting) {
|
||||
this.checkDropdownOptions(MOVE_THE_IMAGE.CODE, switchTheImageSetting);
|
||||
@@ -856,7 +815,6 @@ class ImageToolkitSettingTab extends obsidian.PluginSettingTab {
|
||||
//endregion
|
||||
}
|
||||
displayCommonSettings(containerEl) {
|
||||
containerEl.createEl('h3', { text: t('COMMON_SETTINGS') });
|
||||
new obsidian.Setting(containerEl)
|
||||
.setName(t("VIEW_MODE_NAME"))
|
||||
.addDropdown((dropdown) => __awaiter(this, void 0, void 0, function* () {
|
||||
@@ -871,7 +829,7 @@ class ImageToolkitSettingTab extends obsidian.PluginSettingTab {
|
||||
}));
|
||||
}
|
||||
displayViewTriggerSettings(containerEl) {
|
||||
containerEl.createEl('h3', { text: t("VIEW_TRIGGER_SETTINGS") });
|
||||
new obsidian.Setting(containerEl).setName(t("VIEW_TRIGGER_SETTINGS")).setHeading();
|
||||
new obsidian.Setting(containerEl)
|
||||
.setName(t("VIEW_IMAGE_IN_EDITOR_NAME"))
|
||||
.setDesc(t("VIEW_IMAGE_IN_EDITOR_DESC"))
|
||||
@@ -916,7 +874,7 @@ class ImageToolkitSettingTab extends obsidian.PluginSettingTab {
|
||||
displayPinModeSettings(containerEl) {
|
||||
//region >>> PIN_MODE_SETTINGS
|
||||
let pinMaximumSetting;
|
||||
containerEl.createEl('h3', { text: t("PIN_MODE_SETTINGS") });
|
||||
new obsidian.Setting(containerEl).setName(t("PIN_MODE_SETTINGS")).setHeading();
|
||||
/*new Setting(containerEl)
|
||||
.setName(t("PIN_MODE_NAME"))
|
||||
.setDesc(t("PIN_MODE_DESC"))
|
||||
@@ -963,95 +921,6 @@ class ImageToolkitSettingTab extends obsidian.PluginSettingTab {
|
||||
setting === null || setting === void 0 ? void 0 : setting.setDisabled(disabled);
|
||||
}
|
||||
}
|
||||
createPickrSetting(containerEl, name, defaultColor) {
|
||||
let pickrDefault;
|
||||
if ('GALLERY_NAVBAR_DEFAULT_COLOR_NAME' === name) {
|
||||
pickrDefault = this.plugin.settings.galleryNavbarDefaultColor;
|
||||
}
|
||||
else if ('GALLERY_NAVBAR_HOVER_COLOR_NAME' === name) {
|
||||
pickrDefault = this.plugin.settings.galleryNavbarHoverColor;
|
||||
}
|
||||
else if ('GALLERY_IMG_BORDER_ACTIVE_COLOR_NAME' === name) {
|
||||
pickrDefault = this.plugin.settings.galleryImgBorderActiveColor;
|
||||
}
|
||||
else if ('IMG_VIEW_BACKGROUND_COLOR_NAME' === name) {
|
||||
pickrDefault = this.plugin.settings.imgViewBackgroundColor;
|
||||
}
|
||||
else {
|
||||
pickrDefault = defaultColor;
|
||||
}
|
||||
let pickr;
|
||||
return new obsidian.Setting(containerEl)
|
||||
// @ts-ignore
|
||||
.setName(t(name))
|
||||
.then((setting) => {
|
||||
pickr = Pickr.create({
|
||||
el: setting.controlEl.createDiv({ cls: "picker" }),
|
||||
theme: 'nano',
|
||||
position: "left-middle",
|
||||
lockOpacity: false,
|
||||
default: pickrDefault,
|
||||
swatches: [],
|
||||
components: {
|
||||
preview: true,
|
||||
hue: true,
|
||||
opacity: true,
|
||||
interaction: {
|
||||
hex: true,
|
||||
rgba: true,
|
||||
hsla: false,
|
||||
input: true,
|
||||
cancel: true,
|
||||
save: true,
|
||||
},
|
||||
}
|
||||
})
|
||||
.on('show', (color, instance) => {
|
||||
if (!this.plugin.settings.galleryNavbarToggle)
|
||||
pickr === null || pickr === void 0 ? void 0 : pickr.hide();
|
||||
const { result } = pickr.getRoot().interaction;
|
||||
requestAnimationFrame(() => requestAnimationFrame(() => result.select()));
|
||||
})
|
||||
.on('save', (color, instance) => {
|
||||
if (!color)
|
||||
return;
|
||||
instance.hide();
|
||||
const savedColor = color.toHEXA().toString();
|
||||
instance.addSwatch(savedColor);
|
||||
this.setAndSavePickrSetting(name, savedColor);
|
||||
})
|
||||
.on('cancel', (instance) => {
|
||||
instance.hide();
|
||||
});
|
||||
})
|
||||
.addExtraButton((btn) => {
|
||||
btn.setIcon("reset")
|
||||
.onClick(() => {
|
||||
pickr.setColor(defaultColor);
|
||||
this.setAndSavePickrSetting(name, defaultColor);
|
||||
})
|
||||
.setTooltip('restore default color');
|
||||
});
|
||||
}
|
||||
setAndSavePickrSetting(name, savedColor) {
|
||||
if ('GALLERY_NAVBAR_DEFAULT_COLOR_NAME' === name) {
|
||||
this.plugin.settings.galleryNavbarDefaultColor = savedColor;
|
||||
}
|
||||
else if ('GALLERY_NAVBAR_HOVER_COLOR_NAME' === name) {
|
||||
this.plugin.settings.galleryNavbarHoverColor = savedColor;
|
||||
}
|
||||
else if ('GALLERY_IMG_BORDER_ACTIVE_COLOR_NAME' === name) {
|
||||
this.plugin.settings.galleryImgBorderActiveColor = savedColor;
|
||||
}
|
||||
else if ('IMG_VIEW_BACKGROUND_COLOR_NAME' === name) {
|
||||
this.plugin.settings.imgViewBackgroundColor = savedColor;
|
||||
// this.plugin.containerView?.setImgViewDefaultBackgroundForImgList();
|
||||
this.plugin.getAllContainerViews().forEach(container => {
|
||||
container.setImgViewDefaultBackgroundForImgList();
|
||||
});
|
||||
}
|
||||
this.plugin.saveSettings();
|
||||
}
|
||||
getDropdownOptions() {
|
||||
let options = {};
|
||||
for (const key in MODIFIER_HOTKEYS) {
|
||||
|
||||
+3
-3
@@ -1,9 +1,9 @@
|
||||
{
|
||||
"id": "obsidian-image-toolkit",
|
||||
"name": "Image Toolkit",
|
||||
"version": "1.4.2",
|
||||
"minAppVersion": "1.0.0",
|
||||
"description": "This plugin provides some image viewing toolkit.",
|
||||
"version": "1.4.3",
|
||||
"minAppVersion": "1.8.7",
|
||||
"description": "Click images to preview with zoom, move, rotate, flip, invert, and copy.",
|
||||
"author": "Xiangru",
|
||||
"authorUrl": "https://github.com/sissilab",
|
||||
"isDesktopOnly": true
|
||||
|
||||
-428
@@ -2,11 +2,6 @@ body {
|
||||
--layer-image-toolkit-popup: 1024;
|
||||
--layer-image-toolkit-player: 1025;
|
||||
--layer-image-toolkit-notice: 1026;
|
||||
--layer-menu: 1027;
|
||||
}
|
||||
|
||||
.menu {
|
||||
z-index: var(--layer-menu);
|
||||
}
|
||||
|
||||
.notice-container {
|
||||
@@ -322,426 +317,3 @@ body {
|
||||
height: 56px;
|
||||
}
|
||||
/*endregion*/
|
||||
|
||||
.hotkeys-settings-plus {
|
||||
margin: 0 10px;
|
||||
font-size: x-large;
|
||||
}
|
||||
|
||||
/*region pickr*/
|
||||
.pcr-app .pcr-swatches > button {
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
/*! Pickr 1.8.2 MIT | https://github.com/Simonwep/pickr */
|
||||
.pickr {
|
||||
position: relative;
|
||||
overflow: visible;
|
||||
transform: translateY(0)
|
||||
}
|
||||
|
||||
.pickr * {
|
||||
box-sizing: border-box;
|
||||
outline: none;
|
||||
border: none;
|
||||
-webkit-appearance: none
|
||||
}
|
||||
|
||||
.pickr .pcr-button {
|
||||
position: relative;
|
||||
height: 2em;
|
||||
width: 2em;
|
||||
padding: 0.5em;
|
||||
cursor: pointer;
|
||||
font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Helvetica Neue", Arial, sans-serif;
|
||||
border-radius: .15em;
|
||||
background: url('data:image/svg+xml;utf8, <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 50 50" stroke="%2342445A" stroke-width="5px" stroke-linecap="round"><path d="M45,45L5,5"></path><path d="M45,5L5,45"></path></svg>') no-repeat center;
|
||||
background-size: 0;
|
||||
transition: all 0.3s
|
||||
}
|
||||
|
||||
.pickr .pcr-button::before {
|
||||
position: absolute;
|
||||
content: '';
|
||||
top: 0;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
background: url('data:image/svg+xml;utf8, <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 2 2"><path fill="white" d="M1,0H2V1H1V0ZM0,1H1V2H0V1Z"/><path fill="gray" d="M0,0H1V1H0V0ZM1,1H2V2H1V1Z"/></svg>');
|
||||
background-size: .5em;
|
||||
border-radius: .15em;
|
||||
z-index: -1
|
||||
}
|
||||
|
||||
.pickr .pcr-button::before {
|
||||
z-index: initial
|
||||
}
|
||||
|
||||
.pickr .pcr-button::after {
|
||||
position: absolute;
|
||||
content: '';
|
||||
top: 0;
|
||||
left: 0;
|
||||
height: 100%;
|
||||
width: 100%;
|
||||
transition: background 0.3s;
|
||||
background: var(--pcr-color);
|
||||
border-radius: .15em
|
||||
}
|
||||
|
||||
.pickr .pcr-button.clear {
|
||||
background-size: 70%
|
||||
}
|
||||
|
||||
.pickr .pcr-button.clear::before {
|
||||
opacity: 0
|
||||
}
|
||||
|
||||
.pickr .pcr-button.clear:focus {
|
||||
box-shadow: 0 0 0 1px rgba(255, 255, 255, 0.85), 0 0 0 3px var(--pcr-color)
|
||||
}
|
||||
|
||||
.pickr .pcr-button.disabled {
|
||||
cursor: not-allowed
|
||||
}
|
||||
|
||||
.pickr *, .pcr-app * {
|
||||
box-sizing: border-box;
|
||||
outline: none;
|
||||
border: none;
|
||||
-webkit-appearance: none
|
||||
}
|
||||
|
||||
.pickr input:focus, .pickr input.pcr-active, .pickr button:focus, .pickr button.pcr-active, .pcr-app input:focus, .pcr-app input.pcr-active, .pcr-app button:focus, .pcr-app button.pcr-active {
|
||||
box-shadow: 0 0 0 1px rgba(255, 255, 255, 0.85), 0 0 0 3px var(--pcr-color)
|
||||
}
|
||||
|
||||
.pickr .pcr-palette, .pickr .pcr-slider, .pcr-app .pcr-palette, .pcr-app .pcr-slider {
|
||||
transition: box-shadow 0.3s
|
||||
}
|
||||
|
||||
.pickr .pcr-palette:focus, .pickr .pcr-slider:focus, .pcr-app .pcr-palette:focus, .pcr-app .pcr-slider:focus {
|
||||
box-shadow: 0 0 0 1px rgba(255, 255, 255, 0.85), 0 0 0 3px rgba(0, 0, 0, 0.25)
|
||||
}
|
||||
|
||||
.pcr-app {
|
||||
position: fixed;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
z-index: 10000;
|
||||
border-radius: 0.1em;
|
||||
background: #fff;
|
||||
opacity: 0;
|
||||
visibility: hidden;
|
||||
transition: opacity 0.3s, visibility 0s 0.3s;
|
||||
font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Helvetica Neue", Arial, sans-serif;
|
||||
box-shadow: 0 0.15em 1.5em 0 rgba(0, 0, 0, 0.1), 0 0 1em 0 rgba(0, 0, 0, 0.03);
|
||||
left: 0;
|
||||
top: 0
|
||||
}
|
||||
|
||||
.pcr-app.visible {
|
||||
transition: opacity 0.3s;
|
||||
visibility: visible;
|
||||
opacity: 1
|
||||
}
|
||||
|
||||
.pcr-app .pcr-swatches {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
margin-top: 0.75em
|
||||
}
|
||||
|
||||
.pcr-app .pcr-swatches.pcr-last {
|
||||
margin: 0
|
||||
}
|
||||
|
||||
@supports (display: grid) {
|
||||
.pcr-app .pcr-swatches {
|
||||
display: grid;
|
||||
align-items: center;
|
||||
grid-template-columns: repeat(auto-fit, 1.75em)
|
||||
}
|
||||
}
|
||||
|
||||
.pcr-app .pcr-swatches > button {
|
||||
font-size: 1em;
|
||||
position: relative;
|
||||
width: calc(1.75em - 10px);
|
||||
height: calc(1.75em - 10px);
|
||||
border-radius: 0.15em;
|
||||
cursor: pointer;
|
||||
margin: 2.5px;
|
||||
flex-shrink: 0;
|
||||
justify-self: center;
|
||||
transition: all 0.15s;
|
||||
overflow: hidden;
|
||||
background: transparent;
|
||||
z-index: 1
|
||||
}
|
||||
|
||||
.pcr-app .pcr-swatches > button::before {
|
||||
position: absolute;
|
||||
content: '';
|
||||
top: 0;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
background: url('data:image/svg+xml;utf8, <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 2 2"><path fill="white" d="M1,0H2V1H1V0ZM0,1H1V2H0V1Z"/><path fill="gray" d="M0,0H1V1H0V0ZM1,1H2V2H1V1Z"/></svg>');
|
||||
background-size: 6px;
|
||||
border-radius: .15em;
|
||||
z-index: -1
|
||||
}
|
||||
|
||||
.pcr-app .pcr-swatches > button::after {
|
||||
content: '';
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
background: var(--pcr-color);
|
||||
border: 1px solid rgba(0, 0, 0, 0.05);
|
||||
border-radius: 0.15em;
|
||||
box-sizing: border-box
|
||||
}
|
||||
|
||||
.pcr-app .pcr-swatches > button:hover {
|
||||
filter: brightness(1.05)
|
||||
}
|
||||
|
||||
.pcr-app .pcr-swatches > button:not(.pcr-active) {
|
||||
box-shadow: none
|
||||
}
|
||||
|
||||
.pcr-app .pcr-interaction {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
align-items: center;
|
||||
margin: 0 -0.2em 0 -0.2em
|
||||
}
|
||||
|
||||
.pcr-app .pcr-interaction > * {
|
||||
margin: 0 0.2em
|
||||
}
|
||||
|
||||
.pcr-app .pcr-interaction input {
|
||||
letter-spacing: 0.07em;
|
||||
font-size: 0.75em;
|
||||
text-align: center;
|
||||
cursor: pointer;
|
||||
color: #75797e;
|
||||
background: #f1f3f4;
|
||||
border-radius: .15em;
|
||||
transition: all 0.15s;
|
||||
padding: 0.45em 0.5em;
|
||||
margin-top: 0.75em
|
||||
}
|
||||
|
||||
.pcr-app .pcr-interaction input:hover {
|
||||
filter: brightness(0.975)
|
||||
}
|
||||
|
||||
.pcr-app .pcr-interaction input:focus {
|
||||
box-shadow: 0 0 0 1px rgba(255, 255, 255, 0.85), 0 0 0 3px rgba(66, 133, 244, 0.75)
|
||||
}
|
||||
|
||||
.pcr-app .pcr-interaction .pcr-result {
|
||||
color: #75797e;
|
||||
text-align: left;
|
||||
flex: 1 1 8em;
|
||||
min-width: 8em;
|
||||
transition: all 0.2s;
|
||||
border-radius: .15em;
|
||||
background: #f1f3f4;
|
||||
cursor: text
|
||||
}
|
||||
|
||||
.pcr-app .pcr-interaction .pcr-result::-moz-selection {
|
||||
background: #4285f4;
|
||||
color: #fff
|
||||
}
|
||||
|
||||
.pcr-app .pcr-interaction .pcr-result::selection {
|
||||
background: #4285f4;
|
||||
color: #fff
|
||||
}
|
||||
|
||||
.pcr-app .pcr-interaction .pcr-type.active {
|
||||
color: #fff;
|
||||
background: #4285f4
|
||||
}
|
||||
|
||||
.pcr-app .pcr-interaction .pcr-save, .pcr-app .pcr-interaction .pcr-cancel, .pcr-app .pcr-interaction .pcr-clear {
|
||||
color: #fff;
|
||||
width: auto
|
||||
}
|
||||
|
||||
.pcr-app .pcr-interaction .pcr-save, .pcr-app .pcr-interaction .pcr-cancel, .pcr-app .pcr-interaction .pcr-clear {
|
||||
color: #fff
|
||||
}
|
||||
|
||||
.pcr-app .pcr-interaction .pcr-save:hover, .pcr-app .pcr-interaction .pcr-cancel:hover, .pcr-app .pcr-interaction .pcr-clear:hover {
|
||||
filter: brightness(0.925)
|
||||
}
|
||||
|
||||
.pcr-app .pcr-interaction .pcr-save {
|
||||
background: #4285f4
|
||||
}
|
||||
|
||||
.pcr-app .pcr-interaction .pcr-clear, .pcr-app .pcr-interaction .pcr-cancel {
|
||||
background: #f44250
|
||||
}
|
||||
|
||||
.pcr-app .pcr-interaction .pcr-clear:focus, .pcr-app .pcr-interaction .pcr-cancel:focus {
|
||||
box-shadow: 0 0 0 1px rgba(255, 255, 255, 0.85), 0 0 0 3px rgba(244, 66, 80, 0.75)
|
||||
}
|
||||
|
||||
.pcr-app .pcr-selection .pcr-picker {
|
||||
position: absolute;
|
||||
height: 18px;
|
||||
width: 18px;
|
||||
border: 2px solid #fff;
|
||||
border-radius: 100%;
|
||||
-webkit-user-select: none;
|
||||
-moz-user-select: none;
|
||||
-ms-user-select: none;
|
||||
user-select: none
|
||||
}
|
||||
|
||||
.pcr-app .pcr-selection .pcr-color-palette, .pcr-app .pcr-selection .pcr-color-chooser, .pcr-app .pcr-selection .pcr-color-opacity {
|
||||
position: relative;
|
||||
-webkit-user-select: none;
|
||||
-moz-user-select: none;
|
||||
-ms-user-select: none;
|
||||
user-select: none;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
cursor: grab;
|
||||
cursor: -webkit-grab
|
||||
}
|
||||
|
||||
.pcr-app .pcr-selection .pcr-color-palette:active, .pcr-app .pcr-selection .pcr-color-chooser:active, .pcr-app .pcr-selection .pcr-color-opacity:active {
|
||||
cursor: grabbing;
|
||||
cursor: -webkit-grabbing
|
||||
}
|
||||
|
||||
.pcr-app[data-theme='nano'] {
|
||||
width: 14.25em;
|
||||
max-width: 95vw
|
||||
}
|
||||
|
||||
.pcr-app[data-theme='nano'] .pcr-swatches {
|
||||
margin-top: .6em;
|
||||
padding: 0 .6em
|
||||
}
|
||||
|
||||
.pcr-app[data-theme='nano'] .pcr-interaction {
|
||||
padding: 0 .6em .6em .6em
|
||||
}
|
||||
|
||||
.pcr-app[data-theme='nano'] .pcr-selection {
|
||||
display: grid;
|
||||
grid-gap: .6em;
|
||||
grid-template-columns: 1fr 4fr;
|
||||
grid-template-rows: 5fr auto auto;
|
||||
align-items: center;
|
||||
height: 10.5em;
|
||||
width: 100%;
|
||||
align-self: flex-start
|
||||
}
|
||||
|
||||
.pcr-app[data-theme='nano'] .pcr-selection .pcr-color-preview {
|
||||
grid-area: 2 / 1 / 4 / 1;
|
||||
height: 100%;
|
||||
width: 100%;
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
justify-content: center;
|
||||
margin-left: .6em
|
||||
}
|
||||
|
||||
.pcr-app[data-theme='nano'] .pcr-selection .pcr-color-preview .pcr-last-color {
|
||||
display: none
|
||||
}
|
||||
|
||||
.pcr-app[data-theme='nano'] .pcr-selection .pcr-color-preview .pcr-current-color {
|
||||
position: relative;
|
||||
background: var(--pcr-color);
|
||||
width: 2em;
|
||||
height: 2em;
|
||||
border-radius: 50em;
|
||||
overflow: hidden
|
||||
}
|
||||
|
||||
.pcr-app[data-theme='nano'] .pcr-selection .pcr-color-preview .pcr-current-color::before {
|
||||
position: absolute;
|
||||
content: '';
|
||||
top: 0;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
background: url('data:image/svg+xml;utf8, <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 2 2"><path fill="white" d="M1,0H2V1H1V0ZM0,1H1V2H0V1Z"/><path fill="gray" d="M0,0H1V1H0V0ZM1,1H2V2H1V1Z"/></svg>');
|
||||
background-size: .5em;
|
||||
border-radius: .15em;
|
||||
z-index: -1
|
||||
}
|
||||
|
||||
.pcr-app[data-theme='nano'] .pcr-selection .pcr-color-palette {
|
||||
grid-area: 1 / 1 / 2 / 3;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
z-index: 1
|
||||
}
|
||||
|
||||
.pcr-app[data-theme='nano'] .pcr-selection .pcr-color-palette .pcr-palette {
|
||||
border-radius: .15em;
|
||||
width: 100%;
|
||||
height: 100%
|
||||
}
|
||||
|
||||
.pcr-app[data-theme='nano'] .pcr-selection .pcr-color-palette .pcr-palette::before {
|
||||
position: absolute;
|
||||
content: '';
|
||||
top: 0;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
background: url('data:image/svg+xml;utf8, <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 2 2"><path fill="white" d="M1,0H2V1H1V0ZM0,1H1V2H0V1Z"/><path fill="gray" d="M0,0H1V1H0V0ZM1,1H2V2H1V1Z"/></svg>');
|
||||
background-size: .5em;
|
||||
border-radius: .15em;
|
||||
z-index: -1
|
||||
}
|
||||
|
||||
.pcr-app[data-theme='nano'] .pcr-selection .pcr-color-chooser {
|
||||
grid-area: 2 / 2 / 2 / 2
|
||||
}
|
||||
|
||||
.pcr-app[data-theme='nano'] .pcr-selection .pcr-color-opacity {
|
||||
grid-area: 3 / 2 / 3 / 2
|
||||
}
|
||||
|
||||
.pcr-app[data-theme='nano'] .pcr-selection .pcr-color-chooser, .pcr-app[data-theme='nano'] .pcr-selection .pcr-color-opacity {
|
||||
height: 0.5em;
|
||||
margin: 0 .6em
|
||||
}
|
||||
|
||||
.pcr-app[data-theme='nano'] .pcr-selection .pcr-color-chooser .pcr-picker, .pcr-app[data-theme='nano'] .pcr-selection .pcr-color-opacity .pcr-picker {
|
||||
top: 50%;
|
||||
transform: translateY(-50%)
|
||||
}
|
||||
|
||||
.pcr-app[data-theme='nano'] .pcr-selection .pcr-color-chooser .pcr-slider, .pcr-app[data-theme='nano'] .pcr-selection .pcr-color-opacity .pcr-slider {
|
||||
flex-grow: 1;
|
||||
border-radius: 50em
|
||||
}
|
||||
|
||||
.pcr-app[data-theme='nano'] .pcr-selection .pcr-color-chooser .pcr-slider {
|
||||
background: linear-gradient(to right, red, #ff0, lime, cyan, blue, #f0f, red)
|
||||
}
|
||||
|
||||
.pcr-app[data-theme='nano'] .pcr-selection .pcr-color-opacity .pcr-slider {
|
||||
background: linear-gradient(to right, transparent, black), url('data:image/svg+xml;utf8, <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 2 2"><path fill="white" d="M1,0H2V1H1V0ZM0,1H1V2H0V1Z"/><path fill="gray" d="M0,0H1V1H0V0ZM1,1H2V2H1V1Z"/></svg>');
|
||||
background-size: 100%, 0.25em
|
||||
}
|
||||
/*endregion*/
|
||||
Reference in new issue
Block a user