diff --git a/desktop/desktop.scss b/desktop/desktop.scss index 86695f7..f7465dd 100644 --- a/desktop/desktop.scss +++ b/desktop/desktop.scss @@ -87,31 +87,51 @@ //New Topic Fab #create-topic.btn-default { + display: flex; + align-items: center; + justify-content: center; + @include buttonShadow; + @include buttonTransition; + padding: 0; + margin: 0; + width: 63px; + height: 63px; border-radius: 40px; position: fixed; bottom: 30px; right: 50px; z-index: 999; - padding: 24px 20px 22px 5px; background-color: $tertiary; - color: $tertiary; + color: $secondary; white-space: nowrap; - text-indent: 10px; - @include buttonShadow; overflow: hidden; - width: 63px; - height: 63px; - @include buttonTransition; + .d-icon { + margin: 0; + } + .d-button-label { + display: inline-block; + transition: all 0.3s; + margin: 0 0.25em; + } + + &:not(:hover):not(:active):not(:focus) { + .d-button-label { + opacity: 0; + width: 0; + margin: 0; + } + .d-icon { + margin: 0 0.25em; + } + } } #create-topic.btn-default .fa-plus { - color: white; + color: $secondary; } #create-topic.btn-default:hover { - text-indent: 8px; width: 190px; - color: white; } //Reply Fab @@ -136,7 +156,7 @@ //Increase size of reply icon .widget-button.btn.create .fa-reply { - color: white; + color: $secondary; font-size: 20px; } @@ -199,7 +219,6 @@ #create-topic.btn-default { right: initial; left: 50px; - padding: 24px 5px 22px 20px; } .widget-button.btn.create { left: initial;