Skip to content

Commit

Permalink
preparation for first publish
Browse files Browse the repository at this point in the history
  • Loading branch information
martrapp committed Jul 12, 2024
1 parent af763a5 commit e49a536
Show file tree
Hide file tree
Showing 9 changed files with 19 additions and 9 deletions.
4 changes: 2 additions & 2 deletions src/bench.txt
Original file line number Diff line number Diff line change
Expand Up @@ -27,8 +27,8 @@
<code>Side-by-side Comparison</code>.
</p>
<p>
<b>Examine</b> the defined transitions by clicking on there names or selecting the
highlight toggle, then <b>navigate</b> by clicking a link on your page.
<b>Examine</b> the defined transitions by clicking on the names or select the
highlight toggle. Then <b>navigate</b> by clicking a link on your page.
</p>
<p>
Selecting an element with a view transition name copies its selector to the clipboard,
Expand Down
4 changes: 2 additions & 2 deletions src/index.ts
Original file line number Diff line number Diff line change
Expand Up @@ -196,8 +196,8 @@ async function initPanel() {
);
}
});
mainFrame.animate([{ opacity: 0 }, { opacity: 1 }], {
duration: 50,
mainFrame.animate([{ opacity: 0, transform: "translateY(100vh)" }, { opacity: 1 }], {
duration: 500,
fill: 'forwards',
});
frameDocument!.addEventListener('click', innerClick);
Expand Down
6 changes: 5 additions & 1 deletion src/panel/names.ts
Original file line number Diff line number Diff line change
Expand Up @@ -279,7 +279,7 @@ const glow = [
minWidth: '20px',
minHeight: '20px',
backgroundColor: 'darkslateblue',
opacity: '1',
opacity: '0.5',
},
{ boxShadow: '0 0 50px blue' },
{ boxShadow: '0 0 0px blue' },
Expand Down Expand Up @@ -310,6 +310,10 @@ export function highlightInFrame(name: string) {
function glowPseudo(name: string) {
setStyles(
`
::view-transition-old(*),
::view-transition-new(*) {
opacity: 0;
}
::view-transition-old(${name}) {
box-shadow: 0 0 100px blue;
background-color: darkslateblue;
Expand Down
Binary file added src/pngs/bag4.png
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
1 change: 1 addition & 0 deletions src/pngs/bag4.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1 @@
export const src="data:image/png;base64,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";
1 change: 1 addition & 0 deletions src/pngs/chamber.ts

Large diffs are not rendered by default.

Binary file added src/pngs/xtiny-chamber.png
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
6 changes: 5 additions & 1 deletion src/reopener.ts
Original file line number Diff line number Diff line change
@@ -1,4 +1,5 @@
import { initDragging } from './dragging';
import { src} from './pngs/chamber';

export function showReopener() {
top!.addEventListener('resize', () => {
Expand All @@ -11,7 +12,10 @@ export function showReopener() {
);
top!.document.body.insertAdjacentHTML(
'beforeend',
`<div title="reopen the inspection chamber" id="vtbag-ui-reopen" style="position: fixed; z-index:1100; left: ${reopenerLeft}; top: ${reopenerTop}"><svg xmlns="http://www.w3.org/2000/svg" width="2em" height="2em" viewBox="0 0 48 48"><g fill="none" stroke-linecap="round" stroke-linejoin="round" stroke-width="2"><path d="M35 14c0-5.523-4.925-10-11-10S13 8.477 13 14m-6 2a2 2 0 0 1 2-2h30a2 2 0 0 1 2 2v12a2 2 0 0 1-2 2h-9a2 2 0 0 1-2-2v0a2 2 0 0 0-2-2h-4a2 2 0 0 0-2 2v0a2 2 0 0 1-2 2H9a2 2 0 0 1-2-2zm3 14v14h28V30"/><path d="M20 26h8v6h-8z"/></g></svg><div>
`<div title="reopen the inspection chamber" id="vtbag-ui-reopen" style="position: fixed; z-index:1100; left: ${reopenerLeft}; top: ${reopenerTop}"><img style=" border-radius: 50%;
border: 8px dashed #8888;
mask-image: radial-gradient(ellipse at center, white 35%, transparent 71%);
" src=${src} alt="" /><div>
<style>
#vtbag-ui-reopen g {
Expand Down
6 changes: 3 additions & 3 deletions src/styles.ts
Original file line number Diff line number Diff line change
Expand Up @@ -23,15 +23,15 @@ function unframe() {
function frame() {
setStyles(`
::view-transition-old(*) {
border: 3px dashed darkslateblue;
outline: 3px dashed darkslateblue;
border-radius: 5px;
}
::view-transition-new(*) {
border: 3px dashed darkolivegreen;
outline: 3px dashed darkolivegreen;
}
::view-transition-group(*),
[data-vtbag-transition-name] {
border: 1px dotted darkgoldenrod;
outline: 2px dotted darkgoldenrod;
}
::view-transition-group(*),
::view-transition-image-pair(*),
Expand Down

0 comments on commit e49a536

Please sign in to comment.