Enhance site information display by adding descriptions for each site. Updated button labels in site links to include both title and description for improved user context.
This commit is contained in:
eewing
+210
@@ -0,0 +1,210 @@
|
||||
import {
|
||||
transition_slide_display
|
||||
} from "./chunk-XWATFG4W.js";
|
||||
import {
|
||||
true_default
|
||||
} from "./chunk-HNWPC2PS.js";
|
||||
import "./chunk-X4VJQ2O3.js";
|
||||
|
||||
// node_modules/svelte/src/transition/index.js
|
||||
var linear = (x) => x;
|
||||
function cubic_out(t) {
|
||||
const f = t - 1;
|
||||
return f * f * f + 1;
|
||||
}
|
||||
function cubic_in_out(t) {
|
||||
return t < 0.5 ? 4 * t * t * t : 0.5 * Math.pow(2 * t - 2, 3) + 1;
|
||||
}
|
||||
function split_css_unit(value) {
|
||||
const split = typeof value === "string" && value.match(/^\s*(-?[\d.]+)([^\s]*)\s*$/);
|
||||
return split ? [parseFloat(split[1]), split[2] || "px"] : [
|
||||
/** @type {number} */
|
||||
value,
|
||||
"px"
|
||||
];
|
||||
}
|
||||
function blur(node, { delay = 0, duration = 400, easing = cubic_in_out, amount = 5, opacity = 0 } = {}) {
|
||||
const style = getComputedStyle(node);
|
||||
const target_opacity = +style.opacity;
|
||||
const f = style.filter === "none" ? "" : style.filter;
|
||||
const od = target_opacity * (1 - opacity);
|
||||
const [value, unit] = split_css_unit(amount);
|
||||
return {
|
||||
delay,
|
||||
duration,
|
||||
easing,
|
||||
css: (_t, u) => `opacity: ${target_opacity - od * u}; filter: ${f} blur(${u * value}${unit});`
|
||||
};
|
||||
}
|
||||
function fade(node, { delay = 0, duration = 400, easing = linear } = {}) {
|
||||
const o = +getComputedStyle(node).opacity;
|
||||
return {
|
||||
delay,
|
||||
duration,
|
||||
easing,
|
||||
css: (t) => `opacity: ${t * o}`
|
||||
};
|
||||
}
|
||||
function fly(node, { delay = 0, duration = 400, easing = cubic_out, x = 0, y = 0, opacity = 0 } = {}) {
|
||||
const style = getComputedStyle(node);
|
||||
const target_opacity = +style.opacity;
|
||||
const transform = style.transform === "none" ? "" : style.transform;
|
||||
const od = target_opacity * (1 - opacity);
|
||||
const [x_value, x_unit] = split_css_unit(x);
|
||||
const [y_value, y_unit] = split_css_unit(y);
|
||||
return {
|
||||
delay,
|
||||
duration,
|
||||
easing,
|
||||
css: (t, u) => `
|
||||
transform: ${transform} translate(${(1 - t) * x_value}${x_unit}, ${(1 - t) * y_value}${y_unit});
|
||||
opacity: ${target_opacity - od * u}`
|
||||
};
|
||||
}
|
||||
var slide_warning = false;
|
||||
function slide(node, { delay = 0, duration = 400, easing = cubic_out, axis = "y" } = {}) {
|
||||
const style = getComputedStyle(node);
|
||||
if (true_default && !slide_warning && /(contents|inline|table)/.test(style.display)) {
|
||||
slide_warning = true;
|
||||
Promise.resolve().then(() => slide_warning = false);
|
||||
transition_slide_display(style.display);
|
||||
}
|
||||
const opacity = +style.opacity;
|
||||
const primary_property = axis === "y" ? "height" : "width";
|
||||
const primary_property_value = parseFloat(style[primary_property]);
|
||||
const secondary_properties = axis === "y" ? ["top", "bottom"] : ["left", "right"];
|
||||
const capitalized_secondary_properties = secondary_properties.map(
|
||||
(e) => (
|
||||
/** @type {'Left' | 'Right' | 'Top' | 'Bottom'} */
|
||||
`${e[0].toUpperCase()}${e.slice(1)}`
|
||||
)
|
||||
);
|
||||
const padding_start_value = parseFloat(style[`padding${capitalized_secondary_properties[0]}`]);
|
||||
const padding_end_value = parseFloat(style[`padding${capitalized_secondary_properties[1]}`]);
|
||||
const margin_start_value = parseFloat(style[`margin${capitalized_secondary_properties[0]}`]);
|
||||
const margin_end_value = parseFloat(style[`margin${capitalized_secondary_properties[1]}`]);
|
||||
const border_width_start_value = parseFloat(
|
||||
style[`border${capitalized_secondary_properties[0]}Width`]
|
||||
);
|
||||
const border_width_end_value = parseFloat(
|
||||
style[`border${capitalized_secondary_properties[1]}Width`]
|
||||
);
|
||||
return {
|
||||
delay,
|
||||
duration,
|
||||
easing,
|
||||
css: (t) => `overflow: hidden;opacity: ${Math.min(t * 20, 1) * opacity};${primary_property}: ${t * primary_property_value}px;padding-${secondary_properties[0]}: ${t * padding_start_value}px;padding-${secondary_properties[1]}: ${t * padding_end_value}px;margin-${secondary_properties[0]}: ${t * margin_start_value}px;margin-${secondary_properties[1]}: ${t * margin_end_value}px;border-${secondary_properties[0]}-width: ${t * border_width_start_value}px;border-${secondary_properties[1]}-width: ${t * border_width_end_value}px;min-${primary_property}: 0`
|
||||
};
|
||||
}
|
||||
function scale(node, { delay = 0, duration = 400, easing = cubic_out, start = 0, opacity = 0 } = {}) {
|
||||
const style = getComputedStyle(node);
|
||||
const target_opacity = +style.opacity;
|
||||
const transform = style.transform === "none" ? "" : style.transform;
|
||||
const sd = 1 - start;
|
||||
const od = target_opacity * (1 - opacity);
|
||||
return {
|
||||
delay,
|
||||
duration,
|
||||
easing,
|
||||
css: (_t, u) => `
|
||||
transform: ${transform} scale(${1 - sd * u});
|
||||
opacity: ${target_opacity - od * u}
|
||||
`
|
||||
};
|
||||
}
|
||||
function draw(node, { delay = 0, speed, duration, easing = cubic_in_out } = {}) {
|
||||
let len = node.getTotalLength();
|
||||
const style = getComputedStyle(node);
|
||||
if (style.strokeLinecap !== "butt") {
|
||||
len += parseInt(style.strokeWidth);
|
||||
}
|
||||
if (duration === void 0) {
|
||||
if (speed === void 0) {
|
||||
duration = 800;
|
||||
} else {
|
||||
duration = len / speed;
|
||||
}
|
||||
} else if (typeof duration === "function") {
|
||||
duration = duration(len);
|
||||
}
|
||||
return {
|
||||
delay,
|
||||
duration,
|
||||
easing,
|
||||
css: (_, u) => `
|
||||
stroke-dasharray: ${len};
|
||||
stroke-dashoffset: ${u * len};
|
||||
`
|
||||
};
|
||||
}
|
||||
function assign(tar, src) {
|
||||
for (const k in src) tar[k] = src[k];
|
||||
return (
|
||||
/** @type {T & S} */
|
||||
tar
|
||||
);
|
||||
}
|
||||
function crossfade({ fallback, ...defaults }) {
|
||||
const to_receive = /* @__PURE__ */ new Map();
|
||||
const to_send = /* @__PURE__ */ new Map();
|
||||
function crossfade2(from_node, node, params) {
|
||||
const {
|
||||
delay = 0,
|
||||
duration = (
|
||||
/** @param {number} d */
|
||||
(d2) => Math.sqrt(d2) * 30
|
||||
),
|
||||
easing = cubic_out
|
||||
} = assign(assign({}, defaults), params);
|
||||
const from = from_node.getBoundingClientRect();
|
||||
const to = node.getBoundingClientRect();
|
||||
const dx = from.left - to.left;
|
||||
const dy = from.top - to.top;
|
||||
const dw = from.width / to.width;
|
||||
const dh = from.height / to.height;
|
||||
const d = Math.sqrt(dx * dx + dy * dy);
|
||||
const style = getComputedStyle(node);
|
||||
const transform = style.transform === "none" ? "" : style.transform;
|
||||
const opacity = +style.opacity;
|
||||
return {
|
||||
delay,
|
||||
duration: typeof duration === "function" ? duration(d) : duration,
|
||||
easing,
|
||||
css: (t, u) => `
|
||||
opacity: ${t * opacity};
|
||||
transform-origin: top left;
|
||||
transform: ${transform} translate(${u * dx}px,${u * dy}px) scale(${t + (1 - t) * dw}, ${t + (1 - t) * dh});
|
||||
`
|
||||
};
|
||||
}
|
||||
function transition(items, counterparts, intro) {
|
||||
return (node, params) => {
|
||||
items.set(params.key, node);
|
||||
return () => {
|
||||
if (counterparts.has(params.key)) {
|
||||
const other_node = counterparts.get(params.key);
|
||||
counterparts.delete(params.key);
|
||||
return crossfade2(
|
||||
/** @type {Element} */
|
||||
other_node,
|
||||
node,
|
||||
params
|
||||
);
|
||||
}
|
||||
items.delete(params.key);
|
||||
return fallback && fallback(node, params, intro);
|
||||
};
|
||||
};
|
||||
}
|
||||
return [transition(to_send, to_receive, false), transition(to_receive, to_send, true)];
|
||||
}
|
||||
export {
|
||||
blur,
|
||||
crossfade,
|
||||
draw,
|
||||
fade,
|
||||
fly,
|
||||
scale,
|
||||
slide
|
||||
};
|
||||
//# sourceMappingURL=svelte_transition.js.map
|
||||
Reference in New Issue
Block a user