change modal styling to improve look of Close button, overall layout for modals

This commit is contained in:
summerscope
2014-09-19 16:46:19 +10:00
parent 408f7b7f10
commit 919f87df58

View File

@@ -4,10 +4,9 @@
dialog, .reveal-modal
border: none
outline: none
padding: 1.25rem
padding-bottom: 0 !important
border-bottom: 20px solid white
overflow-y: auto
padding: 30px 20px 0 20px
border-bottom: 30px solid white
overflow-y: scroll
overflow-x: hidden
// Not working yet - want a nice gradient shadow when there is overflow - needs JS too
// &:after
@@ -32,14 +31,18 @@ dialog, .reveal-modal
max-height: 80%
.reveal-modal-bg
background-color: rgba(0,0,0,0.65)
background-color: rgba(0,0,0,0.85)
dialog .close-reveal-modal, .reveal-modal .close-reveal-modal
right: 0.4rem
background-color: rgba(235,235,235,0.85)
right: 0.25rem
top: 0.25rem
background-color: rgba(205,205,205,0.65)
text-shadow: none
padding: 0.3rem
font-size: 2rem
padding: 0.45rem
color: #666
z-index: 9999999
@include border-radius(999999rem)
&:hover, &:active, &:focus
background-color: rgba(235,235,235,1)
background-color: rgba(205,205,205,1)
color: #333