Skip to content

Commit 7134d35

Browse files
BipinKalraBipinKalra
authored
Merge pull request #446 from BipinKalra/main_website
Main website
2 parents 77eb3bd + c1e7df8 commit 7134d35

File tree

11 files changed

+186
-1
lines changed

11 files changed

+186
-1
lines changed

‎examples/views/coding-blocks/buttons.hbs

Lines changed: 13 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,13 @@
1+
<div class="a-cbm p-5" style="background: #08090C;">
2+
<h2 class="white mb-4">Primary Button States</h2>
3+
<button class="button-primary">Primary Button</button>
4+
<button class="button-primary disabled">Primary Button</button>
5+
6+
<h2 class="white mt-5 mb-4">Secondary Button States</h2>
7+
<button class="button-secondary">Secondary Button</button>
8+
<button class="button-secondary disabled">Secondary Button</button>
9+
10+
<h2 class="white mt-5 mb-4">Secondary Button States</h2>
11+
<button class="button-tertiary">Tertiary Button</button>
12+
<button class="button-tertiary disabled">Tertiary Button</button>
13+
</div>

‎examples/views/index.hbs

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -22,6 +22,7 @@
2222
<div class="py-2 px-4 text-ellipses"><a target="preview" class="font-sm" href="cbhire.html">cbhire</a></div>
2323
<div class="py-2 px-4 text-ellipses"><a target="preview" class="font-sm" href="code-editor.html">code-editor</a></div>
2424
<div class="py-2 px-4 text-ellipses"><a target="preview" class="font-sm" href="code-window.html">code-window</a></div>
25+
<div class="py-2 px-4 text-ellipses"><a target="preview" class="font-sm" href="buttons.html">buttons</a></div>
2526
<div class="py-2 px-4 text-ellipses"><a target="preview" class="font-sm" href="competition-card.html">competition-card</a></div>
2627
<div class="py-2 px-4 text-ellipses"><a target="preview" class="font-sm" href="competition.html">competition</a></div>
2728
<div class="py-2 px-4 text-ellipses"><a target="preview" class="font-sm" href="course-card-new.html">course-card-new</a></div>

‎examples/views/layouts/default.hbs

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -7,6 +7,7 @@
77
<link href="stylesheets/account.css" rel="stylesheet">
88
<link href="stylesheets/hb.css" rel="stylesheet">
99
<link href="stylesheets/hiringblocks.css" rel="stylesheet">
10+
<link href="stylesheets/coding-blocks.css" rel="stylesheet">
1011
<link href="https://fonts.googleapis.com/css?family=Nunito+Sans:400,600,700,800" rel="stylesheet">
1112
<link href="https://minio.codingblocks.com/motley/Gilroy.ttf" rel="stylesheet">
1213
<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.0.10/css/all.css" integrity="sha384-+d0P83n9kaQMCwj8F4RJB66tzIwOKmrdb46+porD/OvrJ+37WqIM7UoBtwHO6Nlg" crossorigin="anonymous">

‎motley.config.json

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -4,6 +4,7 @@
44
"online-cb",
55
"dukaan",
66
"account",
7-
"hiringblocks"
7+
"hiringblocks",
8+
"coding-blocks"
89
]
910
}

‎sass/styles/_applications.scss

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -3,3 +3,4 @@
33
@import "applications/online-cb/online-cb";
44
@import "applications/accounts/accounts";
55
@import "applications/hiringblocks/hiringblocks";
6+
@import "applications/coding-blocks/coding-blocks";

‎sass/styles/applications/coding-blocks/_application.scss

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,3 @@
1+
.a-cbm {
2+
@import "buttons.scss";
3+
}

‎sass/styles/applications/coding-blocks/_components.scss

Whitespace-only changes.

‎sass/styles/applications/coding-blocks/_settings.scss

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1 @@
1+
@import "settings/colors.scss";

‎sass/styles/applications/coding-blocks/app.scss

Lines changed: 19 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,19 @@
1+
@import "../../settings/settings.color";
2+
@import "../../settings/settings.global";
3+
@import "../../settings/settings.font";
4+
@import "settings";
5+
@import "../../tools";
6+
@import "../../generic/normalize";
7+
@import "../../generic/reset";
8+
@import "../../utilities";
9+
@import "../../animations";
10+
@import "../../elements";
11+
@import "../../objects";
12+
@import "../../components";
13+
@import "../../media-query";
14+
15+
//TODO: OPTION TO SELECT THEME AND INSERT THAT THEME HERE
16+
@import "../../themes";
17+
@import "application";
18+
@import "components";
19+
@import "../../trumps";

‎sass/styles/applications/coding-blocks/buttons.scss

Lines changed: 84 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,84 @@
1+
%button {
2+
font-size: $font-sm;
3+
padding: 1rem 2rem;
4+
color: $white;
5+
border-radius: 5px;
6+
}
7+
8+
.button-primary {
9+
@extend %button;
10+
11+
background: $button-gradient-orange;
12+
background-size: 200%;
13+
transition: background-position 0.25s;
14+
15+
&:hover {
16+
background-position: right;
17+
}
18+
19+
&:active {
20+
background: $gradient-orange-dark;
21+
}
22+
23+
&:focus {
24+
background: $gradient-orange-dark;
25+
border: 1px solid $yellow;
26+
}
27+
28+
&.disabled,
29+
&:disabled {
30+
background: $lighter-grey;
31+
cursor: auto;
32+
}
33+
}
34+
35+
.button-secondary {
36+
@extend %button;
37+
38+
border: 1px solid $white;
39+
transition: background 0.25s;
40+
41+
&:hover {
42+
background: rgba(255, 255, 255, 0.15);
43+
}
44+
45+
&:active {
46+
background: rgba(255, 255, 255, 0.3);
47+
}
48+
49+
&:focus {
50+
background: rgba(255, 255, 255, 0.3);
51+
border: 1px solid $yellow;
52+
}
53+
54+
&:disabled,
55+
&.disabled {
56+
border: 1px solid $light-grey;
57+
color: $light-grey;
58+
cursor: auto;
59+
60+
&:hover {
61+
background: unset;
62+
}
63+
}
64+
}
65+
66+
.button-tertiary {
67+
color: $dark-orange;
68+
font-size: $font-sm;
69+
transition: color 0.25s;
70+
71+
&:hover {
72+
color: $red;
73+
}
74+
75+
&:focus {
76+
color: $yellow;
77+
}
78+
79+
&:disabled,
80+
&.disabled {
81+
color: $light-grey;
82+
cursor: auto;
83+
}
84+
}

0 commit comments

Comments
 (0)