From 3c75af82c98cb55812b489d3d48b3c976b08aa6e Mon Sep 17 00:00:00 2001 From: Sanji515 Date: Thu, 20 Jun 2019 23:39:50 +0530 Subject: [PATCH 1/4] Modify the challenge participant page - For terms and conditions modal, created a new component as a child of challengeparticipate component --- src/app/app.component.html | 2 + src/app/app.component.ts | 16 + src/app/app.module.ts | 8 +- .../challengeparticipate.component.html | 17 +- .../challengeparticipate.component.scss | 13 - .../terms-and-conditions-modal.component.html | 28 + .../terms-and-conditions-modal.component.scss | 29 + ...rms-and-conditions-modal.component.spec.ts | 25 + .../terms-and-conditions-modal.component.ts | 94 +++ .../teamlist/teamlist.component.html | 107 ++- .../teamlist/teamlist.component.scss | 106 +-- .../teamlist/teamlist.component.ts | 65 +- .../forcelogin/forcelogin.component.html | 4 +- .../forcelogin/forcelogin.component.scss | 10 - .../utility/input/input.component.scss | 2 +- .../selectphase/selectphase.component.scss | 48 -- src/app/services/global.service.ts | 79 ++- src/styles/base.scss | 613 +++++++++++++++++- 18 files changed, 1054 insertions(+), 212 deletions(-) create mode 100644 src/app/components/challenge/challengeparticipate/terms-and-conditions-modal/terms-and-conditions-modal.component.html create mode 100644 src/app/components/challenge/challengeparticipate/terms-and-conditions-modal/terms-and-conditions-modal.component.scss create mode 100644 src/app/components/challenge/challengeparticipate/terms-and-conditions-modal/terms-and-conditions-modal.component.spec.ts create mode 100644 src/app/components/challenge/challengeparticipate/terms-and-conditions-modal/terms-and-conditions-modal.component.ts diff --git a/src/app/app.component.html b/src/app/app.component.html index e2b9dfc6e..532f0bb8b 100644 --- a/src/app/app.component.html +++ b/src/app/app.component.html @@ -4,3 +4,5 @@ + + diff --git a/src/app/app.component.ts b/src/app/app.component.ts index 94a97468e..e5fdc2897 100644 --- a/src/app/app.component.ts +++ b/src/app/app.component.ts @@ -20,11 +20,15 @@ export class AppComponent implements OnInit, OnDestroy { isLoading = false; confirmParams = { isConfirming: false}; modalParams = { isModalVisible: false}; + editPhaseModalParams = { isEditPhaseModalVisible: false}; + termsAndConditionsModalParams = { isTermsAndConditionsModalVisible: false }; globalServiceSubscription: any; globalLogoutTrigger: any; globalLoadingSubscription: any; globalConfirmSubscription: any; globalModalSubscription: any; + globalEditPhaseModalSubscription: any; + globalTermsAndConditionsModalSubscription: any; globalServiceSubscriptionScrollTop: any; /** @@ -90,6 +94,18 @@ export class AppComponent implements OnInit, OnDestroy { }, 0); }); + this.globalEditPhaseModalSubscription = this.globalService.editPhaseModalParams.subscribe(params => { + setTimeout(() => { + this.editPhaseModalParams = params; + }, 0); + }); + + this.globalTermsAndConditionsModalSubscription = this.globalService.termsAndConditionsModalParams.subscribe(params => { + setTimeout(() => { + this.termsAndConditionsModalParams = params; + }, 0); + }); + this.globalServiceSubscriptionScrollTop = this.globalService.scrolltop.subscribe(() => { SELF.document.body.scrollTop = SELF.document.documentElement.scrollTop = 0; }); diff --git a/src/app/app.module.ts b/src/app/app.module.ts index d1c76ab13..fcf2a7a2c 100644 --- a/src/app/app.module.ts +++ b/src/app/app.module.ts @@ -61,6 +61,9 @@ import { PartnersComponent } from './components/home/partners/partners.component import { RulesComponent } from './components/home/rules/rules.component'; import { TestimonialsComponent } from './components/home/testimonials/testimonials.component'; import { FeaturedChallengesComponent } from './components/home/featured-challenges/featured-challenges.component'; +import { EditphasemodalComponent } from './components/challenge/challengephases/editphasemodal/editphasemodal.component'; +import { ChallengeviewallsubmissionsComponent } from './components/challenge/challengeviewallsubmissions/challengeviewallsubmissions.component'; +import { TermsAndConditionsModalComponent } from './components/challenge/challengeparticipate/terms-and-conditions-modal/terms-and-conditions-modal.component'; @NgModule({ declarations: [ @@ -108,7 +111,10 @@ import { FeaturedChallengesComponent } from './components/home/featured-challeng PartnersComponent, RulesComponent, TestimonialsComponent, - FeaturedChallengesComponent + FeaturedChallengesComponent, + EditphasemodalComponent, + ChallengeviewallsubmissionsComponent, + TermsAndConditionsModalComponent ], imports: [ BrowserModule, diff --git a/src/app/components/challenge/challengeparticipate/challengeparticipate.component.html b/src/app/components/challenge/challengeparticipate/challengeparticipate.component.html index 6e5cd5e63..02ba95dac 100644 --- a/src/app/components/challenge/challengeparticipate/challengeparticipate.component.html +++ b/src/app/components/challenge/challengeparticipate/challengeparticipate.component.html @@ -1,10 +1,17 @@ -
-
- Sorry, The Challenge is not active! +
+
+
+ Sorry, The Challenge is not active! +
- - +
+ + +
+
+

You have already participated in the challenge with a team!

+
diff --git a/src/app/components/challenge/challengeparticipate/challengeparticipate.component.scss b/src/app/components/challenge/challengeparticipate/challengeparticipate.component.scss index 4517c346b..e69de29bb 100644 --- a/src/app/components/challenge/challengeparticipate/challengeparticipate.component.scss +++ b/src/app/components/challenge/challengeparticipate/challengeparticipate.component.scss @@ -1,13 +0,0 @@ -@import './variables.scss'; -@import './mixins.scss'; - -.challenge-participate-container { - padding:20px; - padding-left:40px; - overflow:auto; - .inactive { - font-size:$fs-18; - color:$gray-darker; - font-weight:$fw-regular; - } -} \ No newline at end of file diff --git a/src/app/components/challenge/challengeparticipate/terms-and-conditions-modal/terms-and-conditions-modal.component.html b/src/app/components/challenge/challengeparticipate/terms-and-conditions-modal/terms-and-conditions-modal.component.html new file mode 100644 index 000000000..039b537f2 --- /dev/null +++ b/src/app/components/challenge/challengeparticipate/terms-and-conditions-modal/terms-and-conditions-modal.component.html @@ -0,0 +1,28 @@ +
+
+
+
+
+
+
{{title}}
+
+
+ + +
+ +
+
+
+
+
+
+
+
diff --git a/src/app/components/challenge/challengeparticipate/terms-and-conditions-modal/terms-and-conditions-modal.component.scss b/src/app/components/challenge/challengeparticipate/terms-and-conditions-modal/terms-and-conditions-modal.component.scss new file mode 100644 index 000000000..bd259ef1d --- /dev/null +++ b/src/app/components/challenge/challengeparticipate/terms-and-conditions-modal/terms-and-conditions-modal.component.scss @@ -0,0 +1,29 @@ +@import './variables.scss'; + +.modal-container { + .modal-card { + min-width: 240px; + max-width: 80%; + width: 80%; + max-height: 80%; + padding: 0px; + + .terms-content { + margin-bottom: 15px; + } + + .content { + padding: 0px; + } + } +} + +ul.inline-list { + margin-top: 15px; +} + +.ev-card-body { + .modal-title { + margin-bottom: 30px; + } +} diff --git a/src/app/components/challenge/challengeparticipate/terms-and-conditions-modal/terms-and-conditions-modal.component.spec.ts b/src/app/components/challenge/challengeparticipate/terms-and-conditions-modal/terms-and-conditions-modal.component.spec.ts new file mode 100644 index 000000000..a844ff3d7 --- /dev/null +++ b/src/app/components/challenge/challengeparticipate/terms-and-conditions-modal/terms-and-conditions-modal.component.spec.ts @@ -0,0 +1,25 @@ +import { async, ComponentFixture, TestBed } from '@angular/core/testing'; + +import { TermsAndConditionsModalComponent } from './terms-and-conditions-modal.component'; + +describe('TermsAndConditionsModalComponent', () => { + let component: TermsAndConditionsModalComponent; + let fixture: ComponentFixture; + + beforeEach(async(() => { + TestBed.configureTestingModule({ + declarations: [ TermsAndConditionsModalComponent ] + }) + .compileComponents(); + })); + + beforeEach(() => { + fixture = TestBed.createComponent(TermsAndConditionsModalComponent); + component = fixture.componentInstance; + fixture.detectChanges(); + }); + + it('should create', () => { + expect(component).toBeTruthy(); + }); +}); diff --git a/src/app/components/challenge/challengeparticipate/terms-and-conditions-modal/terms-and-conditions-modal.component.ts b/src/app/components/challenge/challengeparticipate/terms-and-conditions-modal/terms-and-conditions-modal.component.ts new file mode 100644 index 000000000..1001668b5 --- /dev/null +++ b/src/app/components/challenge/challengeparticipate/terms-and-conditions-modal/terms-and-conditions-modal.component.ts @@ -0,0 +1,94 @@ +import { Component, OnInit, Input } from '@angular/core'; +import { GlobalService } from '../../../../services/global.service'; + +@Component({ + selector: 'app-terms-and-conditions-modal', + templateUrl: './terms-and-conditions-modal.component.html', + styleUrls: ['./terms-and-conditions-modal.component.scss'] +}) +export class TermsAndConditionsModalComponent implements OnInit { + + /** + * Input parameters object + */ + @Input() params: any; + + /** + * Modal title + */ + title = 'Are you sure ?'; + + /** + * Modal field label + */ + label = ''; + + /** + * Modal body + */ + content = ''; + + /** + * Modal accept button + */ + confirm = 'Yes'; + + /** + * Modal deny button + */ + deny = 'Cancel'; + + /** + * Is checked terms and conditions input + */ + termsAndConditions: any; + + /** + * Modal confirmed callback + */ + confirmCallback = () => {}; + + /** + * Modal denied callback + */ + denyCallback = () => {}; + + constructor(private globalService: GlobalService) { } + + ngOnInit() { + if (this.params) { + if (this.params['title']) { + this.title = this.params['title']; + } + if (this.params['label']) { + this.label = this.params['label']; + } + if (this.params['content']) { + this.content = this.params['content']; + } + if (this.params['confirm']) { + this.confirm = this.params['confirm']; + } + if (this.params['deny']) { + this.deny = this.params['deny']; + } + if (this.params['confirmCallback']) { + this.confirmCallback = this.params['confirmCallback']; + } + if (this.params['denyCallback']) { + this.denyCallback = this.params['denyCallback']; + } + } + } + + confirmed() { + this.globalService.hideTermsAndConditionsModal(); + this.confirmCallback(); + } + + denied() { + this.globalService.hideTermsAndConditionsModal(); + this.denyCallback(); + } + +} diff --git a/src/app/components/publiclists/teamlist/teamlist.component.html b/src/app/components/publiclists/teamlist/teamlist.component.html index e085f9205..b4e8615ad 100644 --- a/src/app/components/publiclists/teamlist/teamlist.component.html +++ b/src/app/components/publiclists/teamlist/teamlist.component.html @@ -1,31 +1,88 @@ -
-
-
-
- {{teamSelectTitle}} -
-
- -
- See More +
+
+
+
+
+ {{teamSelectTitle}} +
+
+ + +
+ See More +
+
+
{{paginationDetails.paginationMessage}}
+
    +
  • + + +
    + Team: + {{value.team_name}} +
    Created By: {{value.created_by}} +
    +
    + Team: {{value.team_name}} +
    Created By: {{value.created_by}} +
    +
    +
    • + + +
