Adds support for HTML dialog object #171
Conversation
Removes extraneous remaining code
|
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"のスクリプトの終わりに呼ばれています。）だから、そのスクリプトを付け足しました。それはだめだったら、どうぞ決してください。 |
|
Hey @soph-iest, it looks like you already switched this PR to point to the Once you've taken care of that we'll pull it down and review. 😊 |
|
Think that should've done it! |
There was a problem hiding this comment.
I have not tried it yet, but I think it's better to have a backdrop style 🤔
https://developer.mozilla.org/en-US/docs/Web/HTML/Element/dialog
and Thank you for writing in Japanese 😆
|
Sorry, The backdrop style was provided by user agent stylesheet 😇 Style has been applied when using sample<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();
})
|
|
@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. |
|
@BcRikko Yeah, the HTML5
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! 😁 |
|
🎉 This PR is included in version 1.0.0 🎉 The release is available on: Your semantic-release bot 📦🚀 |
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 の例も作りました。
今のは、ちょっと簡単ですが… 時間があれば、私は後でもっと進めるつもりです。
＜日本語があまり使いませんので、よくなければごめんなさい。＞