twinssbc / Ionic-Calendar

A calendar directive for Ionic framework
http://twinssbc.github.io/Ionic-Calendar/demo
MIT License
159 stars 73 forks source link

Under the day view, I have an issue with the "all day" div tag floating over the div segment for "12am" #50

Closed sceptre12 closed 7 years ago

sceptre12 commented 8 years ago

This is all I have and its being rendered in a "ion-side-menu-content", which also contains a ion-nav-bar.

`

`

screen shot 2016-06-09 at 1 44 00 am

Is it possible that the all day part can be an option which the user can remove. Removing that would solve the issue, but there are no documentation on how to remove that

twinssbc commented 8 years ago

@sceptre12 I guess you directly add contents in ion-side-menu-content? Maybe you can try the other way? Suppose you use the official sample code of menu layout as below:

    <ion-side-menus enable-menu-with-back-views="false">
        <ion-side-menu-content>
            <ion-nav-bar class="bar-stable">
                <ion-nav-back-button>
                </ion-nav-back-button>

                <ion-nav-buttons side="left">
                    <button class="button button-icon button-clear ion-navicon" menu-toggle="left">
                    </button>
                </ion-nav-buttons>
            </ion-nav-bar>
            <ion-nav-view name="menuContent">
            </ion-nav-view>
        </ion-side-menu-content>
        <ion-side-menu side="left" width="500">
        </ion-side-menu>
    </ion-side-menus>

Then what you need to do is specifying the view in stateProvider, notice the 'menuContent' in the views should match the ion-nav-view in the ion-side-menu-content:

            .state('menus.home', {
                url: '/home',
                views: {
                    'menuContent': {
                        templateUrl: 'templates/home.html',
                        controller: 'CalendarDemoCtrl'
                    }
                }
            })

I've tested and the rendering is correct. Regarding hiding the all day part, it's not an option yet. But you can use CSS style to hide it. The allday table exposes "dayview-allday-table" class, you just need to set display: none to hide it.

sceptre12 commented 8 years ago

Hmm, So i've tried this and it still dosent seem to work. I'm actually using the side menu as an abstract state and letting the child state render inside of the <ion-nav-view name="menuContent"> </ion-nav-view>

But yes I've used display none to hide the all day event. Thanks on that

twinssbc commented 8 years ago

@sceptre12 I have put my sample in Plunker. https://plnkr.co/edit/SlewSrFKZeVW3lIpaBvY?p=preview