Popover Arrow flipped when shown above item (iOS)

[ColinFrick]

Short description of the problem:

When a popover opens above an element (f.e. button in footer) the arrow still points up.

What behavior are you expecting?

Popover arrow pointing to the element (down)

Steps to reproduce:

1. Create a page with a footer
2. Add button to footer
3. Open Popover with this button

Other information:
Caused by:

CSS class popover-bottom is added to the popover itself, but in the iOS styling it's handled as a child element:
https://github.com/driftyco/ionic/blob/master/src/components/popover/popover.ios.scss#L69
https://github.com/driftyco/ionic/blob/master/src/components/popover/popover.ios.scss#L74

Remove space should fix the issue

.popover-ios.popover-bottom .popover-arrow {
  top: auto;
  bottom: -10px;
}

.popover-ios.popover-bottom .popover-arrow::after {
  top: -6px;
}

Which Ionic Version? 1.x or 2.x
2.0.0-rc.0

Run ionic info from terminal/cmd prompt: (paste output below)
Cordova CLI: 6.3.1
Gulp version: CLI version 3.9.1
Gulp local:
Ionic Framework Version: 2.0.0-rc.0
Ionic CLI Version: 2.1.0
Ionic App Lib Version: 2.1.0-beta.1
OS: Distributor ID: LinuxMint Description: Linux Mint 17.3 Rosa
Node Version: v6.7.0

[zakton5]

Any way this could get moved in to the rc.1 milestone?

[manucorporat]

@zakton5 can you provide a screenshot?

[ColinFrick]

@manucorporat

[manucorporat]

@brandyscarney confirmed this is a real issue:

[brandyscarney]

Thanks for the PR! This will be fixed in the rc.1 release. 😄