summaryrefslogtreecommitdiff
path: root/web-ui/app/scss/views/_navigation.scss
diff options
context:
space:
mode:
authorZara Gebru <zgebru@thoughtworks.com>2016-12-02 15:25:23 +0100
committerZara Gebru <zgebru@thoughtworks.com>2016-12-02 15:25:23 +0100
commitb14833fbb56bcd5bff0750c16fd9214009b955be (patch)
treea1ec621dd5f76d756ac59b72a763a34a2c189387 /web-ui/app/scss/views/_navigation.scss
parent688a8b42e8ab7c6d4529b6dda66f40eead07ad02 (diff)
[refactor] move app dir into public dir
Diffstat (limited to 'web-ui/app/scss/views/_navigation.scss')
-rw-r--r--web-ui/app/scss/views/_navigation.scss589
1 files changed, 0 insertions, 589 deletions
diff --git a/web-ui/app/scss/views/_navigation.scss b/web-ui/app/scss/views/_navigation.scss
deleted file mode 100644
index 2c33a791..00000000
--- a/web-ui/app/scss/views/_navigation.scss
+++ /dev/null
@@ -1,589 +0,0 @@
-#logo {
- color: $white;
-}
-
-#logout {
- color: $white;
- cursor: pointer;
-}
-
-#user-settings-box {
- position: fixed;
- z-index: 10;
-
- & > div {
- position: fixed;
- left: 70px;
- bottom: 0px;
- z-index: 1;
- padding: 10px 16px 10px 18px;
- background-color: rgba($dark_slate_gray, 0.9);
- min-width: 230px;
-
- &.extra-bottom-space {
- bottom: 33px;
- }
-
- header {
- border-bottom: 1px solid white;
- margin-bottom: 10px;
- }
-
- #user-settings-close {
- float: right;
- }
-
- h1, i {
- font-size: 1.2em;
- color: white;
- line-height: 1.2em;
- }
-
- h2 {
- font-size: 1.1em;
- color: white;
- line-height: 1.1em;
- display: inline;
- margin-left: 5px;
- }
-
- i.fa-user {
- margin-right: 10px;
- float: left;
- }
-
- i.fa-close {
- margin-left: 10px;
- float: right;
- cursor: pointer;
- }
-
- p {
- font-size: 1.1em;
- color: $light_orange;
- }
- }
-}
-
-@keyframes hideshow {
- 0% {
- fill: lighten($logo_color, 30);
- }
-
- 25% {
- opacity: 1;
- }
-
- 100% {
- opacity: 0;
- }
-}
-
-.logo-part-animation-off {
- animation: none;
-}
-
-.logo-part-animation-on {
- animation: hideshow 0.6s ease infinite;
- opacity: 1;
-
- &:nth-child(2) {
- opacity: 0;
- animation-delay: 0.1s;
- }
-
- &:nth-child(3) {
- animation-delay: 0.2s;
- }
-
- &:nth-child(4) {
- animation-delay: 0.3s;
- }
-
- &:nth-child(5) {
- animation-delay: 0.4s;
- }
-
- &:nth-child(6) {
- animation-delay: 0.5s;
- }
-}
-
-.arrow-box:before {
- right: 100%;
- top: 65%;
- border: 20px solid transparent;
- content: " ";
- height: 0;
- width: 0;
- position: absolute;
- pointer-events: none;
- border-right-color: rgba($dark_slate_gray, 0.9);
- margin-top: -20px;
-}
-
-.side-nav-toggle, .side-nav-toggle-icon {
- color: white;
- cursor: pointer;
-
- &:hover, &:focus {
- color: white;
- }
-
- background: $navigation_background;
-
- &.logout {
- color: $action_buttons;
- }
-}
-
-.side-nav-toggle-icon {
- padding: 6px 0px 8px 19px;
- display: block;
- left: 0;
- top: 0;
- position: relative;
-
- .fa-navicon {
- font-size: 24px;
- &:before {
- margin-left: -5px;
- }
- }
-}
-
-.left-off-canvas-logo {
- svg {
- width: 162px;
- height: 56px;
- padding-left: 6px;
- padding-top: 2px;
-
- path, polygon, rect {
- fill: $logo_color;
- }
- }
-}
-
-.collapsed-nav {
- width: 50px;
- position: absolute;
- height: 100vh;
- background: $navigation_background;
-
- ul.shortcuts {
- li {
- position: relative;
- margin-bottom: 5px;
- opacity: 0.8;
-
- &.selected {
- background: $contrast;
- opacity: 1;
- cursor: default;
-
- a {
- color: $navigation_background;
- }
- }
-
- @include searching(6px, 26px, $medium_dark_grey, 0.9em);
-
- a {
- display: block;
- position: relative;
- font-size: 1.4em;
- padding: 5px;
- color: white;
- text-align: center;
-
- &:hover {
- background: darken($contrast, 10%);
- color: $navigation_background;
-
- @include btn-transition;
-
- &.logout {
- color: $black;
- background: $action_buttons;
- }
- }
-
- &[title]:hover:after {
- content: attr(title);
-
- @include tooltip;
- }
- }
- }
- }
-
- #custom-tags-shortcuts {
- li {
- border-top: 1px solid $lighter_gray;
- }
- }
-
- div.shortcut-label {
- font-size: xx-small;
- text-transform: uppercase;
- text-align: center;
- }
-}
-
-.move-right {
- ul.shortcuts {
- li {
- display: none;
- }
- }
-}
-
-.left-off-canvas-menu {
- width: 222px;
- -webkit-backface-visibility: hidden;
- box-sizing: content-box;
- left: 0;
- top: 0;
- bottom: 0;
- position: absolute;
- overflow-y: auto;
-}
-
-.left-off-canvas-menu * {
- -webkit-backface-visibility: hidden;
-}
-
-.off-canvas-wrap {
- -webkit-backface-visibility: hidden;
- position: relative;
- width: 100%;
- overflow: hidden;
-}
-
-.off-canvas-wrap.move-right, .off-canvas-wrap.move-left {
- min-height: 100%;
- -webkit-overflow-scrolling: touch;
-}
-
-.inner-wrap {
- -webkit-backface-visibility: hidden;
- width: 100%;
-}
-
-.inner-wrap:before, .inner-wrap:after {
- content: " ";
- display: table;
-}
-
-.inner-wrap:after {
- clear: both;
-}
-
-.off-canvas-wrap.content {
- -webkit-ransition: -webkit-transform 500ms ease;
- -moz-transition: -moz-transform 500ms ease;
- -ms-transition: -ms-transform 500ms ease;
- -o-transition: -o-transform 500ms ease;
- transition: transform 500ms ease;
-
- &.move-right {
- -webkit-transform: translate3d(10rem, 0, 0);
- -moz-transform: translate3d(10rem, 0, 0);
- -ms-transform: translate3d(10rem, 0, 0);
- -o-transform: translate3d(10rem, 0, 0);
- transform: translate3d(10rem, 0, 0);
-
- #user-settings-box > div {
- left: 20px;
- }
- }
-}
-
-.move-right .exit-off-canvas {
- -webkit-backface-visibility: hidden;
- transition: background 300ms ease;
- cursor: pointer;
- display: block;
- position: absolute;
- background: rgba(255, 255, 255, 0.2);
- top: 0;
- bottom: 0;
- left: 0;
- right: 0;
- -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
-}
-
-@media only screen and (min-width: 40.063em) {
- .move-right .exit-off-canvas:hover {
- background: rgba(255, 255, 255, 0.05);
- }
-}
-
-.off-canvas-wrap.move-right.menu {
- position: absolute;
-}
-
-.off-canvas-wrap.content {
- left: 50px;
- padding-right: 50px;
-}
-
-.offcanvas-overlap .left-off-canvas-menu, .offcanvas-overlap .right-off-canvas-menu {
- -ms-transform: none;
- -webkit-transform: none;
- -moz-transform: none;
- -o-transform: none;
- transform: none;
-}
-
-.offcanvas-overlap .exit-offcanvas-menu {
- -webkit-backface-visibility: hidden;
- transition: background 300ms ease;
- cursor: pointer;
- display: block;
- position: absolute;
- background: rgba(255, 255, 255, 0.2);
- top: 0;
- bottom: 0;
- left: 0;
- right: 0;
- -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
-}
-
-div.side-nav-bottom {
- width: 100%;
- position: fixed;
- bottom: 20px;
- background-color: $navigation_background;
-
- .version {
- padding-left: 55px;
- padding-bottom: 3px;
- }
-}
-
-#left-pane nav {
- border-right: 1px solid lighten($navigation_background, 10%);
-
- ul#default-tag-list, #custom-tag-list {
- li {
- transition: background-color 150ms ease-out;
- padding: 2px 10px;
- cursor: pointer;
-
- &:hover {
- background: $light_gray;
- color: $navigation_background;
- }
-
- &.selected {
- font-weight: bold;
- background: $contrast;
- color: $navigation_background;
- }
- }
- }
-
- ul#default-tag-list {
-
- span.tag-label {
- padding-left: 2px;
- }
-
- li {
- padding: 5px 10px 5px 18px;
- position: relative;
-
- @include searching(4px, 19px, $dark_grey, 0.7em);
-
- &:before {
- font-size: 1.5em;
- font-family: "FontAwesome";
- margin-right: 16px;
- font-weight: normal;
- position: relative;
- top: 2px;
- margin-left: -3px;
- }
-
- &:after {
- padding-left: 10px;
- }
-
- &:nth-child(1) {
- &:before {
- content: "\f01c";
- }
- }
-
- &:nth-child(2) {
- &:before {
- font-family: "icomoon";
- content: "\e900";
- margin-left: -5px;
- }
- }
-
- &:nth-child(3) {
- &:before {
- content: "\f040";
- }
- }
-
- &:nth-child(4) {
- &:before {
- content: "\f014";
- }
- }
-
- &:nth-child(5) {
- &:before {
- content: "\f187";
- margin-left: -5px;
- }
- }
- }
- }
-
- ul#custom-tag-list {
- visibility: hidden;
- opacity: 0;
- transition-duration: 500ms;
- height: 100%;
- max-height: 220px;
- overflow: auto;
- background-color: lighten($navigation_background, 1);
-
- li {
- white-space: nowrap;
- overflow: hidden;
- font-size: 0.8em;
- padding: 5px 10px 5px 15px;
-
- &.custom-tag {
- text-overflow: ellipsis;
- }
-
- span.tag-label {
- padding: 5px 20px 5px 38px;
- }
- }
-
- .unread-count, .total-count {
- padding: 1px 4px;
- position: relative;
- }
-
- }
-
- ul#custom-tag-list.expanded {
- visibility: visible;
- opacity: 1;
- }
-
- div.tags-icon {
- border-top: 1px solid white;
- padding-top: 25px;
- margin-bottom: 20px;
-
- i {
- font-size: 1.5em;
- font-family: "FontAwesome";
- margin-right: 13px;
- font-weight: normal;
- position: relative;
- top: 2px;
- left: 16px;
- }
-
- span.tag-label {
- font-size: 0.9rem;
- padding-left: 16px;
- margin-bottom: 10px;
- }
- }
-
- ul#logout, ul#feedback, ul#user-settings-icon {
- margin-bottom: 0;
-
- li {
- background-color: $navigation_background;
- padding: 5px 10px;
- position: relative;
-
- @include searching(4px, 19px, $dark_grey, 0.7em);
-
- &:hover {
- color: $navigation_background;
- }
-
- div {
- padding-left: 7px;
-
- &:before {
- font-size: 1.5em;
- font-family: "FontAwesome";
- margin-right: 13px;
- font-weight: normal;
- position: relative;
- top: 2px;
- }
- }
- }
- }
-
- ul {
- &#logout li {
- color: $action_buttons;
-
- &:hover {
- background-color: $action_buttons;
- }
- }
-
- &#user-settings-icon {
- li {
- color: white;
-
- &:hover {
- background-color: white;
- }
- }
- }
-
- &#feedback {
- margin-bottom: 0;
-
- li {
- color: $light_orange;
-
- &:hover {
- background-color: $light_orange;
- }
- }
- }
- }
-
- h3 {
- color: white;
- text-transform: uppercase;
- font-size: 0.6em;
- padding: 5px;
- font-weight: 600;
- margin: 0 10px;
- border-bottom: 1px dotted lighten($navigation_background, 10%);
- }
-}
-
-.unread-count {
- @extend .mail-count;
-
- background: $secondary_callout;
-}
-
-.total-count {
- @extend .mail-count;
-
- background: $medium_light_grey;
-}