diff options
Diffstat (limited to 'html_template')
-rwxr-xr-x | html_template/#unbiased.css# | 217 | ||||
l--------- | html_template/.#unbiased.css | 1 | ||||
-rwxr-xr-x | html_template/template.html | 44 | ||||
-rwxr-xr-x | html_template/unbiased.css | 9 |
4 files changed, 248 insertions, 23 deletions
diff --git a/html_template/#unbiased.css# b/html_template/#unbiased.css# new file mode 100755 index 0000000..302c451 --- /dev/null +++ b/html_template/#unbiased.css# @@ -0,0 +1,217 @@ +/*body{ + width:900px; + margin-left:auto; + margin-right:auto; +}*/ + + +body{ + margin:0; +} + +a:link, a:visited, a:hover, a:active { + color: #00f; + text-decoration:none; + } + +a:hover{ + cursor:pointer; +} + +#page-header{ + width:100%; + text-align:center; + padding:.5em 0 1em; + margin-bottom:1em; + border-bottom:3px solid #BB133E; + background:#002147; +} + +.title{ + font-size:3em; +} + +#title-1{ + font-style:italic; + color:#fff; +} + +#title-2{ + color:#fff; +} + +#subtitle{ + font-size:1.25em; + color:#ccc; +} + +#timestamp{ + margin:.5em 0 0 0; + font-size:.8em; + color:#cc6; +} + +#page-container{ + width:900px; + margin-left:auto; + margin-right:auto; +} + +@media only screen and (max-width:900px){ + #page-container{ + width:100% + } +} + +#top-stories{ + width:95%; + display:block; + overflow:auto; + padding:10px; + margin-left:auto; + margin-right:auto; + text-align:center; + border-bottom: 3px solid #BB133E; + margin-bottom: 10px; +} + +.row{ + display:flex; +} + +.top-story{ + display:inline-block; + vertical-align:top; + text-align:left; + width:360px; + height:auto; + overflow:hidden; + background:#fff; + margin:10px; + padding:10px; + border:2px solid #ccc; + flex:1; +} + +@media only screen and (max-width:500px){ + .top-story{ + display:block; + width:auto; + height:auto; + } +} + +.top-stories-img{ + width:350px; + height:200px; + overflow:hidden; + background-size: cover; + background-position: center center; + margin:0 auto; +} + +@media only screen and (max-width:500px){ + .top-stories-img{ + width:auto; + } +} + + +.top-stories-hed{ + font-weight:bold; + font-size:1.35em; + margin:10px 10px 0; + color:#00f; +} + +.top-stories-desc{ + font-size:1em; + padding-top:.5em; + margin:0 .75em; +} + +#middle-stories{ + clear:both; + width:500px; + margin:0 auto; + padding:0; + display:block; + overflow:auto; + float:left; +} + +@media only screen and (max-width:500px){ + #middle-stories{ + width:100%; + float:none; + } +} + +.middle-story{ + margin:5px 10px; + padding:10px; + background:#fff; + border:2px solid #ddd; + width:460px; + float:left; +} + +@media only screen and (max-width:500px){ + .middle-story{ + width:auto; + } +} + +.middle-stories-img{ + width:150px; + height:100px; + overflow:hidden; + background-size: cover; + background-position: center center; + float:left; + max-width:35%; +} + +.middle-stories-hed{ + font-size:1.2em; + float:left; + width:300px; + margin-left:10px; + color:#00f; +} + +@media only screen and (max-width:500px){ + .middle-stories-hed{ + max-width:60%; + } +} + +#bottom-stories{ + margin:0 10px; + padding:10px; + display:block; + overflow:auto; + float:left; + width:350px; + border:5px solid #ddd; +} + +@media only screen and (max-width:900px){ + #bottom-stories{ + width:auto; + border-width:3px; + float:none; + } +} + +.bottom-story{ color:#00f; + + padding:15px 0; + color:#00f; +} + +#sources{ + clear:both; + padding-top:4em; + font-size:.8em; +}
\ No newline at end of file diff --git a/html_template/.#unbiased.css b/html_template/.#unbiased.css new file mode 120000 index 0000000..005e0e4 --- /dev/null +++ b/html_template/.#unbiased.css @@ -0,0 +1 @@ +sstvinc2@Buffalo.3153:1487562646
\ No newline at end of file diff --git a/html_template/template.html b/html_template/template.html index 41eb86e..fc17006 100755 --- a/html_template/template.html +++ b/html_template/template.html @@ -19,7 +19,7 @@ <div class="row">
<div class="top-story">
- <a target="_blank" href="" onclick="window.open('xxURL1-1xx', '_blank')">
+ <a target="_blank" onclick="window.open('xxURL1-1xx', '_blank')">
<div class="top-stories-img" style="background-image: url('xxImg1-1xx');" /></div>
<div class="top-stories-hed">xxTitle1-1xx</div>
</a>
@@ -27,7 +27,7 @@ </div>
<div class="top-story">
- <a target="_blank" href="" onclick="window.open('xxURL1-2xx', '_blank')">
+ <a target="_blank" onclick="window.open('xxURL1-2xx', '_blank')">
<div class="top-stories-img" style="background-image: url('xxImg1-2xx');" />
</div>
<div class="top-stories-hed">xxTitle1-2xx</div>
@@ -40,7 +40,7 @@ <div class="row">
<div class="top-story">
- <a target="_blank" href="" onclick="window.open('xxURL1-3xx', '_blank')">
+ <a target="_blank" onclick="window.open('xxURL1-3xx', '_blank')">
<div class="top-stories-img" style="background-image: url('xxImg1-3xx');" />
</div>
<div class="top-stories-hed">xxTitle1-3xx</div>
@@ -49,7 +49,7 @@ </div>
<div class="top-story">
- <a target="_blank" href="" onclick="window.open('xxURL1-4xx', '_blank')">
+ <a target="_blank" onclick="window.open('xxURL1-4xx', '_blank')">
<div class="top-stories-img" style="background-image: url('xxImg1-4xx');" />
</div>
<div class="top-stories-hed">xxTitle1-4xx</div>
@@ -63,7 +63,7 @@ <div id="middle-stories">
- <a target="_blank" href="" onclick="window.open('xxURL2-1xx', '_blank')">
+ <a target="_blank" onclick="window.open('xxURL2-1xx', '_blank')">
<div class="middle-story">
<div class="middle-stories-img" style="background-image: url('xxImg2-1xx');">
</div>
@@ -71,7 +71,7 @@ </div>
</a>
- <a target="_blank" href="" onclick="window.open('xxURL2-2xx', '_blank')">
+ <a target="_blank" onclick="window.open('xxURL2-2xx', '_blank')">
<div class="middle-story">
<div class="middle-stories-img" style="background-image: url('xxImg2-2xx');">
</div>
@@ -79,7 +79,7 @@ </div>
</a>
- <a target="_blank" href="" onclick="window.open('xxURL2-3xx', '_blank')">
+ <a target="_blank" onclick="window.open('xxURL2-3xx', '_blank')">
<div class="middle-story">
<div class="middle-stories-img" style="background-image: url('xxImg2-3xx');">
</div>
@@ -87,7 +87,7 @@ </div>
</a>
- <a target="_blank" href="" onclick="window.open('xxURL2-4xx', '_blank')">
+ <a target="_blank" onclick="window.open('xxURL2-4xx', '_blank')">
<div class="middle-story">
<div class="middle-stories-img" style="background-image: url('xxImg2-4xx');">
</div>
@@ -95,7 +95,7 @@ </div>
</a>
- <a target="_blank" href="" onclick="window.open('xxURL2-5xx', '_blank')">
+ <a target="_blank" onclick="window.open('xxURL2-5xx', '_blank')">
<div class="middle-story">
<div class="middle-stories-img" style="background-image: url('xxImg2-5xx');">
</div>
@@ -103,7 +103,7 @@ </div>
</a>
- <a target="_blank" href="" onclick="window.open('xxURL2-6xx', '_blank')">
+ <a target="_blank" onclick="window.open('xxURL2-6xx', '_blank')">
<div class="middle-story">
<div class="middle-stories-img" style="background-image: url('xxImg2-6xx');">
</div>
@@ -116,51 +116,51 @@ <div id="bottom-stories">
<div class="bottom-story">
- <a target="_blank" href="" onclick="window.open('xxURL3-1xx', '_blank')">xxTitle3-1xx</a>
+ <a target="_blank" onclick="window.open('xxURL3-1xx', '_blank')">xxTitle3-1xx</a>
</div>
<div class="bottom-story">
- <a target="_blank" href="" onclick="window.open('xxURL3-2xx', '_blank')">xxTitle3-2xx</a>
+ <a target="_blank" onclick="window.open('xxURL3-2xx', '_blank')">xxTitle3-2xx</a>
</div>
<div class="bottom-story">
- <a target="_blank" href="" onclick="window.open('xxURL3-3xx', '_blank')">xxTitle3-3xx</a>
+ <a target="_blank" onclick="window.open('xxURL3-3xx', '_blank')">xxTitle3-3xx</a>
</div>
<div class="bottom-story">
- <a target="_blank" href="" onclick="window.open('xxURL3-4xx', '_blank')">xxTitle3-4xx</a>
+ <a target="_blank" onclick="window.open('xxURL3-4xx', '_blank')">xxTitle3-4xx</a>
</div>
<div class="bottom-story">
- <a target="_blank" href="" onclick="window.open('xxURL3-5xx', '_blank')">xxTitle3-5xx</a>
+ <a target="_blank" onclick="window.open('xxURL3-5xx', '_blank')">xxTitle3-5xx</a>
</div>
<div class="bottom-story">
- <a target="_blank" href="" onclick="window.open('xxURL3-6xx', '_blank')">xxTitle3-6xx</a>
+ <a target="_blank" onclick="window.open('xxURL3-6xx', '_blank')">xxTitle3-6xx</a>
</div>
<div class="bottom-story">
- <a target="_blank" href="" onclick="window.open('xxURL3-7xx', '_blank')">xxTitle3-7xx</a>
+ <a target="_blank" onclick="window.open('xxURL3-7xx', '_blank')">xxTitle3-7xx</a>
</div>
<div class="bottom-story">
- <a target="_blank" href="" onclick="window.open('xxURL3-8xx', '_blank')">xxTitle3-8xx</a>
+ <a target="_blank" onclick="window.open('xxURL3-8xx', '_blank')">xxTitle3-8xx</a>
</div>
<div class="bottom-story">
- <a target="_blank" href="" onclick="window.open('xxURL3-9xx', '_blank')">xxTitle3-9xx</a>
+ <a target="_blank" onclick="window.open('xxURL3-9xx', '_blank')">xxTitle3-9xx</a>
</div>
<div class="bottom-story">
- <a target="_blank" href="" onclick="window.open('xxURL3-10xx', '_blank')">xxTitle3-10xx</a>
+ <a target="_blank" onclick="window.open('xxURL3-10xx', '_blank')">xxTitle3-10xx</a>
</div>
<div class="bottom-story">
- <a target="_blank" href="" onclick="window.open('xxURL3-11xx', '_blank')">xxTitle3-11xx</a>
+ <a target="_blank" onclick="window.open('xxURL3-11xx', '_blank')">xxTitle3-11xx</a>
</div>
<div class="bottom-story">
- <a target="_blank" href="" onclick="window.open('xxURL3-12xx', '_blank')">xxTitle3-12xx</a>
+ <a target="_blank" onclick="window.open('xxURL3-12xx', '_blank')">xxTitle3-12xx</a>
</div>
</div>
diff --git a/html_template/unbiased.css b/html_template/unbiased.css index c0bb121..cc6ed45 100755 --- a/html_template/unbiased.css +++ b/html_template/unbiased.css @@ -12,7 +12,11 @@ body{ a:link, a:visited, a:hover, a:active {
color: #00f;
text-decoration:none;
- }
+ }
+
+a:hover{
+ cursor:pointer;
+}
#page-header{
width:100%;
@@ -117,6 +121,7 @@ a:link, a:visited, a:hover, a:active { font-weight:bold;
font-size:1.35em;
margin:10px 10px 0;
+ color:#00f;
}
.top-stories-desc{
@@ -172,6 +177,7 @@ a:link, a:visited, a:hover, a:active { float:left;
width:300px;
margin-left:10px;
+ color:#00f;
}
@media only screen and (max-width:500px){
@@ -200,6 +206,7 @@ a:link, a:visited, a:hover, a:active { .bottom-story{
padding:15px 0;
+ color:#00f;
}
#sources{
|