Skip to content

Commit d9dc5d1

Browse files
alexisgraff5alexisgraff5
committed
Merge branch 'master' into wedBranch5
2 parents 3062998 + 0e473c2 commit d9dc5d1

11 files changed

Lines changed: 288 additions & 30 deletions

File tree

‎src/assets/imgs/Asset 23.png‎

660 Bytes
Loading

‎src/assets/scss/styles.scss‎

Lines changed: 17 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -52,6 +52,14 @@ a {
5252
font-weight: 400;
5353
}
5454

55+
.font17-reg {
56+
color: white;
57+
font-family: $font;
58+
font-size: 17px;
59+
line-height: 21px;
60+
font-weight: 400;
61+
}
62+
5563
.font16-reg {
5664
color: white;
5765
font-family: $font;
@@ -115,20 +123,21 @@ a {
115123
font-weight: 400;
116124
}
117125

118-
/**************SIDE MENU**************/
119-
.view {
120-
display:flex;
121-
flex-direction: row;
122-
123-
}
124-
125126
.font12-reg-black {
126127
color: #131414;
127128
font-family: $font;
128129
font-size: 12px;
129130
line-height: 12px;
130131
font-weight: 400;
131132
}
133+
134+
/**************SIDE MENU**************/
135+
.view {
136+
display:flex;
137+
flex-direction: row;
138+
139+
}
140+
132141
.side-menu {
133142
background-color: $sidebar-color;
134143
height: 100%;
@@ -178,7 +187,7 @@ flex-direction: row;
178187

179188
.main {
180189
height: 100vh;
181-
width: 100vw;
190+
width: calc(100vw-55px);
182191
background-color: $main-background;
183192
display: flex;
184193
}

‎src/components/kata_list/kata_list.html‎

Lines changed: 20 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1 +1,20 @@
1-
<div ng-init="init()"></div>
1+
<section ng-init="init()" class="kata-list">
2+
3+
<div class="tiny-marker">
4+
<p class="font14-reg-gray">Kata</p>
5+
</div>
6+
7+
<div class="kata-list-main">
8+
9+
<div class="kata-list-top">
10+
<div class="section-selector-kata font13-reg-gray" ng-click="showLibrary()"><img id="arrow-icon-kata-list" src="./assets/imgs/arrow_icon.png"/>Library</div>
11+
<div class="section-selector-kata font13-reg-gray" ng-click="showCollections()">Collections</div>
12+
</div>
13+
14+
<library ></library>
15+
16+
</div>
17+
18+
19+
20+
</section>

‎src/components/kata_list/kata_list.scss‎

Lines changed: 119 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,119 @@
1+
/************ KATA_LIST ***********/
2+
3+
/******** VARIABLES *********/
4+
$sidebar-color: #222222;
5+
$main-background: #303133;
6+
$container1: #262729;
7+
$container2: #2B2C2E;
8+
$container3: #3C3C3C;
9+
$container4: #1D1D1F;
10+
$blueContainer: #363749;
11+
$button1: #1E1F21;
12+
$selectedButton: #444547;
13+
14+
$font: 'Lato', sans-serif;
15+
16+
$yellow-color: #ECB613;
17+
$blue-color: #6795DE;
18+
$orange-color: #CF4B32;
19+
$clone-wars-color: rgb(217, 217, 217);
20+
$grey-color: #C0C0C0;
21+
22+
23+
/************ ACTUAL KATA LIST STYLES **********/
24+
// I can't figure out why this isn't working. Only certain changes actually affect the div.
25+
.tiny-marker {
26+
background-color: $container1;
27+
position: absolute;
28+
top: 0;
29+
margin-top: 0;
30+
margin-left: 15px;
31+
height: 6vh;
32+
width: 7vh;
33+
display: flex;
34+
justify-content: center;
35+
align-items: center;
36+
}
37+
38+
.kata-list-main {
39+
margin-top: 30px;
40+
display: flex;
41+
flex-direction: column;
42+
}
43+
44+
/************ KATA_LIST TOP BAR **********/
45+
46+
.kata-list-top {
47+
width: calc(100vw - 55px);
48+
height: 10vh;
49+
display: flex;
50+
align-items: flex-end;
51+
justify-content: flex-start;
52+
border-bottom: 1px solid $selectedButton;
53+
}
54+
55+
.section-selector-kata {
56+
width: 100px;
57+
height: 40px;
58+
display: flex;
59+
justify-content: center;
60+
align-items: center;
61+
}
62+
63+
#arrow-icon-kata-list {
64+
height: 15px;
65+
width: 15px;
66+
margin-right: 5px;
67+
}
68+
69+
.kata-list-body {
70+
padding: 20px;
71+
display: flex;
72+
margin: 0;
73+
}
74+
75+
.kata-list-left {
76+
width: 15vw;
77+
// height: 100vh;
78+
background-color: red;
79+
margin-right: 15px;
80+
}
81+
82+
#kata-search {
83+
width: 15vw;
84+
}
85+
86+
.kata-list-right {
87+
width: 85vw;
88+
background-color: blue;
89+
}
90+
91+
/************* INDIVIDUAL KATA DIV *********/
92+
.individual-kata {
93+
display: flex;
94+
justify-content: space-between;
95+
align-items: center;
96+
border-bottom: 1px solid $grey-color;
97+
height: 118px;
98+
}
99+
100+
.indv-kata-top {
101+
display: flex;
102+
flex-direction: row;
103+
align-items: center;
104+
}
105+
106+
#kata-name {
107+
margin-left: 10px;
108+
}
109+
110+
.kata-stats {
111+
display: flex;
112+
align-items: center;
113+
}
114+
115+
.kata-stats-info {
116+
color: $grey-color;
117+
margin-top: 10px;
118+
margin-left: 5px;
119+
}

