Skip to content

Commit e9f3c6c

Browse files
RicecoderRicecoder
committed
Merge pull request #28 from Ricecoder/feature--hamburger-menu
feature--hamburger-menu into release--0.0.2
2 parents 1791684 + 835c1d9 commit e9f3c6c

File tree

6 files changed

+124
-60
lines changed

6 files changed

+124
-60
lines changed

‎.gitignore‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -3,3 +3,4 @@
33
/bower_components
44
css
55
src/npm-debug.log
6+
npm-debug.log

‎package.json‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,12 +1,12 @@
11
{
22
"name": "ricecoder.github.io",
3-
"version": "0.0.1",
3+
"version": "0.0.2",
44
"description": "",
55
"main": "index.js",
66
"scripts": {
77
"test": "mocha",
88
"start": "browser-sync start --server --directory --files='src/index.html'",
9-
"sass": "node-sass --output-style expanded --output css/ scss/main.scss",
9+
"sass": "node-sass --output-style expanded --output src/css/ src/scss/main.scss"
1010
},
1111
"repository": {
1212
"type": "git",

‎src/index.html‎

Lines changed: 27 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -14,15 +14,40 @@
1414
<link rel="stylesheet" href="css/main.css">
1515
<!-- <script src="js/vendor/modernizr-2.8.3.min.js"></script> -->
1616
<script src="../bower_components/modernizr/bin/modernizr"></script>
17-
17+
<svg class="icon icon-menu"><use xlink:href="#icon-menu"></use></svg>
1818
</head>
1919
<body>
2020
<!--[if lt IE 8]>
2121
<p class="browserupgrade">You are using an <strong>outdated</strong> browser. Please <a href="http://browsehappy.com/">upgrade your browser</a> to improve your experience.</p>
2222
<![endif]-->
2323

2424
<!-- Add your site or application content here -->
25-
<p>Hello world! This is HTML5 Boilerplate.</p>
25+
<main class="container">
26+
<header>
27+
<h1>Welcome to my Blog</h1>
28+
29+
<nav class="hamburger-menu">
30+
<a href="#" class="menu-icon border"></a>
31+
<ul class="menu">
32+
<li>
33+
<a href="#">About</a>
34+
</li>
35+
<li>
36+
<a href="#">Portfilio</a>
37+
</li>
38+
<li>
39+
<a href="#">Tutorials</a>
40+
</li>
41+
<li>
42+
<a href="#">Blog Posts</a>
43+
</li>
44+
</ul>
45+
</header>
46+
47+
<
48+
49+
50+
</main>
2651

2752

2853
<script src="../bower_components/jquery/dist/jquery.js"></script>

‎src/scss/_common.scss‎

Lines changed: 38 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,38 @@
1+
header {
2+
background-color: teal;
3+
4+
h1 {
5+
text-align: center;
6+
color: #fff;
7+
}
8+
9+
10+
11+
.menu-icon {
12+
position: relative;
13+
display: inline-block;
14+
width: 7vw;
15+
text-indent: -999px;
16+
float: right;
17+
18+
}
19+
20+
.border {
21+
height: 30px;
22+
border-top: 10px solid blue;
23+
border-bottom: 10px solid blue;
24+
border-radius: 5%;
25+
}
26+
27+
.border::before {
28+
content: "";
29+
position: absolute;
30+
top: 10px;
31+
left: 0;
32+
width: 100%;
33+
border-top: 10px solid blue;
34+
border-radius: 5%;
35+
36+
}
37+
38+
}

‎src/scss/_grid.scss‎

Lines changed: 55 additions & 55 deletions
Original file line numberDiff line numberDiff line change
@@ -1,55 +1,55 @@
1-
2-
3-
[class*='col-'] { //selects all classes that start with 'col-'
4-
float: left;
5-
width: 8.33%;
6-
7-
}
8-
9-
.col-1 {
10-
color: red;
11-
}
12-
13-
.col-2 {
14-
color: pink;
15-
}
16-
17-
.col-3 {
18-
color: orange;
19-
}
20-
21-
.col-4 {
22-
color: gold;
23-
}
24-
25-
.col-5 {
26-
color: yellow;
27-
}
28-
29-
.col-6 {
30-
color: lime;
31-
}
32-
33-
.col-7 {
34-
color: green;
35-
}
36-
37-
.col-8 {
38-
color: teal;
39-
}
40-
41-
.col-9 {
42-
color: blue;
43-
}
44-
45-
.col-10 {
46-
color: navy;
47-
}
48-
49-
.col-11 {
50-
color: purple;
51-
}
52-
53-
.col-12 {
54-
color: violet;
55-
}
1+
//
2+
//
3+
// [class*='col-'] { //selects all classes that start with 'col-'
4+
// float: left;
5+
// width: 8.33%;
6+
//
7+
// }
8+
//
9+
// .col-1 {
10+
// color: red;
11+
// }
12+
//
13+
// .col-2 {
14+
// color: pink;
15+
// }
16+
//
17+
// .col-3 {
18+
// color: orange;
19+
// }
20+
//
21+
// .col-4 {
22+
// color: gold;
23+
// }
24+
//
25+
// .col-5 {
26+
// color: yellow;
27+
// }
28+
//
29+
// .col-6 {
30+
// color: lime;
31+
// }
32+
//
33+
// .col-7 {
34+
// color: green;
35+
// }
36+
//
37+
// .col-8 {
38+
// color: teal;
39+
// }
40+
//
41+
// .col-9 {
42+
// color: blue;
43+
// }
44+
//
45+
// .col-10 {
46+
// color: navy;
47+
// }
48+
//
49+
// .col-11 {
50+
// color: purple;
51+
// }
52+
//
53+
// .col-12 {
54+
// color: violet;
55+
// }

‎src/scss/main.scss‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -94,7 +94,7 @@ textarea {
9494
/* ==========================================================================
9595
Author's custom styles
9696
========================================================================== */
97-
@import 'common';
97+
@import "common";
9898
@import 'desktop';
9999
@import 'mobile';
100100
@import 'tablet';

0 commit comments

Comments
 (0)