search

buildingfirefoxos / Building-Blocks

Reusable components for Firefox OS
Other
292 stars 97 forks source link

Last item does not appear with drawers #57

Closed tuxgasy closed 1 year ago

tuxgasy commented 10 years ago

Hi,

When thera are a lot of items, the laster does not appear on scrolling. Example with this code: 

<!DOCTYPE html>
<html>

<head>
    <meta name="viewport" content="width=device-width, user-scalable=no">
    <meta charset="utf-8">

    <title>Drawer</title>

    <link rel="stylesheet" href="style/headers.css">
    <link rel="stylesheet" href="style/drawer.css">

    <link rel="stylesheet" href="icons/styles/action_icons.css">
    <link rel="stylesheet" href="icons/styles/media_icons.css">
    <link rel="stylesheet" href="icons/styles/comms_icons.css">
    <link rel="stylesheet" href="icons/styles/settings_icons.css">

    <link rel="stylesheet" href="util.css">
</head>

<body>
    <section data-type="sidebar">
        <header>
            <menu type="toolbar">
                <a href="#">Close</a>
            </menu>
            <h1>Panel</h1>
        </header>
        <nav>
            <ul>
                <li>
                    <a href="#">Item 1</a>
                </li>
                <li>
                    <a href="#">Item 2</a>
                </li>
                <li>
                    <a href="#">Item 3</a>
                </li>
                <li>
                    <a href="#">Item 4</a>
                </li>
                <li>
                    <a href="#">Item 5</a>
                </li>
                <li>
                    <a href="#">Item 6</a>
                </li>
                <li>
                    <a href="#">Item 7</a>
                </li>
                <li>
                    <a href="#">Item 8</a>
                </li>
                <li>
                    <a href="#">Item 9</a>
                </li>
                <li>
                    <a href="#">Item 10</a>
                </li>
                <li>
                    <a href="#">Item 11</a>
                </li>
                <li>
                    <a href="#">Item 12</a>
                </li>
                <li>
                    <a href="#">Item 13</a>
                </li>
                <li>
                    <a href="#">Item 14</a>
                </li>
                <li>
                    <a href="#">Item 15</a>
                </li>
                <li>
                    <a href="#">Item 16</a>
                </li>
                <li>
                    <a href="#">Item 17</a>
                </li>
                <li>
                    <a href="#">Item 18</a>
                </li>
                <li>
                    <a href="#">Item 19</a>
                </li>
                <li>
                    <a href="#">Item 20</a>
                </li>
                <li>
                    <a href="#">Item 21</a>
                </li>
                <li>
                    <a href="#">Item 22</a>
                </li>
                <li>
                    <a href="#">Item 23</a>
                </li>
                <li>
                    <a href="#">Item 24</a>
                </li>
                <li>
                    <a href="#">Item 25</a>
                </li>
            </ul>
        </nav>
    </section>

    <section id="drawer" role="region">
        <header>
            <a href="#drawer"><span class="icon icon-menu">panel</span></a>
            <h1>Drawer</h1>
        </header>
        <section></section>
    </section>
</body>

</html>
</code>
acidicX commented 10 years ago

I can confirm that. For what it's worth, I just included a hidden last item... ugly, but it works. I might point out that with 2.0 this all will become pretty much irrelevant though, as the WebApps use a completely new framework.