forked from NV/notes
-
Notifications
You must be signed in to change notification settings - Fork 1
/
litewrite.css
69 lines (56 loc) · 3.33 KB
/
litewrite.css
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
html, body {
position:absolute; height:100%; width:100%; margin:0; padding:0;
background:#eee; color:#000;
}
@font-face { font-family:'Open Sans'; font-weight:normal; src:url(typefaces/OpenSans-Regular.ttf); }
@font-face { font-family:'Open Sans'; font-weight:bold; src:url(typefaces/OpenSans-Bold.ttf); }
@font-face { font-family:'Alegreya'; font-weight:normal; src:url(typefaces/Alegreya-Regular.ttf); }
@font-face { font-family:'Alegreya'; font-weight:bold; src:url(typefaces/Alegreya-Bold.ttf); }
#editor {
-webkit-box-sizing:border-box; -moz-box-sizing:border-box; -o-box-sizing:border-box; -ms-box-sizing:border-box; box-sizing:border-box;
position:absolute; width:100%; height:100%; padding:5% 20%;
background:#fcfcfc url(lightpaperfibers.png) repeat; font:normal 1.5em/160% 'Open Sans',Frutiger,sans-serif;
outline:none; overflow:auto; border:none; resize:none;
}
#editor:first-line { font-size:2em; line-height:2.4em; font-weight:bold; } /* need to fix this for when it's a div */
.subheading { margin:1em 0 .5em -.9em; font-size:1.6em; font-weight:bold; }
.listelement { margin-left:1em; }
#aside {
position:fixed; width:16%; height:100%; padding:1%;
font:90% FreeSans,Helvetica,sans-serif;
opacity:0; -webkit-transition:opacity 300ms; -moz-transition:opacity 300ms; -o-transition:opacity 300ms; -ms-transition:opacity 300ms; transition:opacity 300ms;
}
#aside:hover, #aside:focus, #aside.visible { opacity:1; }
#aside a, #add, #color-toggle, #serif-toggle {
display:block; padding:.5em; cursor:pointer; outline:none;
color:#444; text-decoration:none;
white-space:nowrap; overflow:hidden; text-overflow:hidden;
}
#aside a:hover, #aside a:focus { color:#000; }
#aside .selected { color:#000; font-weight:bold; }
#add { display:inline-block; width:70%; font-size:120%; font-weight:bold; color:#000; }
#add:hover:before, #add:focus:before { content:'+ '; }
#add:hover, #add:focus { color:#777; margin-left:-.9em; }
#entries { height:80%; overflow-y:auto; }
#entries a { text-overflow:ellipsis; }
#credits { position:absolute; bottom:3em; padding:.5em; font-size:.7em; white-space:nowrap; opacity:.7; }
#credits a { display:inline; padding:0; }
#color-toggle {
position:absolute; width:3em; height:3em; top:-3em; left:-3em;
background:#1b1b1b; border-radius:50%;
}
#color-toggle:hover, #color-toggle:focus { background:#777; }
.dark #editor { background:#1b1b1b url(broken_noise.png) repeat; color:#eee; }
.dark, .dark #aside a, .dark #add, .dark #serif-toggle { color:#bbb; }
.dark #aside a:hover, .dark #aside a:focus, .dark #aside .selected, .dark #add:hover, .dark #add:focus, .dark #serif-toggle:hover, .dark #serif-toggle:focus { color:#eee; }
.dark #color-toggle { background:#bbb; }
.dark #color-toggle:hover { background:#eee; }
#serif-toggle { position:absolute; font-family:'Alegreya',Georgia,serif; font-size:3em; top:-.7em; left:.5em; padding:0; line-height:1em; }
#serif-toggle:hover, #serif-toggle:focus { color:#777; }
.serif #editor { font:normal 1.7em/150% 'Alegreya',Georgia,serif; }
.serif #serif-toggle { font-family:'Open Sans',Frutiger,sans-serif; top:-.75em; left:.55em; }
.serif #aside a, .dark #add, .dark { }
.serif #aside a:hover, .dark #aside a:focus, .dark #aside .selected { }
::selection { background-color:yellow; }
::-webkit-scrollbar { width:.2em; color:rgba(50,50,50,.3); }
::-webkit-scrollbar-track-piece { background-color:transparent; }