tangent/memex
1
0
Fork 0
mirror of https://github.com/TangentFoxy/memex.git synced 2024-11-22 04:54:23 +00:00
Code Issues Actions Packages Projects Releases Wiki Activity

Merge branch 'master' into bugfix/masonry-layout-refresh

Browse Source
This commit is contained in:
Changbai Li 2018-07-18 18:11:14 +08:00 committed by GitHub
commit fb9f2c287a
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
4 changed files with 67 additions and 46 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
README.md
View File

@ -4,7 +4,7 @@ Simple bookmarks and notes.
Formatted for long term storage (['Long site'](https://www.gwern.net/About)) and review (sorting/filtering).
[Live version here](https://kormyen.github.io/Memex/).
[Live version here](https://kormyen.github.io/memex/).
## Goals:

88
asset/style.css vendored
View File

@ -1,17 +1,24 @@
/* VARIABLES */
:root {
/* COLOR */
--color-menu0: #000; /* bg */
--color-menu1: #333; /* low */
--color-menu2: #999; /* mid */
--color-menu3: #ddd; /* high */
--color-main-bg-i: #ddd; /*idle*/
--color-main-bg-e: #ddd; /*enabled*/
--color-content-bg-i: #ccc; /*idle*/
--color-content-bg-e: #bbb; /*enabled*/
--color-bg: #ddd; /* bg main */
--color-menu-bg-i: #000; /*idle*/
--color-menu-bg-e: #000; /*enabled*/
--color-content0: #ccc; /* bg */
--color-content1: #bbb; /* low */
--color-content2: #999; /* mid */
--color-content3: #000; /* high */
--color-content-item-s: #bbb; /*sub*/
--color-content-item-i: #999; /*idle*/
--color-content-item-e: #666; /*enabled*/
--color-content-item-t: #000; /*title*/
--color-content-item-a: #000; /*ascent*/
--color-menu-item-i: #333; /*idle*/
--color-menu-item-e: #999; /*enabled*/
--color-menu-item-a: #ddd; /*ascent*/
/* SIZE */
--menu-width: 150px;
@ -34,7 +41,7 @@
html {
font-family: 'Monaco', 'Andale Mono', 'Deja Vu Sans Mono', 'Consolas', monospace;
background: var(--color-bg);
background: var(--color-main-bg-i);
box-sizing: border-box;
padding: 0em;
margin: 0;
@ -51,7 +58,7 @@ body {
/* MENU */
.menu {
background: var(--color-menu0);
background: var(--color-menu-bg-i);
padding-top: var(--size-gutter);
width: var(--menu-width);
position: fixed;
@ -61,13 +68,13 @@ body {
top: 0px;
}
.menu a {
color: var(--color-menu1);
color: var(--color-menu-item-i);
}
.menu:hover a {
color: var(--color-menu2);
color: var(--color-menu-item-e);
}
.menu:hover a:hover {
color: var(--color-menu3);
color: var(--color-menu-item-a);
}
.menu-spacer {
height: var(--menu-item-spacer);
@ -110,14 +117,14 @@ body {
padding-bottom: calc(var(--menu-item-vert-sep) / 2);
padding-top: calc(var(--menu-item-vert-sep) / 2);
font-size: var(--type-icon-size);
color: var(--color-menu1);
color: var(--color-menu-item-i);
display: table-row;
text-align: center;
width: 100%;
float: left;
}
.menu:hover .menu-tag-container i {
color: var(--color-menu2);
color: var(--color-menu-item-e);
}
.menu-tag {
padding-bottom: calc(var(--menu-tag-sep) / 2);
@ -152,15 +159,14 @@ body {
clear: both;
}
.grid-item, .grid-item--width2 {
text-decoration: none;
border-radius: var(--size-item-corner);
margin-bottom: var(--size-gutter);
background: var(--color-content0);
background: var(--color-content-bg-i);
width: var(--size-grid-column);
padding: var(--size-gutter);
box-sizing: border-box;
text-decoration: none;
float: left;
color: #000;
}
@media screen and (min-width: 886px) {
.grid-item--width2 {
@ -176,7 +182,7 @@ body {
}
.grid-item:hover {
box-shadow: 0px 0px 20px 0px rgba(0, 0, 0, .1);
background: var(--color-content1);
background: var(--color-content-bg-e);
}
/* LINK */
@ -190,42 +196,36 @@ body {
display: inline-block;
}
.grid-item .link .title {
color: var(--color-content3);
color: var(--color-content-item-t);
font-size: var(--size-font-title);
text-decoration: none;
float: left;
clear: both;
}
.grid-item .link .link-line {
color: var(--color-content2);
margin-top: var(--size-item-elem-padding);
float: left;
clear: both;
}
.grid-item .link i {
color: var(--color-content2);
float: left;
}
.grid-item .link .link-title {
color: var(--color-content2);
color: var(--color-content-item-i);
font-size: var(--size-font-body);
float: left;
}
.grid-item:hover .link .link-title {
color: var(--color-content3);
}
.grid-item .link:hover .title {
/*background-color: var(--color-content3);
color: var(--color-content1);*/
color: var(--color-content-item-e);
}
.grid-item .link:hover .link-title {
background-color: var(--color-content3);
color: var(--color-content1);
background-color: var(--color-content-item-a);
color: var(--color-content-bg-e);
}
/* TYPE */
.grid-item a .type {
color: var(--color-content2);
color: var(--color-content-item-s);
font-size: var(--type-icon-size);
padding-top: var(--size-gutter);
padding-bottom: var(--size-gutter);
@ -237,17 +237,17 @@ body {
top: 0px;
}
.grid-item:hover a .type {
color: var(--color-content2);
color: var(--color-content-item-i);
}
.grid-item:hover a .type:hover {
color: var(--color-content3);
color: var(--color-content-item-a);
}
/* LINK, NOTE, QUOTE, TERM, TAGS */
.note, .quote, .term, .tags, .prog {
padding-top: var(--size-item-elem-padding);
color: var(--color-content-item-i);
font-size: var(--size-font-body);
color: var(--color-content2);
float: left;
clear: both;
}
@ -255,27 +255,27 @@ body {
.grid-item:hover .note,
.grid-item:hover .quote,
.grid-item:hover .term,
.grid-item:hover .prog
{
color: var(--color-content3);
.grid-item:hover .tags,
.grid-item:hover .prog {
color: var(--color-content-item-e);
}
.tags a {
color: var(--color-content2);
color: var(--color-content-item-i);
text-decoration:none;
}
.grid-item:hover .tags a {
color: var(--color-content3);
color: var(--color-content-item-e);
}
.grid-item:hover .tags a:hover {
background-color: var(--color-content3);
color: var(--color-content1);
background-color: var(--color-content-item-a);
color: var(--color-content-bg-e);
}
/* SMALL ICONS */
.textIcon {
color: var(--color-content1);
color: var(--color-content-item-s);
margin-right: var(--size-item-elem-sep);
}
.grid-item:hover .textIcon {
color: var(--color-content2);
color: var(--color-content-item-i);
}

20
content/Memex.ndtl
View File

@ -1662,4 +1662,24 @@ APPLIED MINIMALISM
DATE : 12018-07-18
TYPE : music
DONE : true
VELADYA CHAPMAN VANLIFE
LINK : http://shareaslicepodcast.com/2018/07/16/vanlife/
DATE : 12018-07-18
TYPE : podcast
DONE : true
PROJ : Van
AMISH ATHEIST
LINK : http://shareaslicepodcast.com/2018/05/09/copp1/
DATE : 12018-07-18
TYPE : podcast
DONE : true
JOHN LAW
LINK : http://shareaslicepodcast.com/2017/10/24/dada/
NOTE : DADA, Burning Man, Cacophony Society & Suicide Club
DATE : 12018-07-18
TYPE : podcast
DONE : true
`

3
logic/viewmasonry.js
View File

@ -4,7 +4,8 @@ function ViewMasonry()
this.msnry = null;
this.grid = null;
this.menu = null;
var parent = this;
// SETTINGS
this.statsNumTags = 5;
this.statsNumTypes = 10;