diff --git a/app/components/BookBuilder/styles/teamManager.local.scss b/app/components/BookBuilder/styles/teamManager.local.scss index 6da74369edcd6497881a7120081e529ab8494117..eaba6609832d665a31c48670ca73c9d392b89f4e 100644 --- a/app/components/BookBuilder/styles/teamManager.local.scss +++ b/app/components/BookBuilder/styles/teamManager.local.scss @@ -1,151 +1,180 @@ -$main-grey: #D8D8D8; $dark-grey: #404040; -$light-grey: #CDCDCD; +$light-grey: #cdcdcd; +$main-grey: #d8d8d8; + +$black: #000; +$blue: #00f; +$green: #008000; +$purple: #800080; +$red: #ff0; +$white: #fff; +$yellow: #ff0; .teamManager { .separator { - height:0.1px; - clear:both; + clear: both; + height: .1px; } + .groupHeader { - border-bottom:4px solid $dark-grey; + border-bottom: 4px solid $dark-grey; padding-top: 1%; + .groupTitle { - background-color:$main-grey; - padding: 0px 80px 10px 10px; - float:left; + background-color: $main-grey; + float: left; + padding: 0 80px 10px 10px; + h1 { + color: $black !important; font-size: 22px; line-height: 25px; - color: #000 !important; - margin: 0px !important; + margin: 0 !important; position: relative; top: 10px; } } + .groupBtn { - float:right; - margin-top: 7px; background-color: $dark-grey; - border: 1px solid #fff; - cursor:pointer; + border: 1px solid $white; + color: $white; + cursor: pointer; + float: right; font-size: 16px; - padding: 0px 30px; + margin-top: 7px; + padding: 0 30px; text-align: center; - transition:border .5s ease-out 0.2s; - color:#fff; + transition: border .5s ease-out 0.2s; + &:hover { border: 1px solid $dark-grey; transition: .25s ease-in-out 0s; } + a { - color: #fff; + color: $white; text-decoration: none; + &:hover { + cursor: pointer; text-decoration: none; - cursor:pointer; } } } } .userInputContainer { + height: 30px; margin-top: 25px; - height:30px; + .usernameInput { - float:left; - width:100%!important; - border-color: #000; - border-top:none!important; - border-left:none!important; - border-right:none!important; + border-color: $black; + border-top: none !important; + border-left: none !important; + border-right: none !important; + float: left; + width: 100% !important; } + .closeUsernameBtn { - right:0px; - position:absolute; - bakground-color:#fff; - border: 1px solid $dark-grey; - text-decoration: none; - color:$dark-grey; - cursor:pointer; - text-decoration: none; + background-color: $white; + border: 1px solid $dark-grey; + color: $dark-grey; + cursor: pointer; font-size: 16px; - padding: 0px 30px; + padding: 0 30px; + position: absolute; + right: 0; + text-decoration: none; + &:hover { - border: 1px solid #fff; - transition: .25s ease-in-out 0s; background-color: $dark-grey; - color:#fff; + border: 1px solid $white; + color: $white; + transition: .25s ease-in-out 0s; } } + .addUsernameBtn { - float:right; - position:absolute; - margin-top:0px; - right:80px; background-color: $dark-grey; - border: 1px solid #fff; - cursor:pointer; - text-decoration: none; + border: 1px solid $white; + color: $white; + cursor: pointer; + float: right; font-size: 16px; - padding: 0px 30px; + margin-top: 0; + padding: 0 30px; + position: absolute; + right: 80px; text-align: center; - transition:border .5s ease-out 0.2s; - color:#fff; + text-decoration: none; + transition: border .5s ease-out .2s; + &:hover { border: 1px solid $dark-grey; transition: .25s ease-in-out 0s; } + a { - color: #fff; + color: $white; text-decoration: none; + &:hover { + cursor: pointer; text-decoration: none; - cursor:pointer; } } } - .successGroup{ - color: green; + + .successGroup { + color: $green; } - .failureGroup{ - color: red; + + .failureGroup { + color: $red; } } .teamMembersContainer { li { - height:50px; - border-bottom:1px solid; - span { - position:absolute; - left:0px; - margin-top:24px; - font-size: 18px; - } + border-bottom: 1px solid; + height: 50px; + + span { + font-size: 18px; + left: 0; + margin-top: 24px; + position: absolute; + } + a { + color: $main-grey; + cursor: pointer; + float: right; + margin-top: 24px; + position: absolute; + right: 0; text-decoration: none; - cursor:pointer; - float:right; - position:absolute; - margin-top:24px; - right:0px; - color:$main-grey; } } + .blue { - border-color: blue!important; + border-color: $blue; } + .purple { - border-color: purple!important; + border-color: $purple !important; } + .yellow { - border-color: yellow!important; + border-color: $yellow !important; } } + .groupSeperator { + clear: both; height: 20px; - clear:both; } -} \ No newline at end of file +}