+
+
+ Create Challenge +
-
-
- Create Challenge -
-
- Participate
-
-
- {{teamCreateTitle}} -
-
-
- - - {{teamCreateButton}} +
+
+
+ {{teamCreateTitle}} +
+
+
+ + +
+ +
+
diff --git a/src/app/components/publiclists/teamlist/teamlist.component.scss b/src/app/components/publiclists/teamlist/teamlist.component.scss index d72c4bf69..af3e6f841 100644 --- a/src/app/components/publiclists/teamlist/teamlist.component.scss +++ b/src/app/components/publiclists/teamlist/teamlist.component.scss @@ -1,107 +1,13 @@ @import './variables.scss'; @import './mixins.scss'; -.teamlist-container { - padding:30px; - overflow:auto; - .card { - background:white; - border-radius:10px; - @include box-shadow(0px, 0px, 5px, 0px, $overlay-light); - display:inline-block; - margin:10px; - font-size:$fs-16; - font-weight:$fw-light; - font-color:$gray-darker; - vertical-align:top; - .card-title { - text-align:center; - font-size:$fs-18; - font-weight:$fw-regular; - padding:20px; - padding-bottom:30px; - border-bottom:1px solid $gray-light; - margin-bottom:20px; - } - .card-content { - padding:30px; - position:relative; - .see-more { - text-align:center; - margin-left:0; - } - .team-create-form { - .btn { - margin-left:0px; - } - } - } - .create-challenge { - text-align:center; - margin-left:0; - border-top:1px solid $gray-light; - margin-bottom:5px; - .btn { - &:hover { - color:white; - } - } - } - &.team-select { - width:50%; - float:left; - .card-content { - // max-height:250px; - overflow-y:scroll; - } - } - &.team-create { - width:40%; - float:right; - } - } - +.participants-team-list ul li { + margin: 20px 0; } -@include screen-medium { - .teamlist-container { - .card { - display:block; - &.team-select { - width:100%; - float:left; - margin-left:0; - } - &.team-create { - margin-left:0; - width:100%; - float:left; - } - } +.new-team-card { + padding-bottom: 40px; + .team-create-form { + margin-top: 15px; } } - -@include screen-small { - .teamlist-container { - .card { - display:block; - .card-content { - padding:20px; - } - &.team-select { - width:100%; - float:left; - margin-left:0; - .card-content { - padding:0px; - padding-bottom:10px; - } - } - &.team-create { - margin-left:0; - width:100%; - float:left; - } - } - } -} \ No newline at end of file diff --git a/src/app/components/publiclists/teamlist/teamlist.component.ts b/src/app/components/publiclists/teamlist/teamlist.component.ts index c29d2f940..ebb7c6981 100644 --- a/src/app/components/publiclists/teamlist/teamlist.component.ts +++ b/src/app/components/publiclists/teamlist/teamlist.component.ts @@ -82,6 +82,11 @@ export class TeamlistComponent implements OnInit { */ isOnChallengePage = false; + /** + * User participated + */ + isParticipated: boolean; + /** * Fetch teams URL */ @@ -112,6 +117,15 @@ export class TeamlistComponent implements OnInit { */ teamForm = 'formteam'; + /** + * @param showPagination Is pagination + * @param paginationMessage Pagination message + * @param isPrev Previous page state + * @param isNext Next page state + * @param currentPage Current Page number + */ + paginationDetails: any = {}; + /** * Form fields in the team form (team cards) */ @@ -142,6 +156,10 @@ export class TeamlistComponent implements OnInit { ngOnInit() { this.authServicePublic = this.authService; this.routerPublic = this.router; + this.challengeService.currentParticipationStatus.subscribe(status => { + this.isParticipated = status; + }); + if (this.router.url === '/teams/hosts') { this.isHost = true; this.fetchTeamsPath = 'hosts/challenge_host_team'; @@ -208,6 +226,12 @@ export class TeamlistComponent implements OnInit { return selectTeam; } + selectedParticipantTeam(team) { + const SELF = this; + SELF.selectedTeam = team; + SELF.unselectOtherTeams(SELF); + } + /** * Unselecting other teams function. */ @@ -248,6 +272,30 @@ export class TeamlistComponent implements OnInit { SELF.allTeams = SELF.appendIsSelected(SELF.allTeams); } SELF.updateTeamsView(true); + + if (data.count === 0) { + SELF.paginationDetails.showPagination = false; + SELF.paginationDetails.paginationMessage = 'No team exists for now. Start by creating a new team!'; + } else { + SELF.paginationDetails.showPagination = true; + SELF.paginationDetails.paginationMessage = ''; + } + + // condition for pagination + SELF.paginationDetails.totalPage = Math.ceil(data.count / 100); + if (data.next === null) { + SELF.paginationDetails.isNext = 'disabled'; + SELF.paginationDetails.currentPage = 1; + } else { + SELF.paginationDetails.isNext = ''; + SELF.paginationDetails.currentPage = data.next.split('page=')[1] - 1; + } + + if (data.previous === null) { + SELF.paginationDetails.isPrev = 'disabled'; + } else { + SELF.paginationDetails.isPrev = ''; + } } }, err => { @@ -413,6 +461,8 @@ export class TeamlistComponent implements OnInit { // Success Message in data.message self.globalService.showToast('success', 'Team created successfully!', 5); self.fetchMyTeams(self.fetchTeamsPath); + self.globalService.setFormValueForLabel(self.components, 'team_url', ''); + self.globalService.setFormValueForLabel(self.components, 'team_name', ''); }, err => { self.globalService.handleFormError(self.components, err); @@ -433,6 +483,19 @@ export class TeamlistComponent implements OnInit { * Participate in the challenge using selected team. */ participateInChallenge() { - this.challengeService.participateInChallenge(this.challenge['id'], this.selectedTeam['id']); + const SELF = this; + const apiCall = () => { + SELF.challengeService.participateInChallenge(SELF.challenge['id'], SELF.selectedTeam['id']); + } + + const PARAMS = { + title: 'Terms and Conditions', + label: 'I accept the terms and conditions', + content: SELF.challenge.terms_and_conditions, + confirm: 'Participate', + deny: 'Cancel', + confirmCallback: apiCall + }; + SELF.globalService.showTermsAndConditionsModal(PARAMS); } } diff --git a/src/app/components/utility/forcelogin/forcelogin.component.html b/src/app/components/utility/forcelogin/forcelogin.component.html index d26f1f6ec..ca650e88b 100644 --- a/src/app/components/utility/forcelogin/forcelogin.component.html +++ b/src/app/components/utility/forcelogin/forcelogin.component.html @@ -1,5 +1,3 @@ -
-
+
Please Login to access this section. -
diff --git a/src/app/components/utility/forcelogin/forcelogin.component.scss b/src/app/components/utility/forcelogin/forcelogin.component.scss index 091193ea7..e69de29bb 100644 --- a/src/app/components/utility/forcelogin/forcelogin.component.scss +++ b/src/app/components/utility/forcelogin/forcelogin.component.scss @@ -1,10 +0,0 @@ -@import './styles/variables.scss'; -@import './styles/mixins.scss'; - -.forcelogin-container { - .forcelogin-content { - .btn { - - } - } -} \ No newline at end of file diff --git a/src/app/components/utility/input/input.component.scss b/src/app/components/utility/input/input.component.scss index 85db47bcb..901f3ea9b 100644 --- a/src/app/components/utility/input/input.component.scss +++ b/src/app/components/utility/input/input.component.scss @@ -59,7 +59,7 @@ } } input:focus~label { - top: -20px; + top: -10px; color: $wild-blue !important; font-weight: 400; font-size: 0.8rem; diff --git a/src/app/components/utility/selectphase/selectphase.component.scss b/src/app/components/utility/selectphase/selectphase.component.scss index 6ec682b03..e69de29bb 100644 --- a/src/app/components/utility/selectphase/selectphase.component.scss +++ b/src/app/components/utility/selectphase/selectphase.component.scss @@ -1,48 +0,0 @@ -@import './variables.scss'; -@import './mixins.scss'; - -.select-phase { - display: inline-block; - text-align: left; - vertical-align: top; - float: left; - padding:10px; - max-height:700px; - width:auto; - overflow:scroll; - .phase-div { - &.inline { - display:inline-block; - margin-right:20px; - margin-top:10px; - margin-bottom:10px; - } - } - .select-title { - margin-left: 10px; - } - .card { - padding: 10px 30px 10px 30px; - cursor: pointer; - margin-left: 0; - margin-right: 0; - } - .heading { - font-weight: $fw-regular; - } - .content { - display: inline-table; - &.selectstate { - display:table-cell; - margin-right: 20px; - margin-top:10px; - color:$gray-dark; - &.single-line { - margin-top: 2px; - } - } - &.rightside { - display:table-cell - } - } -} diff --git a/src/app/services/global.service.ts b/src/app/services/global.service.ts index 78bfc7ec8..31f8df317 100644 --- a/src/app/services/global.service.ts +++ b/src/app/services/global.service.ts @@ -30,12 +30,43 @@ export class GlobalService { denyCallback: null, form: [] }; + + /** + * Edit challenge phase modal default settings + */ + isEditPhaseModalVisible = false + editPhaseModalDefault = { + isEditPhaseModalVisible: false, + confirm: 'Submit', + deny: 'Cancel', + title: 'Edit Challenge Phase Details', + confirmCallback: null, + denyCallback: null + }; + + /** + * Terms and conditions modal default settings + */ + isTermsAndConditionsModalVisible = false + termsAndConditionsModalDefault = { + isTermsAndConditionsModalVisible: false, + confirm: 'Submit', + deny: 'Cancel', + title: 'Terms and Conditions', + confirmCallback: null, + denyCallback: null + }; + private scrolledStateSource = new BehaviorSubject(this.scrolledStateDefault); currentScrolledState = this.scrolledStateSource.asObservable(); private confirmSource = new BehaviorSubject(this.confirmDefault); currentConfirmParams = this.confirmSource.asObservable(); private modalSource = new BehaviorSubject(this.modalDefault); currentModalParams = this.modalSource.asObservable(); + private editPhasemodalSource = new BehaviorSubject(this.editPhaseModalDefault); + editPhaseModalParams = this.editPhasemodalSource.asObservable(); + private termsAndConditionsSource = new BehaviorSubject(this.termsAndConditionsModalDefault); + termsAndConditionsModalParams = this.termsAndConditionsSource.asObservable(); @Output() toast: EventEmitter = new EventEmitter(); @Output() loading: EventEmitter = new EventEmitter(); @@ -161,7 +192,31 @@ export class GlobalService { } /** - * Hide Modal Component + * Display Edit Challenge Phase Modal Component + * @param params parameters for configuring edit challenge phase component (see markdown docs) + */ + showEditPhaseModal(params) { + if (!this.isEditPhaseModalVisible) { + this.isEditPhaseModalVisible = true; + const TEMP = { isEditPhaseModalVisible: true}; + this.editPhasemodalSource.next(Object.assign({}, params, TEMP)); + } + } + + /** + * Display terms and conditions Modal Component + * @param params parameters for configuring terms and conditions component (see markdown docs) + */ + showTermsAndConditionsModal(params) { + if (!this.isTermsAndConditionsModalVisible) { + this.isTermsAndConditionsModalVisible = true; + const TEMP = { isTermsAndConditionsModalVisible: true}; + this.termsAndConditionsSource.next(Object.assign({}, params, TEMP)); + } + } + + /** + * Hide Reusable Modal Component */ hideModal() { if (this.isModalVisible) { @@ -171,6 +226,28 @@ export class GlobalService { } } + /** + * Hide Edit Challenge Phase Modal Component + */ + hideEditPhaseModal() { + if (this.isEditPhaseModalVisible) { + this.isEditPhaseModalVisible = false; + const TEMP = { isEditPhaseModalVisible: false}; + this.editPhasemodalSource.next(Object.assign({}, this.editPhaseModalDefault, TEMP)); + } + } + + /** + * Hide terms and conditions Modal Component + */ + hideTermsAndConditionsModal() { + if (this.isTermsAndConditionsModalVisible) { + this.isTermsAndConditionsModalVisible = false; + const TEMP = { isTermsAndConditionsModalVisible: false}; + this.termsAndConditionsSource.next(Object.assign({}, this.termsAndConditionsModalDefault, TEMP)); + } + } + /** * This triggers the logout function in auth service (to avoid a cyclic dependency). */ diff --git a/src/styles/base.scss b/src/styles/base.scss index 6b9029278..990954499 100644 --- a/src/styles/base.scss +++ b/src/styles/base.scss @@ -30,8 +30,6 @@ body { - - /* Margins */ .ev-mt-50 { @@ -66,6 +64,31 @@ body { +/** Pad and margin*/ +.row-lr-margin { + margin-left: 0px; + margin-right: 0px; +} + +.col-lr-pad { + padding-left: 12px; + padding-right: 12px; +} + +.mb-10 { + margin-bottom: 10px; +} +.rm-margin { + margin: 0px; +} +.rm-pad { + padding: 0px; +} + +.rm-margin { + margin: 0px !important; +} + /*Font weights*/ @@ -127,6 +150,588 @@ body { } +/* Angular material select styles */ +mat-label { + color: rgba(0,0,0,0.38); + font-size: 15px; +} + +.mat-form-field-appearance-legacy .mat-form-field-underline { + background-color: rgba(0,0,0,0.12) !important; +} + +.phase-select-box { + .mat-form-field-infix { + width: 478px !important; + } +} + +.mat-select-trigger { + line-height: 24px; + letter-spacing: 0.1px; + font-size: 15px; + color: rgba(0, 0, 0, 0.87); +} + +@include screen-medium { + .phase-select-box { + .mat-form-field-infix { + width: 400px !important; + } + } +} + +@include screen-small-medium { + .phase-select-box { + .mat-form-field-infix { + width: 300px !important; + } + } +} + +@include screen-small { + .phase-select-box { + .mat-form-field-infix { + width: 220px !important; + } + } +} + +.file-select-box { + .mat-form-field-infix { + width: 61px !important; + } +} + +.all-submissions-file { + .mat-form-field-infix { + width: 144px !important; + } +} + +.custom-field-export { + .mat-form-field-infix { + width: 311px !important; + } +} + +@include screen-medium { + .download-submissions { + margin-left: 50px; + } + + .custom-field-export { + .mat-form-field-infix { + width: 270px !important; + } + } + + .all-submissions-file { + .mat-form-field-infix { + width: 110px !important; + } + } +} + +@include screen-small-medium { + .download-submissions { + margin-left: 40px; + } + + .custom-field-export { + .mat-form-field-infix { + width: 195px !important; + } + } + + .all-submissions-file { + .mat-form-field-infix { + width: 75px !important; + } + } +} + + +/**Rich text editor styles*/ +.reusable-editor.fr-box.fr-basic .fr-element { + height: 320px; +} + +.edit-phase-editor.fr-box.fr-basic .fr-element { + height: 220px; +} + +.second-toolbar a { + display: none; +} + +.editor-validation-message { + color: $highlight; + margin-bottom: 20px; +} + +/* Chip Styles */ +mat-chip-list { + display: inline-block; +} + +mat-chip { + color: #fff !important; + background: $yellow !important; + border-radius: 2px !important; + min-height: 25px !important; +} + + +/*card styles*/ + +.ev-card-panel { + position: relative; + display: block; + background-color: #fff; + width: 100%; + height: auto; + border-radius: 10px; + overflow: hidden; + box-shadow: 0px 0px 12px $shadow-black; +} + +.ev-md-container { + padding: 30px 40px 40px 40px; +} + +.bottom-card-container { + padding: 40px; +} + +.card-bt-margin { + margin-bottom: 20px; +} + +.bottom-hr-line { + border-bottom: 1px solid $gray; +} + +.ev-card-body { + padding: 10px 30px; +} + + +/* ul list styles */ + +ul { + list-style-type: none; +} + +.exist-team-card ul.collapsible { + border: 0; + box-shadow: none; +} +.exist-team-card ul.collapsible li { + box-shadow: 0 0 5px #e0e0e0; +} +.exist-team-card ul li { + margin: 20px 0px; + min-height: 40px; +} +.exist-team-card ul li .collapsible-header { + border-bottom: 0; + line-height: initial; + min-height: initial; + padding: 10px 5px; +} +.exist-team-card ul li .collapsible-header i { + display: inline-block; + float: none; + font-size: initial; + line-height: 40px; + margin-right: 0; + text-align: center; + width: 2rem; +} +.exist-team-card ul li .collapsible-body { + background-color: #fafafa; + border-top: 1px solid #e0e0e0; + padding: 10px 40px; +} +.exist-team-card ul li .collapsible-body p { + padding: 3px 0; +} +.exist-team-card i.list-icon { + line-height: 25px; +} + + +/*grad button style*/ + +.grad-btn { + border-radius: 20px; +} + +.grad-rec-btn { + border-radius: 2px !important; +} + +.grad-btn-dark { + background: $med-gray; + font-weight: $fw-regular; + color: #fff; + box-shadow: 0px 4px 8px $gray-dark; + &:hover { + box-shadow: 0px 0px 8px $gray-dark; + } +} + +.grad-btn-light { + background: $highlight; + font-weight: $fw-regular; + color: #fff; + box-shadow: 0px 4px 8px $gray-dark; + &:hover { + box-shadow: 0px 0px 8px $gray-dark; + background: $highlight; + } +} + +.grad-btn-transparent { + background-color: rgba(0,0,0,0) !important; + font-weight: $fw-regular; + color: $med-gray; + border: 1px solid $med-gray !important; + box-shadow: 0px 4px 8px transparent; + &:hover { + box-shadow: 0px 0px 8px $gray-dark !important; + background: $med-gray !important; + color: #fff; + } +} + +.btn-waves-effect { + padding: 13px 33px 13px 33px; + border: none; + position: relative; + cursor: pointer; + display: inline-block; + overflow: hidden; + user-select: none; + -webkit-tap-highlight-color: transparent; + vertical-align: middle; + z-index: 1; + will-change: opacity, transform; + transition: .3s ease-out; +} + +.ev-btn-dark { + background: #252833; +} + +.ev-file-btn-dark { + padding: 0 32px; + border: none; + background: #252833; +} + + .ev-btn-dark:hover { + background: #3c3e49; +} + + +/* checkbox styles */ +[type="checkbox"] + label { + position: relative; + padding-left: 35px; + cursor: pointer; + display: inline-block; + height: 25px; + line-height: 25px; + font-size: 1rem; + -webkit-user-select: none; + -moz-user-select: none; + -khtml-user-select: none; + -ms-user-select: none; +} + +[type="checkbox"]:not(:checked), [type="checkbox"]:checked { + position: absolute; + left: -9999px; + opacity: 0; +} + +input[type="checkbox"] { + box-sizing: border-box; + padding: 0; +} + +input[type=checkbox]+label { + color: $light-gray; + font-size: 0.8em; + font-weight: 400; +} + +input[type=checkbox].filled-in:checked+label:after { + width: 17px; + height: 17px; + border: 1px solid #ffaf4b; + background-color: #ffaf4b; +} + +[type="checkbox"].filled-in:checked + label:after { + top: 0; + width: 20px; + height: 20px; + border: 2px solid #26a69a; + background-color: #26a69a; + z-index: 0; +} + +[type="checkbox"].filled-in:checked + label:before { + top: 0; + left: 1px; + width: 8px; + height: 13px; + border-top: 2px solid transparent; + border-left: 2px solid transparent; + border-right: 2px solid #fff; + border-bottom: 2px solid #fff; + -webkit-transform: rotateZ(37deg); + transform: rotateZ(37deg); + -webkit-transform-origin: 100% 100%; + transform-origin: 100% 100%; +} + +[type="checkbox"].filled-in + label:before, [type="checkbox"].filled-in + label:after { + content: ''; + left: 0; + position: absolute; + transition: border .25s, background-color .25s, width .20s .1s, height .20s .1s, top .20s .1s, left .20s .1s; + z-index: 1; +} +[type="checkbox"].filled-in + label:after { + border-radius: 2px; +} + +input[type="checkbox"].filled-in:checked+label:after { + width: 17px; + height: 17px; + border: 1px solid $yellow; + background-color: $yellow; +} + +input[type="checkbox"]+label { + padding-left: 24px; + line-height: 20px; +} + +input[type="checkbox"].filled-in:checked+label:before { + top: 0; + left: 2px; + width: 5px; + height: 11px; +} + +input[type="checkbox"].filled-in:not(:checked)+label:after { + width: 17px; + height: 17px; + border: 1px solid $light-gray; + background-color: transparent; +} + +[type="checkbox"].filled-in:not(:checked) + label:before { + /* width: 0; */ + /* height: 0; */ + border: 3px solid transparent; + /* left: 6px; */ + /* top: 10px; */ + -webkit-transform: rotateZ(37deg); + transform: rotateZ(37deg); + -webkit-transform-origin: 20% 40%; + transform-origin: 100% 100%; +} + +[type="checkbox"].filled-in + label:before, [type="checkbox"].filled-in + label:after { + content: ''; + left: 0; + position: absolute; + transition: border .25s, background-color .25s, width .20s .1s, height .20s .1s, top .20s .1s, left .20s .1s; + z-index: 1; +} +[type="checkbox"] + label:before, [type="checkbox"]:not(.filled-in) + label:after { + content: ''; + position: absolute; + top: 0; + left: 0; + width: 18px; + height: 18px; + z-index: 0; + border: 2px solid #5a5a5a; + border-radius: 1px; + margin-top: 2px; + transition: .2s; +} +*, *:before, *:after { + box-sizing: inherit; +} +input[type=checkbox].filled-in:not(:checked)+label:after { + width: 17px; + height: 17px; + border: 1px solid #adb4d0; + background-color: transparent; +} +[type="checkbox"].filled-in:not(:checked) + label:after { + height: 20px; + width: 20px; + background-color: transparent; + border: 2px solid #5a5a5a; + top: 0px; + z-index: 0; +} +[type="checkbox"].filled-in + label:before, [type="checkbox"].filled-in + label:after { + content: ''; + left: 0; + position: absolute; + transition: border .25s, background-color .25s, width .20s .1s, height .20s .1s, top .20s .1s, left .20s .1s; + z-index: 1; +} +[type="checkbox"].filled-in + label:after { + border-radius: 2px; +} + + + +/* radio button styles */ +[type=radio]:not(:checked), [type=radio]:checked { + position: absolute; + left: -9999px; + opacity: 0; +} + +[type=radio]:not(:checked) + label, [type=radio]:checked + label { + position: relative; + padding-left: 35px; + cursor: pointer; + display: inline-block; + height: 25px; + line-height: 25px; + font-size: 1rem; + transition: .28s ease; + -webkit-user-select: none; + -moz-user-select: none; + -ms-user-select: none; + user-select: none; +} + +label { + font-size: 0.8rem; + color: #9e9e9e; +} + +[type=radio]:checked + label:after, +[type=radio].with-gap:checked + label:before, +[type=radio]:not(:checked) + label:before, +[type=radio]:not(:checked) + label:after { + border: 2px solid #5a5a5a; +} +[type=radio]:not(:checked) + label:before, +[type=radio]:not(:checked) + label:after, +[type=radio].with-gap:checked + label:before, +[type=radio].with-gap:checked + label:after { + border-radius: 50%; +} +[type=radio]:checked + label:before { + border: 2px solid transparent; +} +[type=radio] + label:before, +[type=radio] + label:after { + content: ''; + position: absolute; + left: 0; + top: 0; + margin: 4px; + width: 16px; + height: 16px; + z-index: 0; + transition: .28s ease; +} + +[type=radio].with-gap:checked + label:after { + -webkit-transform: scale(0.5); + transform: scale(0.5); +} + +[type=radio].with-gap:checked + label:after { + background-color: #252833; +} + +[type=radio]:checked + label:after, +[type=radio].with-gap:checked + label:before, +[type=radio].with-gap:checked + label:after { + border: 2px solid #252833; +} + +[type=radio]:checked + label:after { + -webkit-transform: scale(1.02); + transform: scale(1.02); +} + +[type=radio] + label:before, +[type=radio] + label:after { + content: ''; + position: absolute; + left: 0; + top: 0; + margin: 4px; + width: 16px; + height: 16px; + z-index: 0; + transition: .28s ease; +} + +*, *:before, *:after { + box-sizing: inherit; +} + +.radio-button-text { + width: calc(100% - 35px); + float: right; +} + + +/*icon colors*/ + +.red-text { + color: #F44336; +} + +.blue-text { + color: #2196F3 !important; +} + +.green-text { + color: #4CAF50; +} + +.text-highlight { + color: $yellow; +} + +.orange-background { + background-color: #ffaf4b !important; +} + +.submitted, +.finished { + color: #4CAF50; +} + +.running, +.submitting { + color: orange; +} + +.failed, +.cancelled { + color: red; +} /*anchors*/ @@ -613,12 +1218,12 @@ ul { 5px, 0px, $overlay-light); - border-radius: 10px; + border-radius: 2px; background: white; position: fixed; top: 50%; left: 50%; - z-index: 101; + z-index: 999; transform: translate(-50%, -50%); font-size: $fs-16; color: $gray-darker; From 437284f97c7658acf0cf40a56d89004bbff87b9d Mon Sep 17 00:00:00 2001 From: Sanji515 Date: Mon, 15 Jul 2019 22:36:26 +0530 Subject: [PATCH 2/4] resolved failing tests --- .../terms-and-conditions-modal.component.spec.ts | 6 +++++- 1 file changed, 5 insertions(+), 1 deletion(-) diff --git a/src/app/components/challenge/challengeparticipate/terms-and-conditions-modal/terms-and-conditions-modal.component.spec.ts b/src/app/components/challenge/challengeparticipate/terms-and-conditions-modal/terms-and-conditions-modal.component.spec.ts index a844ff3d7..d34467396 100644 --- a/src/app/components/challenge/challengeparticipate/terms-and-conditions-modal/terms-and-conditions-modal.component.spec.ts +++ b/src/app/components/challenge/challengeparticipate/terms-and-conditions-modal/terms-and-conditions-modal.component.spec.ts @@ -1,6 +1,8 @@ import { async, ComponentFixture, TestBed } from '@angular/core/testing'; import { TermsAndConditionsModalComponent } from './terms-and-conditions-modal.component'; +import { GlobalService } from '../../../../services/global.service'; +import { FormsModule } from '@angular/forms'; describe('TermsAndConditionsModalComponent', () => { let component: TermsAndConditionsModalComponent; @@ -8,7 +10,9 @@ describe('TermsAndConditionsModalComponent', () => { beforeEach(async(() => { TestBed.configureTestingModule({ - declarations: [ TermsAndConditionsModalComponent ] + imports: [ FormsModule ], + declarations: [ TermsAndConditionsModalComponent ], + providers: [ GlobalService ] }) .compileComponents(); })); From 1bc2890fe9b64dc1219d00751e3fdaa49c7c41e2 Mon Sep 17 00:00:00 2001 From: Sanji515 Date: Wed, 17 Jul 2019 20:57:50 +0530 Subject: [PATCH 3/4] removed the duplicate condition of challenge is not active and resolved conflicts --- src/app/app.component.html | 3 --- .../challengeparticipate/challengeparticipate.component.html | 5 ----- 2 files changed, 8 deletions(-) diff --git a/src/app/app.component.html b/src/app/app.component.html index 3fe9d528d..532f0bb8b 100644 --- a/src/app/app.component.html +++ b/src/app/app.component.html @@ -5,7 +5,4 @@ -<<<<<<< HEAD -======= ->>>>>>> c7bc6de72ba73abd48d3c7ca3aeda8a9651f81fc diff --git a/src/app/components/challenge/challengeparticipate/challengeparticipate.component.html b/src/app/components/challenge/challengeparticipate/challengeparticipate.component.html index 02ba95dac..c23093151 100644 --- a/src/app/components/challenge/challengeparticipate/challengeparticipate.component.html +++ b/src/app/components/challenge/challengeparticipate/challengeparticipate.component.html @@ -1,9 +1,4 @@
-
-
- Sorry, The Challenge is not active! -
-
From 2432e9ab4858bd257901509ec82a7a73b8f07e4a Mon Sep 17 00:00:00 2001 From: Sanji515 Date: Wed, 17 Jul 2019 22:03:24 +0530 Subject: [PATCH 4/4] added the challenge not active condition --- .../challengeparticipate/challengeparticipate.component.html | 5 +++++ 1 file changed, 5 insertions(+) diff --git a/src/app/components/challenge/challengeparticipate/challengeparticipate.component.html b/src/app/components/challenge/challengeparticipate/challengeparticipate.component.html index c23093151..02ba95dac 100644 --- a/src/app/components/challenge/challengeparticipate/challengeparticipate.component.html +++ b/src/app/components/challenge/challengeparticipate/challengeparticipate.component.html @@ -1,4 +1,9 @@
+
+
+ Sorry, The Challenge is not active! +
+