Closed amity closed 5 years ago
amity
commented
5 years ago Related: I was consistently getting "build-storybook" not found errors (it's called in the base "build" script) until I added that line to the package.json. Please remove it if it's not necessary, but it seemed to just be a simple omission from what I could tell.
package.jsonの変えた点は、いつも”build-storybookのスクリプトがない”のエラーメッセージがいつも出ていました。（"build"のスクリプトの終わりに呼ばれています。）だから、そのスクリプトを付け足しました。それはだめだったら、どうぞ決してください。
trezy
commented
5 years ago Hey @soph-iest, it looks like you already switched this PR to point to the develop branch instead of the master branch. Can you make sure to pull the latest develop down locally and merge it into your branch? It looks like your branch is missing some commits from our latest develop.
Once you've taken care of that we'll pull it down and review. 😊
amity
commented
5 years ago Think that should've done it!
BcRikko
commented
5 years ago Sorry, The backdrop style was provided by user agent stylesheet 😇
I didn't notice that style does not apply with <dialog open />. 🙈
Style has been applied when using dialogElement.showModal() in JavaScript
<button type="button" class="nes-btn is-primary">open</button>
<dialog class="nes-dialog">
<p>Hello world!</p>
</dialog>document.querySelector('.nes-btn').addEventListener('click', () => {
document.querySelector('.nes-dialog').showModal();
})
amity
commented
5 years ago @BcRikko I was trying to consider the use case in which the user opens the dialog without using showModal() -- though that might be a standard approach to displaying dialogs, my thinking was to prioritize the functionality in all cases. I've gone ahead and switched it to box-shadow for now.
trezy
commented
5 years ago @BcRikko Yeah, the HTML5 <dialog /> element has two different methods for being displayed.
dialog.show()
This opens the <dialog /> in dialog mode, which means that it should not prevent the user from interacting with the other visible parts of the interface.dialog.showModal()
This opens the <dialog /> in modal mode, which means that it should prevent the user from interacting with the other visible parts of the interface.That said, it may not be the worst idea to add an explicit style for the backdrop. Something like this would be great, @soph-iest:
.nes-modal {
> .backdrop,
&::backdrop { ... }
}Thanks so much for the work, @soph-iest! 😁
BcRikko
commented
5 years ago :tada: This PR is included in version 1.0.0 :tada:
The release is available on:
Your semantic-release bot :package::rocket:
Creates formatting for HTML dialog objects; modeled off of the current design for containers. Created a test storybook container as well. Currently doesn't support many options; hoping to add that later if I get the time.
HTMLのdialog、今のcontainerのデザインのようにします。storybook の例も作りました。 今のは、ちょっと簡単ですが… 時間があれば、私は後でもっと進めるつもりです。
＜日本語があまり使いませんので、よくなければごめんなさい。＞