‎src/components/kata_list/library.html‎

Lines changed: 34 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,34 @@
1+
<div class="kata-list-body">
2+
<div class="kata-list-left">
3+
4+
<div class="kata-search">
5+
<input id='kata-search' ng-model="searchText" placeholder="Search">
6+
</div>
7+
</div>
8+
9+
<div class="kata-list-right">
10+
11+
<div class="individual-kata">
12+
13+
<div class="indv-kata-left">
14+
<div class="indv-kata-top">
15+
<img id="difficulty-icon" src="./assets/imgs/6_kyu_icon.png" alt="6kyu">
16+
<h3 class="font17-reg" id="kata-name">Kata Name</h3>
17+
</div>
18+
<div class="kata-stats">
19+
<i class="fa fa-star-o kata-stats-info" aria-hidden="true"></i>
20+
<p class="kata-stats-info">2</p>
21+
<i class="" aria-hidden="true"></i>
22+
</div>
23+
<div class="indv-kata-tags">
24+
<p class="kata-stats-info">Here's where tags go</p>
25+
</div>
26+
</div>
27+
28+
<div class="individual-kata-languages">
29+
<img id="difficulty-icon" src="./assets/imgs/6_kyu_icon.png" alt="">
30+
</div>
31+
32+
</div>
33+
</div>
34+
</div>

‎src/components/kata_list/libraryDirective.js‎

Lines changed: 7 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,7 @@
1+
/************* LIBRARY DIRECTIVE *************/
2+
3+
angular.module('app').directive('library', function() {
4+
return {
5+
templateUrl: './components/kata_list/library.html'
6+
}
7+
});

‎src/components/mainService.js‎

