Link setup and improved css styling.

This commit is contained in:
kor 2018-07-15 03:02:57 +12:00
parent a8b92e46f1
commit d2c0d48825
3 changed files with 54 additions and 33 deletions

View File

@ -30,52 +30,77 @@ body {
.grid-item {
width: 350px;
float: left;
background: #D26;
margin-bottom: 20px;
border-radius: 2px;
}
/* LINK */
a {
a#url {
color:#000;
text-decoration:underline;
}
a#urlseen {
color:#666;
}
a#url:hover, a#urlseen:hover {
color:#DCDCDC;
background-color: #000;
}
/* ENTRY */
.grid-item {
color:#000;
background:#999;
padding:0.5em;
padding:20px;
min-height:2.4em;
float:left;
}
/* TAGS */
#tags {
font-size:0.8em;
/* TITLE */
.title {
margin-right: 45px;
font-size:1em;
color:#000;
/*background-color: #000;*/
}
/* NOTE, QUOTE, TERM */
#note, #quote, #term {
/* LINK, NOTE, QUOTE, TERM, TAGS */
.link, .note, .quote, .term, .tags, .prog {
padding-top: 1em;
font-size:0.8em;
color:#000;
}
.tags a {
color:#000;
text-decoration:none;
}
.tags a:hover {
color:#DCDCDC;
background-color: #000;
}
/* TYPE */
#type {
#type a {
text-align: center;
vertical-align: top;
width: 40px;
height: 40px;
width: 70px;
height: 62px;
position: absolute;
top: 8px;
right: 5px;
color:#666;
padding-top: 18px;
top: 0px;
right: 0px;
color:#888;
font-size:1.5em;
/*background: #000;*/
}
#type a:hover {
color:#000;
text-decoration:none;
}
.textIcon {
color:#888;
margin-right:0.75em;
}

View File

@ -104,7 +104,7 @@ MOD SUPPORT IN UNITY
LINK : http://nihilocrat.tumblr.com/post/157890290188/mod-support-in-unity
TYPE : article
DATE : 12018-07-03
TAGS : gamedev
TAGS : gamedev, unity3d
SEEN : false
PSALM 46
@ -119,7 +119,7 @@ C# GC
LINK : http://benbowen.blog/post/three_garbage_examples/
TYPE : article
DATE : 12018-07-03
TAGS : gamedev, code
TAGS : gamedev, code, unity3d
SEEN : true
REVI : true
@ -176,7 +176,7 @@ GENERATE GREAT DUNGEONS
TAGS : gamedev
SEEN : false
TECHNOLOGIST CLIMATE REACT
TECHNOLOGIST CLIMATE
LINK : http://worrydream.com/ClimateChange/
TYPE : article
DATE : 12018-07-03
@ -219,7 +219,7 @@ MAGIC INK
TAGS : ux, design
SEEN : true
PROCEDURAL WORLD NARRATIVES
PROCEDURAL NARRATIVES
LINK : https://www.gamasutra.com/blogs/JoshGe/20161116/285647/Weaving_Narratives_into_Procedural_Worlds.php
TYPE : article
DATE : 12018-07-03
@ -260,7 +260,7 @@ RV BATTERY RANT
TYPE : article
DATE : 12018-07-03
TAGS : offgrid
NOTE : rant
NOTE : Rant
SEEN : true
HYPER LIGHT DIFFICULTY
@ -448,7 +448,7 @@ LONG-TERM MEMORY
TERM : Anki, Memex
SEEN : false
DECLARATION OF INDEPENDENCE OF CYBERSPACE
INDEPENDENCE IN CYBERSPACE
PERS : ark
SRCE : Merveilles
LINK : https://www.eff.org/cyberspace-independence

View File

@ -39,7 +39,7 @@ function displayEntries(db)
// ENTRY
entries += `<div class="grid-item">`;
entries += `${keys[i].toProperCase()}`;
entries += `<div class="title">${keys[i].toProperCase()}</div>`;
// LINK
if (typeof value.LINK !== 'undefined')
@ -52,13 +52,14 @@ function displayEntries(db)
idUrl = "urlseen";
}
}
entries += `<div id="link"><a href="${String(value.LINK)}" id="${idUrl}">${extractRootDomain(value.LINK)}</a></div>`;
entries += `<div class="link"><i class="fas fa-link textIcon"></i><a href="${String(value.LINK)}" id="${idUrl}">${extractRootDomain(value.LINK)}</a></div>`;
}
// TYPE
if (typeof value.TYPE !== 'undefined')
{
entries += `<div id="type">`;
entries += `<a href='#type:${String(value.TYPE)}'>`;
if (value.TYPE == 'article')
{
entries += `<i class="far fa-newspaper"></i>`;
@ -104,43 +105,38 @@ function displayEntries(db)
entries += `<i class="fas fa-music"></i>`;
}
entries += `</a>`;
entries += `</div>`;
}
// TAGS
if (typeof value.TAGS !== 'undefined')
{
entries += `<div id="tags">${value.TAGS.toLowerCase()}</div>`;
entries += `<div class="tags"><i class="fas fa-tag textIcon"></i><a href=#tag:${value.TAGS.toLowerCase()}>${value.TAGS.toLowerCase()}</a></div>`;
}
// NOTE
if (typeof value.NOTE !== 'undefined')
{
entries += `<div id="note">NOTE: ${value.NOTE}</div>`;
entries += `<div class="note"><i class="fas fa-sticky-note textIcon"></i>${value.NOTE}</div>`;
}
// QUOTE
if (typeof value.QOTE !== 'undefined')
{
entries += `<div id="quote">QUOTE: ${value.QOTE}</div>`;
entries += `<div class="quote"><i class="fas fa-comment textIcon"></i>${value.QOTE}</div>`;
}
// TERM
if (typeof value.TERM !== 'undefined')
{
entries += `<div id="term">TERM(S): ${value.TERM}</div>`;
}
// TERM
if (typeof value.TERM !== 'undefined')
{
entries += `<div id="term">TERM(S): ${value.TERM}</div>`;
entries += `<div class="term"><i class="fas fa-ribbon textIcon"></i>${value.TERM}</div>`;
}
// PROGRESS
if (typeof value.PROG !== 'undefined')
{
entries += `<div id="term">PROGRESS: ${value.PROG}</div>`;
entries += `<div class="prog"><i class="fas fa-clock textIcon"></i>${value.PROG}</div>`;
}
entries += `</div>`;