diff options
| author | Valery Sizov <vsv2711@gmail.com> | 2015-12-17 14:29:55 +0200 |
|---|---|---|
| committer | Valery Sizov <vsv2711@gmail.com> | 2015-12-22 23:12:23 +0200 |
| commit | a48dd40a926fdeddfdd76cea5db468a82096c7f4 (patch) | |
| tree | 523151bfaa5c0f8f554b0029ae8dd5ae3a7ddc86 /app/assets/stylesheets/pages/awards.scss | |
| parent | 3b61dc47ec377b857b66f9b2a81a183276163f4e (diff) | |
| download | gitlab-ce-a48dd40a926fdeddfdd76cea5db468a82096c7f4.tar.gz | |
base implementation of emoji picker [ci skip]
Diffstat (limited to 'app/assets/stylesheets/pages/awards.scss')
| -rw-r--r-- | app/assets/stylesheets/pages/awards.scss | 75 |
1 files changed, 54 insertions, 21 deletions
diff --git a/app/assets/stylesheets/pages/awards.scss b/app/assets/stylesheets/pages/awards.scss index 041b811a606..30fdf3f218d 100644 --- a/app/assets/stylesheets/pages/awards.scss +++ b/app/assets/stylesheets/pages/awards.scss @@ -2,6 +2,12 @@ @include clearfix; line-height: 34px; + .emoji-icon { + width: 20px; + height: 20px; + margin: 7px 0 0 5px; + } + .award { @include border-radius(5px); @@ -40,6 +46,7 @@ } .awards-controls { + position: relative; margin-left: 10px; float: left; @@ -55,32 +62,58 @@ } } - .awards-menu { - padding: $gl-padding; - min-width: 214px; - - > li { - cursor: pointer; - width: 30px; - height: 30px; - text-align: center; - @include border-radius(5px); + .emoji-menu{ + position: absolute; + top: 100%; + left: 0; + z-index: 1000; + display: none; + float: left; + min-width: 160px; + padding: 5px 0; + margin: 2px 0 0; + font-size: 14px; + text-align: left; + list-style: none; + background-color: #fff; + -webkit-background-clip: padding-box; + background-clip: padding-box; + border: 1px solid #ccc; + border: 1px solid rgba(0,0,0,.15); + border-radius: 4px; + -webkit-box-shadow: 0 6px 12px rgba(0,0,0,.175); + box-shadow: 0 6px 12px rgba(0,0,0,.175); + + .emoji-menu-content { + padding: $gl-padding; + width: 300px; + height: 300px; + overflow-y: scroll; + + h4 { + clear: left; + } - img { - margin-bottom: 2px; + ul { + list-style-type: none; + margin-left: -20px; } - &:hover { - background-color: #ccc; + li { + cursor: pointer; + width: 30px; + height: 30px; + text-align: center; + float: left; + margin: 3px; + list-decorate: none; + @include border-radius(5px); + + &:hover { + background-color: #ccc; + } } } } } - - .awards-menu{ - li { - float: left; - margin: 3px; - } - } } |