diff --git a/app/directives/challenge-tile/challenge-tile.jade b/app/directives/challenge-tile/challenge-tile.jade index 0cbb43640..561ee06b1 100644 --- a/app/directives/challenge-tile/challenge-tile.jade +++ b/app/directives/challenge-tile/challenge-tile.jade @@ -20,9 +20,10 @@ .stalled-challenge(ng-hide="challenge.userCurrentPhaseEndTime") This challenge is currently paused. .phase-action(ng-show="challenge.userAction", ng-switch="challenge.userAction") - a.tc-btn.tc-btn-s.tc-btn-wide.tc-btn-ghost.submit(ng-switch-when="Submit", ng-href="{{challenge|challengeLinks:'submit'}}") Submit + a.tc-btn.tc-btn-s.tc-btn-wide.tc-btn-ghost.submit(ng-switch-when="Submit", ng-href="{{challenge|challengeLinks:'submit'}}") Submit + a.tc-btn.tc-btn-s.tc-btn-wide.btn-danger.submit(ng-switch-when="Submit", ng-href="{{challenge|challengeLinks:'unRegister'}}") Unregister a.tc-btn.tc-btn-s.tc-btn-wide.tc-btn-ghost.submit(ng-switch-when="Appeal", ng-href="{{challenge|challengeLinks:'viewScorecards'}}") View Scorecards - a.tc-btn.tc-btn-s.tc-btn-wide.tc-btn-ghost.submit(ng-switch-when="Appeal", ng-href="{{challenge|challengeLinks:'completeAppeals'}}") Complete Appeals + a.tc-btn.tc-btn-s.tc-btn-wide.btn-danger.submit(ng-if="challenge.isSubmitter")(ng-switch-when="Appeal", ng-href="{{challenge|challengeLinks:'completeAppeals'}}") Complete Appeals .submitted(ng-switch-when="Submitted") Submitted @@ -99,8 +100,9 @@ .phase-action(ng-switch="challenge.userAction") a.tc-btn.tc-btn-s.tc-btn-wide.tc-btn-ghost.submit(ng-switch-when="Submit", ng-href="{{challenge|challengeLinks:'submit'}}") Submit + a.tc-btn.tc-btn-s.tc-btn-wide.btn-danger.submit(ng-switch-when="Submit", ng-href="{{challenge|challengeLinks:'unRegister'}}") Unregister a.tc-btn.tc-btn-s.tc-btn-wide.tc-btn-ghost.submit(ng-switch-when="Appeal", ng-href="{{challenge|challengeLinks:'viewScorecards'}}") View Scorecards - a.tc-btn.tc-btn-s.tc-btn-wide.tc-btn-ghost.submit(ng-switch-when="Appeal", ng-href="{{challenge|challengeLinks:'completeAppeals'}}") Complete Appeals + a.tc-btn.tc-btn-s.tc-btn-wide.btn-danger.submit(ng-switch-when="Appeal", ng-href="{{challenge|challengeLinks:'completeAppeals'}}") Complete Appeals .submitted(ng-switch-when="Submitted") Submitted diff --git a/app/directives/responsive-carousel/responsive-carousel.directive.js b/app/directives/responsive-carousel/responsive-carousel.directive.js index 32869d152..e8be3b79b 100644 --- a/app/directives/responsive-carousel/responsive-carousel.directive.js +++ b/app/directives/responsive-carousel/responsive-carousel.directive.js @@ -45,14 +45,10 @@ import angular from 'angular' } else if(width >= 1010) { // desktop buildCarouselSlide(5) - } else if(width < 1010 && width >= 768) { - // tablet + } else if(width < 1010) { + // tablet & mobile buildCarouselSlide(4) - } else { - // we don't need to build carousel for mobile as we show horizontal scroll - // phone - buildCarouselSlide(2) - } + } } diff --git a/app/filters/challengeLinks.filter.js b/app/filters/challengeLinks.filter.js index d68ad4f53..bae2bb304 100644 --- a/app/filters/challengeLinks.filter.js +++ b/app/filters/challengeLinks.filter.js @@ -73,6 +73,8 @@ import _ from 'lodash' return String.supplant('https://software.{domain}/review/actions/ViewProjectDetails?pid={id}', data) case 'completeAppeals': return String.supplant('https://software.{domain}/review/actions/EarlyAppeals?pid={id}', data) + case 'unRegister': + return String.supplant('https://software.{domain}/review/actions/Unregister?pid={id}', data) } } } diff --git a/app/my-dashboard/my-dashboard.jade b/app/my-dashboard/my-dashboard.jade index 18d25b980..7a185a33d 100644 --- a/app/my-dashboard/my-dashboard.jade +++ b/app/my-dashboard/my-dashboard.jade @@ -14,10 +14,11 @@ .tco.tco17 .tc-banner-placeholder.black.bg-image - .title 2017 Topcoder Open - .subtitle The Ultimate Programming & Design tournament - .description Earn your way to the USA! - a(href="http://tco17.topcoder.com/").cta.tc-btn-white.tc-btn-radius Learn More + .container + .title 2017 Topcoder Open + .subtitle The Ultimate Programming & Design tournament + .description Earn your way to the USA! + a(href="http://tco17.topcoder.com/").cta.tc-btn-white.tc-btn-radius Learn More .srms(id="srms", ui-view="srms", ng-show="dashboard.showSRMs") diff --git a/app/services/challenge.service.js b/app/services/challenge.service.js index 0a22232ce..35e5e44c4 100644 --- a/app/services/challenge.service.js +++ b/app/services/challenge.service.js @@ -67,6 +67,7 @@ import moment from 'moment' challenge.userCurrentPhase = 'Stalled' challenge.userCurrentPhaseEndTime = null challenge.userAction = null + challenge.isSubmitter = false if (phases && phases.length) { hasCurrentPhase = true @@ -96,6 +97,9 @@ import moment from 'moment' if (roles && roles.length > 0) { var submitterRole = _.findIndex(roles, function(role) { var lRole = role.toLowerCase() + if (lRole === 'submitter') { + challenge.isSubmitter = true + } return lRole === 'submitter' }) if (submitterRole === -1) { diff --git a/assets/css/directives/challenge-tile.scss b/assets/css/directives/challenge-tile.scss index 93d631bdd..1294dca38 100644 --- a/assets/css/directives/challenge-tile.scss +++ b/assets/css/directives/challenge-tile.scss @@ -248,6 +248,23 @@ challenge-tile .challenge.tile-view { .submit { margin: 12px; display: block; + text-align: center; + + &.btn-danger { + color: #e66e66; + background-color: $white; + border-color: #e66e66; + + &:hover { + background-color: #e66e66; + color: $white; + } + + &:active { + background-color: #e0493e; + box-shadow: inset 0px 1px 1px 0px rgba(0,0,0,0.30); + } + } } .submitted { @@ -393,7 +410,7 @@ challenge-tile .challenge.list-view { margin-bottom: 10px; padding: 20px 0; padding-left: 5px; - height: 110px; + min-height: 110px; border: 1px solid #E0E0E0; border-radius: 6px; box-shadow: 0 1px 3px rgba(0, 0, 0, .1); @@ -508,6 +525,23 @@ challenge-tile .challenge.list-view { .submit { display: block; margin: 6px 0; + text-align: center; + + &.btn-danger { + color: #e66e66; + background-color: $white; + border-color: #e66e66; + + &:hover { + background-color: #e66e66; + color: $white; + } + + &:active { + background-color: #e0493e; + box-shadow: inset 0px 1px 1px 0px rgba(0,0,0,0.30); + } + } } .submitted { @@ -578,7 +612,8 @@ challenge-tile .challenge.list-view { .completed-challenge { width: 100%; display: flex; - flex-direction: row; + flex-flow: row wrap; + overflow: hidden; header { flex: 2; } diff --git a/assets/css/directives/dev-challenge-user-place.scss b/assets/css/directives/dev-challenge-user-place.scss index 69f0ca8c5..b6b6ead50 100644 --- a/assets/css/directives/dev-challenge-user-place.scss +++ b/assets/css/directives/dev-challenge-user-place.scss @@ -108,6 +108,10 @@ dev-challenge-user-place { flex-direction: column; text-align: center; background-color: #F6F6F6; + @media only screen and (max-width: 767px) { + min-width: 84px; + margin-left: 5px; + } .score { margin-top: 28px; diff --git a/assets/css/directives/responsive-carousel.scss b/assets/css/directives/responsive-carousel.scss index 37ce68bd8..303230aec 100644 --- a/assets/css/directives/responsive-carousel.scss +++ b/assets/css/directives/responsive-carousel.scss @@ -8,27 +8,30 @@ margin: 0 auto; @media only screen and (max-width: 767px) { display: none; + width: auto; } - &[slide-count="1"] { - width: 170px; - } - &[slide-count="2"] { - width: 340px; - } - &[slide-count="3"] { - width: 510px; - } - &[slide-count="4"] { - width: 680px; - } - &[slide-count="5"] { - width: 850px; - } - &[slide-count="6"] { - width: 1020px; - } - &[slide-count="7"] { - width: 1190px; + @media only screen and (min-width: 768px) { + &[slide-count="1"] { + width: 170px; + } + &[slide-count="2"] { + width: 340px; + } + &[slide-count="3"] { + width: 510px; + } + &[slide-count="4"] { + width: 680px; + } + &[slide-count="5"] { + width: 850px; + } + &[slide-count="6"] { + width: 1020px; + } + &[slide-count="7"] { + width: 1190px; + } } li { @@ -96,6 +99,10 @@ .slide { display: inline-block; + + @media only screen and (max-width: 767px) { + display: block; + } } // .carousel-elem-list { @@ -107,22 +114,45 @@ position: absolute; top: 32px; left: -30px; - @include forward-slash(1px, 60px, 0, 2px, 30deg); background-color: $gray-light; @media only screen and (min-width: 768px) { top: 32px; left: -18px; + @include forward-slash(1px, 60px, 0, 2px, 30deg); } + @media only screen and (max-width: 767px) { + top: -30px; + left: 60px; + @include forward-slash(1px, 70px, 0, 2px, 90deg); + } } } } + + + ul[slide-count="3"] { + @media only screen and (min-width: 575px) { + .slide { + display: inline-block; + + &:not(:first-child) { + .carousel-elem:before { + top: 32px; + left: -18px; + @include forward-slash(1px, 60px, 0, 2px, 30deg); + } + } + } + } + } + .carousel-elem { position: relative; display: inline-block; margin-right: 65px; padding: 20px 0; + width: 130px; @media only screen and (min-width: 768px) { - width: 130px; margin-right: 35px; padding: 30px 20px; diff --git a/assets/css/directives/tc-banner.scss b/assets/css/directives/tc-banner.scss index 3cd03af54..63f1790ae 100644 --- a/assets/css/directives/tc-banner.scss +++ b/assets/css/directives/tc-banner.scss @@ -150,33 +150,47 @@ $tco-color-dark: #ea690b; background-image: url(../../images/home-hero.jpg); background-size: 100%; height: 352px; - background-position: center 40%; + background-position: center 25%; background-repeat: no-repeat; + flex-direction: row; padding-top: 50px; + + .container { + width: 50%; + display: flex; + flex-direction: column; + align-items: flex-start; + margin-left: 37px; + height: 95%; + justify-content: space-between; - .title { - margin-top: 10px; - @include sofia-pro-bold; - color: $white; - } + .title { + margin-top: 10px; + @include sofia-pro-bold; + color: $white; + } - .subtitle { - margin-top: 20px; - width: 450px; - font-size: 20px; - @extend .title; - @include sofia-pro-regular; - } + .subtitle { + margin-top: 20px; + width: 450px; + font-size: 20px; + @extend .title; + @include sofia-pro-regular; + text-align: left; + } - .description { - margin-top: 20px; - margin-bottom: 5px; - } + .description { + margin-top: 20px; + margin-bottom: 5px; + } - .cta { - margin-top: 20px; + .cta { + margin-top: 20px; + } + } + } diff --git a/assets/css/profile/subtrack.scss b/assets/css/profile/subtrack.scss index 9d057b84c..ac3cbaa51 100644 --- a/assets/css/profile/subtrack.scss +++ b/assets/css/profile/subtrack.scss @@ -16,7 +16,7 @@ margin: 30px auto 40px; .nav-right { - padding-top: 15px; + padding-top: 10px; padding-left: 15px; i:hover { cursor: pointer; @@ -108,6 +108,13 @@ } } + .page-state-header { + .page-info { + display: flex; + justify-content: center; + } + } + .subtrack-stats { // @include module-l; width: 100%; @@ -183,15 +190,15 @@ h2.detailed { margin: 30px auto 0; text-align: center; - @include sofia-pro-medium; - font-size: 18px; - line-height: 21px; - font-weight: bold; + @include sofia-pro-regular; + font-size: 24px; + line-height: 30px; text-transform: uppercase; } ul.vertical-stats { width: 90%; margin: 0 auto; + margin-top: 30px; li { @include sofia-pro-regular; font-size: 15px; @@ -329,10 +336,20 @@ } } } + @media (min-width: 768px) { .profile-subtrack-container { .content { + .page-info { + display: flex; + justify-content: center; + } + + .nav-right { + padding-top: 15px; + } + .nav { display: flex; flex-direction: row; @@ -544,3 +561,24 @@ } } + +@media only screen and (max-width: 767px) { + .profile-subtrack-container { + .content { + .tc-carousel ul { + display: block; + height: auto; + padding-bottom: 40px; + + > li { + position: relative; + text-align: center; + + .slide { + text-align: center; + } + } + } + } + } +} \ No newline at end of file diff --git a/assets/images/home-hero.jpg b/assets/images/home-hero.jpg index 29183b413..fc349afce 100644 Binary files a/assets/images/home-hero.jpg and b/assets/images/home-hero.jpg differ