From 7eda456ed397be3f62335973e2e2beb904531fd5 Mon Sep 17 00:00:00 2001 From: Koala Yeung Date: Tue, 10 Mar 2015 02:36:38 +0800 Subject: [PATCH 1/6] Main HTML with draft top menu --- main.html | 69 +++++++++++++++++++++++++++++++++++++++++++++++++++++++ 1 file changed, 69 insertions(+) create mode 100644 main.html diff --git a/main.html b/main.html new file mode 100644 index 0000000..963bcee --- /dev/null +++ b/main.html @@ -0,0 +1,69 @@ + + + + + + +Watchdog + + + + + + + + + + + +
+
+
+
+ + + \ No newline at end of file From 8e311fb6cbbd51cb0761e1f7aac19b727de6e96a Mon Sep 17 00:00:00 2001 From: Koala Yeung Date: Wed, 18 Mar 2015 22:28:37 +0800 Subject: [PATCH 2/6] Add empty CSS file for later use --- css/style.css | 1 + main.html | 1 + 2 files changed, 2 insertions(+) create mode 100644 css/style.css diff --git a/css/style.css b/css/style.css new file mode 100644 index 0000000..8b13789 --- /dev/null +++ b/css/style.css @@ -0,0 +1 @@ + diff --git a/main.html b/main.html index 963bcee..d6ced80 100644 --- a/main.html +++ b/main.html @@ -6,6 +6,7 @@ Watchdog + -
From 50ebb564c4b5a364306343a8e3ce8036c5f4ea81 Mon Sep 17 00:00:00 2001 From: Koala Yeung Date: Wed, 18 Mar 2015 22:51:44 +0800 Subject: [PATCH 4/6] Improve brand style --- css/style.css | 4 ++++ main.html | 5 ++++- 2 files changed, 8 insertions(+), 1 deletion(-) diff --git a/css/style.css b/css/style.css index 3eb6497..ef4d20d 100644 --- a/css/style.css +++ b/css/style.css @@ -1,4 +1,8 @@ +.navbar-brand { + text-transform: uppercase; +} + .search-form { display: block; margin: 8px 0 0 0; diff --git a/main.html b/main.html index 8b0e823..7cc9b39 100644 --- a/main.html +++ b/main.html @@ -47,7 +47,10 @@ - Watchdog + + 狗仔隊 + Watchdogs +
From 1a6f39599dc09d2280399cc4bb3a80f2ae29c6b3 Mon Sep 17 00:00:00 2001 From: Koala Yeung Date: Mon, 23 Mar 2015 21:47:47 +0800 Subject: [PATCH 5/6] Basic style for article in listing --- css/style.css | 50 +++++++++ images/rate.png | Bin 0 -> 1056 bytes main.html | 276 ++++++++++++++++++++++++++++++++++++++++++++++++ 3 files changed, 326 insertions(+) create mode 100644 images/rate.png diff --git a/css/style.css b/css/style.css index ef4d20d..a5e038a 100644 --- a/css/style.css +++ b/css/style.css @@ -14,3 +14,53 @@ margin-right: 35px; background-color: #e5e5e5; } + +article { + margin: 10px 0; + padding: 20px 0; + border-top: solid 1px #999; +} +article.first { + margin-top: 0; + padding-top: 10px; + border-top: none; +} + +/** + * News teaser listing + */ +.news-teaser h2 { + color: #4C9ED9; + margin: 14px 0; +} +.news-teaser .news-rating { + width: 70px; + float: left; +} +.news-teaser .news-rating .icon { + display: block; + background-image: url(../images/rate.png); + background-repeat: no-repeat; + background-position: center; + width: 70px; + height: 35px; +} +.news-teaser .news-rating .rating { + display: block; + width: 70px; + padding: 0 0 8px 0; + text-align: center; + font-size: 26pt; +} + +.news-teaser .news-teaser-content { + margin-left: 70px; +} +.news-teaser .news-teaser-content .source-name, +.news-teaser .news-teaser-content .stats { + color: #777; +} +.news-teaser .news-teaser-content .stats .changes .figure { + color: #4C9ED9; + font-weight: bold; +} diff --git a/images/rate.png b/images/rate.png new file mode 100644 index 0000000000000000000000000000000000000000..243ecd80bdb1dab566d2918c1147d4e7ae5e90b9 GIT binary patch literal 1056 zcmV+*1mF9KP)ZgXgFbngSdJ^%m%vPnciR9J=W zm`g8fZ5W2HqFd8ev{8v3#GyiBA`KxDhmp?o7l=b5!hne&W+ny_5<>g|F%VOU2&2Yv zprOjZfX1m+;!sLe58pt(mCx=fyJ}37+l|NL;qmbipU+29QW9xtX=G<-qt$BvKG5~`H8z`#&CN~hb~}E* zKc=^+sEGFVcCxdx->fN#)%L+)kkivsg2CXcb-&-w&dv@tn~lT6Ln4vaAD7GJXfzt6 zQmFuab#(=RQmJHca1gy-A0Lp%<6&T60FTG>=C1+JYPFb5CQ3_7DJUpFp-@D54h{|& z85!aH{G9Uga(a7vW7ZSBWOH+KF=3=qDSEx0va&L&s;V#;4DUkc=jYSh+|1C>5L;VY zgu`KylEnK-6zJyW27r>168if3n3|emetsUkUeDOr*t-B?%FD|GAP@*}dwYvotrqpY z+4c&Bf?vOWk)EFZA&CDfB_#!!Oa{Q>;$lqSn?S3ptF*SZGBY!iFpx^6qNSxJF(7!k ze7|?nM`bdZfS1mDczF02&}ZuM@=|#3^Z7(QUkYR}7|>`m0IaR8eLs*~E~lcR0syDe zDeC$1n`_nE^fD**49==M@M;ne*O?pFc{?S?(XHwMeb*!Ko*MylgSkG z;4LpNGdw&@I2?`(=I-u}$;nB)UN174jN;gE@WBXcu~=|Aomj0_#>dCW%*@1SGz$B5b#*K)EdkKg)g>gv)YMdTI$g{x1PQc# zM@I*Rg@rslJux&igxBj8_KZfOkbjPjjxZXH7>z~@2E&^$2?0r^QhIuN$jHdx>gtNw z+1Xe7m6eqM?C
+ +
+
+ + 20 +
+
+
香港新聞
+

This is an English Headline

+
+ + 55 + 分鐘前更新 + • + + 改動 + 66% + • + + 777 + 條評論 + +
+
+
+ +
+
+ + 20 +
+
+
香港新聞
+

This is an English Headline

+
+ + 55 + 分鐘前更新 + • + + 改動 + 66% + • + + 777 + 條評論 + +
+
+
+ +
+
+ + 20 +
+
+
香港新聞
+

This is an English Headline

+
+ + 55 + 分鐘前更新 + • + + 改動 + 66% + • + + 777 + 條評論 + +
+
+
+ +
+
+ + 20 +
+
+
香港新聞
+

This is an English Headline

+
+ + 55 + 分鐘前更新 + • + + 改動 + 66% + • + + 777 + 條評論 + +
+
+
+ +
+
+ + 20 +
+
+
香港新聞
+

This is an English Headline

+
+ + 55 + 分鐘前更新 + • + + 改動 + 66% + • + + 777 + 條評論 + +
+
+
+ +
+
+ + 20 +
+
+
香港新聞
+

This is an English Headline

+
+ + 55 + 分鐘前更新 + • + + 改動 + 66% + • + + 777 + 條評論 + +
+
+
+ +
+
+ + 20 +
+
+
香港新聞
+

This is an English Headline

+
+ + 55 + 分鐘前更新 + • + + 改動 + 66% + • + + 777 + 條評論 + +
+
+
+ +
+
+ + 20 +
+
+
香港新聞
+

This is an English Headline

+
+ + 55 + 分鐘前更新 + • + + 改動 + 66% + • + + 777 + 條評論 + +
+
+
+ +
+
+ + 20 +
+
+
香港新聞
+

This is an English Headline

+
+ + 55 + 分鐘前更新 + • + + 改動 + 66% + • + + 777 + 條評論 + +
+
+
+ +
+
+ + 20 +
+
+
香港新聞
+

This is an English Headline

+
+ + 55 + 分鐘前更新 + • + + 改動 + 66% + • + + 777 + 條評論 + +
+
+
+ +
+
+ + 20 +
+
+
香港新聞
+

This is an English Headline

+
+ + 55 + 分鐘前更新 + • + + 改動 + 66% + • + + 777 + 條評論 + +
+
+
+
From 73947f5c4f6604fda856db2c3498af496e733930 Mon Sep 17 00:00:00 2001 From: Koala Yeung Date: Tue, 24 Mar 2015 00:33:17 +0800 Subject: [PATCH 6/6] Draft for single news page --- css/style.css | 37 +++++++++++++++ news.html | 121 ++++++++++++++++++++++++++++++++++++++++++++++++++ 2 files changed, 158 insertions(+) create mode 100644 news.html diff --git a/css/style.css b/css/style.css index a5e038a..840c083 100644 --- a/css/style.css +++ b/css/style.css @@ -20,6 +20,7 @@ article { padding: 20px 0; border-top: solid 1px #999; } +article.page, article.first { margin-top: 0; padding-top: 10px; @@ -64,3 +65,39 @@ article.first { color: #4C9ED9; font-weight: bold; } + +/** + * single news page + */ +.news-full { + padding: 0 1em; +} +.news-full h1 { + font-size: 1.6em; + margin: 0.4em 0; +} +.news-full p { + margin: 1.2em 0; + text-align: justify; +} +.news-full .source, +.news-full .stats { + color: #777; +} +.news-full .content { + margin: 1em 0; + line-height: 2em; + text-shadow: 0 0 0.5em #000; + color: #CCC; +} +.news-full .content .change { + color: #000; + text-shadow: 0 0 #000; +} +.news-full .content .add { + color: #060; +} +.news-full .content .delete { + color: #A00; + text-decoration: line-through; +} diff --git a/news.html b/news.html new file mode 100644 index 0000000..45edfe9 --- /dev/null +++ b/news.html @@ -0,0 +1,121 @@ + + + + + + +Watchdog + + + + + + + + + + + +
+
+ +
+
+ 香港新聞 • + Saturday, February 28, 2015 +
+

This is an English Headline

+
+ + 55 + 分鐘前更新 + • + + 改動 + 66% + • + + 777 + 條評論 + +
+
+

Lorem ipsum dolor Lorem ipsum dolorvdignissim Aliquam suscipit odio ac ante luctus pharetra . Pellentesque sit amet pellentesque augue . Aliquam vel tellus et urna dictum accumsan eget at massa Lorem ipsum dolorv Aliquam suscipit odio ac ante luctus pharetra . Pellentesque sit amet pellentesque augue. Aliquam vel tellus et urna dictum accumsan eget at massa Lorem ipsum dolorv Aliquam suscipit odio ac ante luctus pharetra . Pellentesque sit amet pellentesque augue. Aliquam vel tellus et urna dictum accumsan eget at massa Lorem ipsum dolorv Aliquam suscipit odio ac ante luctus pharetra . Pellentesque sit amet pellentesque augue.

+

Aliquam vel tellus et urna dictum accumsan eget at massa Lorem ipsum dolorv Aliquam suscipit odio ac ante luctus pharetra . Pellentesque sit amet pellentesque augue. Aliquam vel tellus et urna dictum accumsan eget at massa Lorem ipsum dolorv Aliquam suscipit odio ac ante luctus pharetra . Pellentesque sit amet pellentesque augue. Aliquam vel tellus et urna dictum accumsan eget at massa Lorem ipsum dolorv Aliquam suscipit odio ac ante luctus pharetra . Pellentesque sit amet pellentesque augue. Aliquam vel tellus et urna dictum accumsan eget at massa Lorem ipsum dolorv Aliquam suscipit odio ac ante luctus pharetra . Pellentesque sit amet pellentesque augue.

+

Aliquam vel tellus et urna dictum accumsan eget at massa Lorem ipsum dolorv Aliquam suscipit odio ac ante luctus pharetra . Aliquam vel tellus et urna dictum accumsan eget at massa Lorem ipsum dolorv Aliquam suscipit odio ac ante luctus pharetra . Pellentesque sit amet pellentesque augue. Pellentesque sit amet pellentesque augue . Aliquam vel tellus et urna dictum accumsan eget at massa

+
+
+ +
+
+ + + \ No newline at end of file