msb-public
/
svelte
mirror of https://github.com/sveltejs/svelte
1
0
Code Issues Projects Releases Wiki Activity

Fix margin not being read, rename variables

Browse Source
pull/6183/head
Theo Steiner 5 years ago committed by Theodor Steiner
parent 53f6b51118
commit 03025651e5
1 changed files with 17 additions and 16 deletions
Show Stats Download Patch File Download Diff File

33
src/runtime/transition/index.ts
Unescape View File

@ -109,15 +109,16 @@ export function slide(node: Element, {
}: SlideParams = {}): TransitionConfig { }: SlideParams = {}): TransitionConfig {
const style = getComputedStyle(node); const style = getComputedStyle(node);
const opacity = +style.opacity; const opacity = +style.opacity;
const primary_dimension = axis === 'y' ? 'height' : 'width'; const primary_property = axis === 'y' ? 'height' : 'width';
const primary_dimension_value = parseFloat(style[primary_dimension]); const primary_property_value = parseFloat(style[primary_property]);
const secondary_dimensions = axis === 'y' ? ['Top', 'Bottom'] : ['Left', 'Right']; const secondary_properties = axis === 'y' ? ['top', 'bottom'] : ['left', 'right'];
const padding_start_value = parseFloat(style.padding + secondary_dimensions[0]); const capitalized_secondary_properties = secondary_properties.map((e) => `${e[0].toUpperCase()}${e.slice(1)}`);
const padding_end_value = parseFloat(style.padding + secondary_dimensions[1]); const padding_start_value = parseFloat(style[`padding${capitalized_secondary_properties[0]}`]);
const margin_start_value = parseFloat(style.margin + secondary_dimensions[0]); const padding_end_value = parseFloat(style[`padding${capitalized_secondary_properties[1]}`]);
const margin_end_value = parseFloat(style.margin + secondary_dimensions[1]); const margin_start_value = parseFloat(style[`margin${capitalized_secondary_properties[0]}`]);
const border_width_start_value = parseFloat(style[`border${secondary_dimensions[0]}Width`]); const margin_end_value = parseFloat(style[`margin${capitalized_secondary_properties[1]}`]);
const border_width_end_value = parseFloat(style[`border${secondary_dimensions[1]}Width`]); 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 { return {
delay, delay,
duration, duration,
@ -125,13 +126,13 @@ export function slide(node: Element, {
css: t => css: t =>
'overflow: hidden;' + 'overflow: hidden;' +
`opacity: ${Math.min(t * 20, 1) * opacity};` + `opacity: ${Math.min(t * 20, 1) * opacity};` +
`${primary_dimension}: ${t * primary_dimension_value}px;` + `${primary_property}: ${t * primary_property_value}px;` +
`padding-${secondary_dimensions[0].toLowerCase()}: ${t * padding_start_value}px;` + `padding-${secondary_properties[0]}: ${t * padding_start_value}px;` +
`padding-${secondary_dimensions[1].toLowerCase()}: ${t * padding_end_value}px;` + `padding-${secondary_properties[1]}: ${t * padding_end_value}px;` +
`margin-${secondary_dimensions[0].toLowerCase()}: ${t * margin_start_value}px;` + `margin-${secondary_properties[0]}: ${t * margin_start_value}px;` +
`margin-${secondary_dimensions[1].toLowerCase()}: ${t * margin_end_value}px;` + `margin-${secondary_properties[1]}: ${t * margin_end_value}px;` +
`border-${secondary_dimensions[0].toLowerCase()}-width: ${t * border_width_start_value}px;` + `border-${secondary_properties[0]}-width: ${t * border_width_start_value}px;` +
`border-${secondary_dimensions[1].toLowerCase()}-width: ${t * border_width_end_value}px;` `border-${secondary_properties[1]}-width: ${t * border_width_end_value}px;`
}; };
} }

Write Preview
Loading…
Cancel
Save