UI bug fix

This commit is contained in:
sairaj mote 2021-07-19 01:00:19 +05:30
parent 26ec54cf4e
commit 558ca2f0c0
5 changed files with 6 additions and 6 deletions

View File

@ -577,7 +577,7 @@ strong.important {
object-fit: cover;
object-position: top;
height: 30rem;
width: min(16rem, 100%);
width: 16rem;
border-radius: 1rem;
justify-self: center;
box-shadow: 0 0.5rem 1.5rem -0.5rem rgba(0, 0, 0, 0.3), 0 0 0 0.3rem black;

File diff suppressed because one or more lines are too long

View File

@ -500,7 +500,7 @@ strong.important{
object-fit: cover;
object-position: top;
height: 30rem;
width: min(16rem, 100%);
width: 16rem;
border-radius: 1rem;
justify-self: center;
box-shadow: 0 0.5rem 1.5rem -0.5rem rgba(0,0,0, 0.3),

View File

@ -628,11 +628,11 @@
<h1 class="page__title">Hamburger menu</h1>
<section class="grid auto-grid-2 gap-3">
<div class="grid gap-1">
<img class="screenshot" src="assets/ham-menu-closed.png" alt="Hamburger menu closed">
<img class="screenshot" loading="lazy" src="assets/ham-menu-closed.png" alt="Hamburger menu closed">
<h4>Hamburger menu closed</h4>
</div>
<div class="grid gap-1">
<img class="screenshot" src="assets/ham-menu-open.png" alt="Hamburger menu opened">
<img class="screenshot" loading="lazy" src="assets/ham-menu-open.png" alt="Hamburger menu opened">
<h4>Hamburger menu open</h4>
</div>
</section>

View File

@ -46,7 +46,7 @@
<code>
&lt;file-input multiple&gt;Select multiple files&lt;/file-input&gt;
</code>
</pre><h2>Attributes</h2><section class="table"><div class="tr"><h4 class="table__heading">Attribute</h4><h4 class="table__heading">Description</h4></div><div class="tr"><div><span class="highlight">accept</span></div><p>One or more unique file type specifiers describing file types to allow</p></div><div class="tr"><div><span class="highlight">capture</span></div><p>What source to use for capturing image or video data</p></div><div class="tr"><div><span class="highlight">files</span></div><p>A FileList listing the chosen files</p></div><div class="tr"><div><span class="highlight">multiple</span></div><p>A Boolean which, if present, indicates that the user may choose more than one file</p></div></section></section><section id="form_page" class="page hide-completely"><h1 class="page__title">Form</h1><p>Browser support for web components form validation or form submition is not perfect. so to circumvent this problem <span class="highlight">&lt;sm-form&gt;</span> can be used.</p><h2>Interactive demo</h2><sm-form><sm-input placeholder="Email" type="email" error-text="please enter correct email" required animate></sm-input><sm-input placeholder="Password" type="password" required animate></sm-input><sm-button variant="primary" disabled>Login</sm-button></sm-form><h2>Supported functions</h2><section class="table"><div class="tr"><h4 class="table__heading">Function</h4><h4 class="table__heading">Description</h4></div><div class="tr"><div><span class="highlight">reset()</span></div><p>When this function is called upon form element. all the form elements (sm- form components only) will be reset to default state.</p></div></section><h2>Nested element behaviour</h2><section class="table"><div class="tr"><h4 class="table__heading">Element</h4><h4 class="table__heading">behaviour</h4></div><div class="tr"><div>sm-button <span class="highlight">variant="primary"</span> or <span class="highlight">type="submit"</span></div><p>Whenever enter is pressed inside an active <span class="highlight">sm-input</span>, this will fire click event.<br>This will also change state depending opon validation conditions.</p></div><div class="tr"><div>sm-button <span class="highlight">type="reset"</span></div><p>When clicked, the whole form will reset.</p></div></section></section><section id="hamburger_menu_page" class="page hide-completely"><h1 class="page__title">Hamburger menu</h1><section class="grid auto-grid-2 gap-3"><div class="grid gap-1"><img class="screenshot" src="assets/ham-menu-closed.png" alt="Hamburger menu closed"><h4>Hamburger menu closed</h4></div><div class="grid gap-1"><img class="screenshot" src="assets/ham-menu-open.png" alt="Hamburger menu opened"><h4>Hamburger menu open</h4></div></section><h2>Usage</h2><pre>
</pre><h2>Attributes</h2><section class="table"><div class="tr"><h4 class="table__heading">Attribute</h4><h4 class="table__heading">Description</h4></div><div class="tr"><div><span class="highlight">accept</span></div><p>One or more unique file type specifiers describing file types to allow</p></div><div class="tr"><div><span class="highlight">capture</span></div><p>What source to use for capturing image or video data</p></div><div class="tr"><div><span class="highlight">files</span></div><p>A FileList listing the chosen files</p></div><div class="tr"><div><span class="highlight">multiple</span></div><p>A Boolean which, if present, indicates that the user may choose more than one file</p></div></section></section><section id="form_page" class="page hide-completely"><h1 class="page__title">Form</h1><p>Browser support for web components form validation or form submition is not perfect. so to circumvent this problem <span class="highlight">&lt;sm-form&gt;</span> can be used.</p><h2>Interactive demo</h2><sm-form><sm-input placeholder="Email" type="email" error-text="please enter correct email" required animate></sm-input><sm-input placeholder="Password" type="password" required animate></sm-input><sm-button variant="primary" disabled>Login</sm-button></sm-form><h2>Supported functions</h2><section class="table"><div class="tr"><h4 class="table__heading">Function</h4><h4 class="table__heading">Description</h4></div><div class="tr"><div><span class="highlight">reset()</span></div><p>When this function is called upon form element. all the form elements (sm- form components only) will be reset to default state.</p></div></section><h2>Nested element behaviour</h2><section class="table"><div class="tr"><h4 class="table__heading">Element</h4><h4 class="table__heading">behaviour</h4></div><div class="tr"><div>sm-button <span class="highlight">variant="primary"</span> or <span class="highlight">type="submit"</span></div><p>Whenever enter is pressed inside an active <span class="highlight">sm-input</span>, this will fire click event.<br>This will also change state depending opon validation conditions.</p></div><div class="tr"><div>sm-button <span class="highlight">type="reset"</span></div><p>When clicked, the whole form will reset.</p></div></section></section><section id="hamburger_menu_page" class="page hide-completely"><h1 class="page__title">Hamburger menu</h1><section class="grid auto-grid-2 gap-3"><div class="grid gap-1"><img class="screenshot" loading="lazy" src="assets/ham-menu-closed.png" alt="Hamburger menu closed"><h4>Hamburger menu closed</h4></div><div class="grid gap-1"><img class="screenshot" loading="lazy" src="assets/ham-menu-open.png" alt="Hamburger menu opened"><h4>Hamburger menu open</h4></div></section><h2>Usage</h2><pre>
<code>
&lt;hamburger-menu id="navigation_drawer"&gt;
<!-- Navigation links -->