From e214aae719c10953c4c3a7949c9bd02d6983b045 Mon Sep 17 00:00:00 2001 From: Asaad Mahmood Date: Mon, 14 Mar 2016 22:35:57 +0500 Subject: PLT-963 - Improving scss structure --- web/sass-files/sass/components/_mentions.scss | 56 +++++++++++++++++++++++++++ 1 file changed, 56 insertions(+) create mode 100644 web/sass-files/sass/components/_mentions.scss (limited to 'web/sass-files/sass/components/_mentions.scss') diff --git a/web/sass-files/sass/components/_mentions.scss b/web/sass-files/sass/components/_mentions.scss new file mode 100644 index 000000000..98efc599d --- /dev/null +++ b/web/sass-files/sass/components/_mentions.scss @@ -0,0 +1,56 @@ +@charset 'UTF-8'; + +.mention { + color: #fff; + background: $color--primary; + position: relative; + z-index: 10; + padding-bottom: 2px; + @include border-radius(3px); +} + +.mentions__name { + position: relative; + width: 100%; + height: 36px; + padding: 2px; + z-index: 101; + line-height: 36px; + font-size: 13px; + cursor: pointer; + white-space: nowrap; + + .mention-align { + @include clearfix; + text-overflow: ellipsis; + width: calc(100% - 50px); + } +} + +.mention__image { + margin-right: 6px; + height: 32px; + width: 32px; + line-height: 36px; + display: block; + font-size: 20px; + text-align: center; + @include border-radius(32px); + + .mention--align { + max-width: 80%; + overflow: hidden; + display: inline-block; + white-space: nowrap; + text-overflow: ellipsis; + } +} + +.mention__fullname { + color: grey; + padding-left: 10px; +} + +.mention--highlight { + background-color: #fff2bb; +} -- cgit v1.2.3-1-g7c22