Lines changed: 10 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -4,7 +4,9 @@ angular.module('app').service('mainService', function($http, $q, $sce) {
44

55
// $sce.trustAsResourceUrl('/s');
66

7-
this.user = {}
7+
// Dumby information so I don't have to mess with the server all the time.
8+
// this.user = {id: 4, github_id: "20197415", name: "Steven", email: null, picture_url: "https://avatars.githubusercontent.com/u/20197415?v=3", username: "Steven-Nagie"};
9+
this.user = {};
810

911
// POST
1012
this.testExamples = (solution, examples) => {
@@ -71,14 +73,14 @@ this.user = {}
7173
this.getRandomKata = (userid) => { // eventually we will want it to return a random kata based on the users experience. THAT IS WHY THERE IS AN ID PARAM
7274
return $http({
7375
method: 'GET',
74-
url: `/api/random-kata`
76+
url: `/api/random-kata`
7577
});
7678
};
7779

7880
this.getRandomKataList = (userid) => {
7981
return $http({
8082
method: 'GET',
81-
url: `/api/random-kata-list`
83+
url: `/api/random-kata-list`
8284
});
8385
}
8486

@@ -90,11 +92,15 @@ this.user = {}
9092
});
9193
};
9294

93-
// solutionsCtrl
95+
// solutionsCtrl
9496
this.getKataSolutions = (kataid) => {
9597
return $http({
9698
method: 'GET',
99+
<<<<<<< HEAD
100+
url: `/api/kata-random/` + kyu
101+
=======
97102
url: `/api/solutions/` + kataid
103+
>>>>>>> master
98104
});
99105
};
100106

‎src/components/profile/profile.html‎

Lines changed: 26 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,26 @@
1+
<section class="profile-main">
2+
3+
<div class="profile-banner">
4+
5+
</div>
6+
7+
<div class="profile-ads">
8+
9+
</div>
10+
11+
<div class="profile-big">
12+
<div class="profile-big-head">
13+
<div class="section-selector font13-reg-gray" ng-click="showStats()">Stats</div>
14+
<div class="section-selector font13-reg-gray" ng-click="showKata()">Kata</div>
15+
<div class="section-selector font13-reg-gray" ng-click="showSolutions()">Solutions</div>
16+
<div class="section-selector font13-reg-gray" ng-click="showTranslations()">Translations</div>
17+
<div class="section-selector font13-reg-gray" ng-click="showCollections()">Collections</div>
18+
<div class="section-selector font13-reg-gray" ng-click="showKumite()">Kumite</div>
19+
<div class="section-selector font13-reg-gray" ng-click="showSocial()">Social</div>
20+
<div class="section-selector font13-reg-gray" ng-click="showDiscourse()">Discourse</div>
21+
</div>
22+
<hr>
23+
</div>
24+
25+
26+
</section>

‎src/components/profile/profile.scss‎

Lines changed: 51 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,51 @@
1+
/************* PROFILE **********/
2+
3+
/******** VARIABLES *********/
4+
$sidebar-color: #222222;
5+
$main-background: #303133;
6+
$container1: #262729;
7+
$container2: #2B2C2E;
8+
$container3: #3C3C3C;
9+
$container4: #1D1D1F;
10+
$blueContainer: #363749;
11+
$button1: #1E1F21;
12+
13+
$font: 'Lato', sans-serif;
14+
15+
$yellow-color: #ECB613;
16+
$blue-color: #6795DE;
17+
$orange-color: #CF4B32;
18+
$clone-wars-color: rgb(217, 217, 217);
19+
$grey-color: #C0C0C0;
20+
21+
.profile-main {
22+
display: flex;
23+
flex-direction: column;
24+
justify-content: center;
25+
align-items: center;
26+
}
27+
28+
.profile-banner, .profile-ads, .profile-big {
29+
margin-vertical: 10vh;
30+
}
31+
32+
.profile-banner {
33+
background-color: $container4;
34+
height: 10vh;
35+
width: 10vw;
36+
}
37+
38+
.profile-big-head {
39+
display: flex;
40+
flex-direction: row;
41+
42+
}
43+
44+
.section-selector {
45+
background-color: $container1;
46+
width: 120px;
47+
height: 40px;
48+
display: flex;
49+
justify-content: center;
50+
align-items: center;
51+
}

‎src/components/profile/profileCtrl.js‎

Lines changed: 4 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -2,4 +2,7 @@
22

33
angular.module('app').controller('profileCtrl', function($scope, $state, mainService) {
44

5-
});
5+
$scope.user = mainService.user;
6+
console.log($scope.user);
7+
8+
});

0 commit comments

Comments
 (0)