character 0.1.0
Sign up to get free protection for your applications and to get access to all the features.
- data/.gitignore +1 -0
- data/Gemfile +4 -0
- data/README.md +20 -0
- data/Rakefile +7 -0
- data/app/controllers/character/posts_controller.rb +27 -0
- data/app/models/character/post.rb +20 -0
- data/character.gemspec +24 -0
- data/lib/character.rb +3 -0
- data/lib/character/engine.rb +5 -0
- data/lib/character/routing.rb +11 -0
- data/lib/character/version.rb +3 -0
- data/lib/generators/character/install_generator.rb +42 -0
- data/lib/generators/character/templates/README +1 -0
- data/lib/generators/character/templates/admin/character.rb +3 -0
- data/vendor/assets/fonts/general_foundicons.eot +0 -0
- data/vendor/assets/fonts/general_foundicons.svg +15 -0
- data/vendor/assets/fonts/general_foundicons.ttf +0 -0
- data/vendor/assets/fonts/general_foundicons.woff +0 -0
- data/vendor/assets/javascripts/backbone.js +1431 -0
- data/vendor/assets/javascripts/character/index.js.coffee +53 -0
- data/vendor/assets/javascripts/character/models/post.js.coffee +39 -0
- data/vendor/assets/javascripts/character/views/app.js.coffee +81 -0
- data/vendor/assets/javascripts/character/views/editor.js.coffee +231 -0
- data/vendor/assets/javascripts/character/views/editor_settings.js.coffee +44 -0
- data/vendor/assets/javascripts/character/views/index.js.coffee +116 -0
- data/vendor/assets/javascripts/character/views/preview.js.coffee +49 -0
- data/vendor/assets/javascripts/jquery.smartresize.js +30 -0
- data/vendor/assets/javascripts/lodash.js +4258 -0
- data/vendor/assets/javascripts/showdown.js +62 -0
- data/vendor/assets/javascripts/underscore.string.js +600 -0
- data/vendor/assets/stylesheets/character/_base.css.scss +84 -0
- data/vendor/assets/stylesheets/character/_icons.css.scss.erb +96 -0
- data/vendor/assets/stylesheets/character/_view_editor.css.scss +115 -0
- data/vendor/assets/stylesheets/character/_view_index.css.scss +73 -0
- data/vendor/assets/stylesheets/character/_view_preview.css.scss +49 -0
- data/vendor/assets/stylesheets/character/index.css.scss +32 -0
- metadata +103 -0
|
@@ -0,0 +1,84 @@
|
|
|
1
|
+
@import "compass/reset";
|
|
2
|
+
@import "compass/css3";
|
|
3
|
+
|
|
4
|
+
|
|
5
|
+
$GRAY: #E3E3E1;
|
|
6
|
+
|
|
7
|
+
@mixin shadow { @include box-shadow(0 1px 2px rgba(0, 0, 0, 0.15));
|
|
8
|
+
}
|
|
9
|
+
|
|
10
|
+
|
|
11
|
+
@mixin character_body { font-family:'Helvetica Neue', Helvetica, Arial;
|
|
12
|
+
font-weight:300;
|
|
13
|
+
font-size:14px;
|
|
14
|
+
color:#444;
|
|
15
|
+
|
|
16
|
+
|
|
17
|
+
strong { font-weight:600;
|
|
18
|
+
}
|
|
19
|
+
|
|
20
|
+
a, a:visited { color:#444;
|
|
21
|
+
text-decoration:none;
|
|
22
|
+
}
|
|
23
|
+
|
|
24
|
+
textarea, input { outline: none;
|
|
25
|
+
border:none;
|
|
26
|
+
margin:0;
|
|
27
|
+
}
|
|
28
|
+
|
|
29
|
+
*, *:before, *:after { @include box-sizing(border-box);
|
|
30
|
+
}
|
|
31
|
+
|
|
32
|
+
.clearfix { *zoom: 1; // IE6/7 support
|
|
33
|
+
&:before, &:after { content:" ";
|
|
34
|
+
display:table;
|
|
35
|
+
}
|
|
36
|
+
&:after { clear: both;
|
|
37
|
+
}
|
|
38
|
+
}
|
|
39
|
+
|
|
40
|
+
.chr-panel {
|
|
41
|
+
&.left { float:left;
|
|
42
|
+
width:50%;
|
|
43
|
+
padding:1em 0.5em 1em 1em;
|
|
44
|
+
&.fixed { position:fixed;
|
|
45
|
+
}
|
|
46
|
+
}
|
|
47
|
+
&.right { float:right;
|
|
48
|
+
width:50%;
|
|
49
|
+
padding:1em 1em 1em 0.5em;
|
|
50
|
+
&.fixed { position:fixed;
|
|
51
|
+
right:0;
|
|
52
|
+
}
|
|
53
|
+
}
|
|
54
|
+
|
|
55
|
+
.container { background:#fff;
|
|
56
|
+
padding-top:1em;
|
|
57
|
+
@include shadow;
|
|
58
|
+
header { border-bottom:1px solid #f6f6f6;
|
|
59
|
+
padding-bottom:1em;
|
|
60
|
+
font-size:0.85em;
|
|
61
|
+
margin:0 1em;
|
|
62
|
+
line-height:1;
|
|
63
|
+
.title, .info { text-transform:uppercase;
|
|
64
|
+
font-weight:500;
|
|
65
|
+
color:#999;
|
|
66
|
+
}
|
|
67
|
+
.info { float:right;
|
|
68
|
+
}
|
|
69
|
+
.buttons { float:right;
|
|
70
|
+
font-size:1.2em;
|
|
71
|
+
a { padding:0.5em;
|
|
72
|
+
opacity:0.8;
|
|
73
|
+
&:hover { opacity:1;
|
|
74
|
+
}
|
|
75
|
+
&:last-child { padding-right:0;
|
|
76
|
+
}
|
|
77
|
+
}
|
|
78
|
+
.split { border-left:1px solid #f6f6f6;
|
|
79
|
+
}
|
|
80
|
+
}
|
|
81
|
+
}
|
|
82
|
+
}
|
|
83
|
+
}
|
|
84
|
+
}
|
|
@@ -0,0 +1,96 @@
|
|
|
1
|
+
$fontFileName: "general_foundicons";
|
|
2
|
+
$fontName: "GeneralFoundicons";
|
|
3
|
+
$classPrefix: "foundicon-";
|
|
4
|
+
|
|
5
|
+
@mixin i-class($name,$pua) {
|
|
6
|
+
.#{$classPrefix}#{$name}:before {
|
|
7
|
+
content: "\f#{$pua}";
|
|
8
|
+
}
|
|
9
|
+
}
|
|
10
|
+
|
|
11
|
+
@mixin face {
|
|
12
|
+
@font-face {
|
|
13
|
+
font-family: $fontName;
|
|
14
|
+
src: font-url('#{$fontFileName}.eot');
|
|
15
|
+
src: font-url('#{$fontFileName}.eot?#iefix') format('embedded-opentype'),
|
|
16
|
+
font-url('#{$fontFileName}.woff') format('woff'),
|
|
17
|
+
font-url('#{$fontFileName}.ttf') format('truetype'),
|
|
18
|
+
font-url('#{$fontFileName}.svg##{$fontName}') format('svg');
|
|
19
|
+
font-weight: normal;
|
|
20
|
+
font-style: normal;
|
|
21
|
+
}
|
|
22
|
+
}
|
|
23
|
+
|
|
24
|
+
/* font-face */
|
|
25
|
+
@include face;
|
|
26
|
+
|
|
27
|
+
/* global foundicon styles */
|
|
28
|
+
[class*="#{$classPrefix}"] {
|
|
29
|
+
display: inline;
|
|
30
|
+
width: auto;
|
|
31
|
+
height: auto;
|
|
32
|
+
line-height: inherit;
|
|
33
|
+
vertical-align: baseline;
|
|
34
|
+
background-image: none;
|
|
35
|
+
background-position: 0 0;
|
|
36
|
+
background-repeat: repeat;
|
|
37
|
+
}
|
|
38
|
+
[class*="#{$classPrefix}"]:before {
|
|
39
|
+
font-family: $fontName;
|
|
40
|
+
font-weight: normal;
|
|
41
|
+
font-style: normal;
|
|
42
|
+
text-decoration: inherit;
|
|
43
|
+
}
|
|
44
|
+
|
|
45
|
+
/* icons */
|
|
46
|
+
@include i-class(settings,"000");
|
|
47
|
+
@include i-class(heart,"001");
|
|
48
|
+
@include i-class(star,"002");
|
|
49
|
+
@include i-class(plus,"003");
|
|
50
|
+
@include i-class(minus,"004");
|
|
51
|
+
@include i-class(checkmark,"005");
|
|
52
|
+
@include i-class(remove,"006");
|
|
53
|
+
@include i-class(mail,"007");
|
|
54
|
+
@include i-class(calendar,"008");
|
|
55
|
+
@include i-class(page,"009");
|
|
56
|
+
@include i-class(tools,"00a");
|
|
57
|
+
@include i-class(globe,"00b");
|
|
58
|
+
@include i-class(home,"00c");
|
|
59
|
+
@include i-class(quote,"00d");
|
|
60
|
+
@include i-class(people,"00e");
|
|
61
|
+
@include i-class(monitor,"00f");
|
|
62
|
+
@include i-class(laptop,"010");
|
|
63
|
+
@include i-class(phone,"011");
|
|
64
|
+
@include i-class(cloud,"012");
|
|
65
|
+
@include i-class(error,"013");
|
|
66
|
+
@include i-class(right-arrow,"014");
|
|
67
|
+
@include i-class(left-arrow,"015");
|
|
68
|
+
@include i-class(up-arrow,"016");
|
|
69
|
+
@include i-class(down-arrow,"017");
|
|
70
|
+
@include i-class(trash,"018");
|
|
71
|
+
@include i-class(add-doc,"019");
|
|
72
|
+
@include i-class(edit,"01a");
|
|
73
|
+
@include i-class(lock,"01b");
|
|
74
|
+
@include i-class(unlock,"01c");
|
|
75
|
+
@include i-class(refresh,"01d");
|
|
76
|
+
@include i-class(paper-clip,"01e");
|
|
77
|
+
@include i-class(video,"01f");
|
|
78
|
+
@include i-class(photo,"020");
|
|
79
|
+
@include i-class(graph,"021");
|
|
80
|
+
@include i-class(idea,"022");
|
|
81
|
+
@include i-class(mic,"023");
|
|
82
|
+
@include i-class(cart,"024");
|
|
83
|
+
@include i-class(address-book,"025");
|
|
84
|
+
@include i-class(compass,"026");
|
|
85
|
+
@include i-class(flag,"027");
|
|
86
|
+
@include i-class(location,"028");
|
|
87
|
+
@include i-class(clock,"029");
|
|
88
|
+
@include i-class(folder,"02a");
|
|
89
|
+
@include i-class(inbox,"02b");
|
|
90
|
+
@include i-class(website,"02c");
|
|
91
|
+
@include i-class(smiley,"02d");
|
|
92
|
+
@include i-class(search,"02e");
|
|
93
|
+
|
|
94
|
+
|
|
95
|
+
|
|
96
|
+
|
|
@@ -0,0 +1,115 @@
|
|
|
1
|
+
|
|
2
|
+
@mixin character_editor {
|
|
3
|
+
|
|
4
|
+
.editor {
|
|
5
|
+
textarea { width:100%;
|
|
6
|
+
padding:1em;
|
|
7
|
+
border:none;
|
|
8
|
+
font-size:0.85em;
|
|
9
|
+
margin-top:1px; // some issue;
|
|
10
|
+
resize: none;
|
|
11
|
+
}
|
|
12
|
+
|
|
13
|
+
header { margin:54px 1em 0 1em;
|
|
14
|
+
.title input { width:100%;
|
|
15
|
+
font-size:1.2em;
|
|
16
|
+
padding:0.6em 0.7em 0.5em;
|
|
17
|
+
font-weight: 600;
|
|
18
|
+
@include shadow;
|
|
19
|
+
}
|
|
20
|
+
.permalink { font-size:0.85em;
|
|
21
|
+
font-weight:400;
|
|
22
|
+
opacity:0.8;
|
|
23
|
+
line-height:2;
|
|
24
|
+
.slug { font-weight:600;
|
|
25
|
+
}
|
|
26
|
+
}
|
|
27
|
+
}
|
|
28
|
+
|
|
29
|
+
article { overflow-y:scroll;
|
|
30
|
+
}
|
|
31
|
+
|
|
32
|
+
footer { width:100%;
|
|
33
|
+
padding:.5em 1em;
|
|
34
|
+
background:#333;
|
|
35
|
+
position:fixed;
|
|
36
|
+
bottom:0;
|
|
37
|
+
|
|
38
|
+
button { text-transform:uppercase;
|
|
39
|
+
color:#eee;
|
|
40
|
+
border:none;
|
|
41
|
+
@include border-radius(3px);
|
|
42
|
+
padding:.5em 1em;
|
|
43
|
+
cursor:pointer;
|
|
44
|
+
@include single-box-shadow(#333, 0px, 0px, 1px, 1px, false);
|
|
45
|
+
&:hover,&.active { @include single-box-shadow(#888, 0px, 0px, 1px, 1px, false);
|
|
46
|
+
}
|
|
47
|
+
}
|
|
48
|
+
.save-draft { background:#2763a5;
|
|
49
|
+
float:right;
|
|
50
|
+
margin-right:5px;
|
|
51
|
+
}
|
|
52
|
+
.publish { background:#a71820;
|
|
53
|
+
float:right;
|
|
54
|
+
}
|
|
55
|
+
.cancel { background:#444;
|
|
56
|
+
}
|
|
57
|
+
.settings { width:35px;
|
|
58
|
+
float:right;
|
|
59
|
+
margin-right:5px;
|
|
60
|
+
.settings-box { display:none;
|
|
61
|
+
}
|
|
62
|
+
button { background:#444;
|
|
63
|
+
padding-top:6px;
|
|
64
|
+
line-height:1;
|
|
65
|
+
}
|
|
66
|
+
&.shown .settings-box { display:block;
|
|
67
|
+
}
|
|
68
|
+
}
|
|
69
|
+
}
|
|
70
|
+
|
|
71
|
+
.settings-box { position: absolute;
|
|
72
|
+
right:28px;
|
|
73
|
+
//min-height:200px;
|
|
74
|
+
bottom:56px;
|
|
75
|
+
width:460px;
|
|
76
|
+
background: #333;
|
|
77
|
+
border: 4px solid #333;
|
|
78
|
+
text-align: left;
|
|
79
|
+
@include border-radius(6px);
|
|
80
|
+
color:#fff;
|
|
81
|
+
padding:10px;
|
|
82
|
+
|
|
83
|
+
//@include single-box-shadow(rgba(0,0,0,0.3), 0px, 1px, 4px, 0px, false);
|
|
84
|
+
|
|
85
|
+
-moz-box-shadow: 0 1px 4px rgba(0,0,0,0.3);
|
|
86
|
+
-webkit-filter: drop-shadow(0 1px 4px rgba(0,0,0,0.3));
|
|
87
|
+
filter: drop-shadow(0 1px 4px rgba(0,0,0,0.3));
|
|
88
|
+
|
|
89
|
+
&:after, &:before { top: 100%;
|
|
90
|
+
border: solid transparent;
|
|
91
|
+
content: " ";
|
|
92
|
+
height: 0;
|
|
93
|
+
width: 0;
|
|
94
|
+
position: absolute;
|
|
95
|
+
pointer-events: none;
|
|
96
|
+
}
|
|
97
|
+
|
|
98
|
+
&:after { border-color: rgba(0, 0, 0, 0);
|
|
99
|
+
border-top-color: fff;
|
|
100
|
+
border-width: 10px;
|
|
101
|
+
left: 50%;
|
|
102
|
+
margin-left: -10px;
|
|
103
|
+
}
|
|
104
|
+
|
|
105
|
+
&:before { border-color: rgba(51, 51, 51, 0);
|
|
106
|
+
border-top-color: #333;
|
|
107
|
+
border-width: 16px;
|
|
108
|
+
left: 50%;
|
|
109
|
+
margin-left: 42px;
|
|
110
|
+
}
|
|
111
|
+
}
|
|
112
|
+
}
|
|
113
|
+
|
|
114
|
+
}
|
|
115
|
+
|
|
@@ -0,0 +1,73 @@
|
|
|
1
|
+
@mixin character_index {
|
|
2
|
+
.index {
|
|
3
|
+
li { position:relative;
|
|
4
|
+
a { border-bottom:1px solid #f6f6f6;
|
|
5
|
+
border-top:1px solid #f6f6f6;
|
|
6
|
+
padding:1em 0;
|
|
7
|
+
height:6em;
|
|
8
|
+
display:block;
|
|
9
|
+
color:#444;
|
|
10
|
+
margin:0 1em;
|
|
11
|
+
margin-top:-1px;
|
|
12
|
+
position:relative;
|
|
13
|
+
&.active { margin-left:0;
|
|
14
|
+
margin-right:0;
|
|
15
|
+
padding-left:1em;
|
|
16
|
+
padding-right:1em;
|
|
17
|
+
z-index:10;
|
|
18
|
+
position:relative;
|
|
19
|
+
border-bottom:1px solid #ddd;
|
|
20
|
+
border-top:1px solid #ddd;
|
|
21
|
+
|
|
22
|
+
.views { opacity:1;
|
|
23
|
+
}
|
|
24
|
+
img { left:1em;
|
|
25
|
+
}
|
|
26
|
+
}
|
|
27
|
+
}
|
|
28
|
+
|
|
29
|
+
&:last-child a { border-bottom:none;
|
|
30
|
+
}
|
|
31
|
+
|
|
32
|
+
img { width:4em;
|
|
33
|
+
height:4em;
|
|
34
|
+
@include border-radius(2em);
|
|
35
|
+
position:absolute;
|
|
36
|
+
left:0;
|
|
37
|
+
}
|
|
38
|
+
.meta, .date, .views { color:#999;
|
|
39
|
+
display:block;
|
|
40
|
+
}
|
|
41
|
+
.left { float:left;
|
|
42
|
+
width:70%;
|
|
43
|
+
padding-left:5em;
|
|
44
|
+
}
|
|
45
|
+
.right { float:right;
|
|
46
|
+
width:30%;
|
|
47
|
+
text-align:right;
|
|
48
|
+
}
|
|
49
|
+
|
|
50
|
+
.title { display:block;
|
|
51
|
+
font-weight:500;
|
|
52
|
+
line-height:1.2;
|
|
53
|
+
}
|
|
54
|
+
.date { font-size:0.85em;
|
|
55
|
+
padding-top:0.25em;
|
|
56
|
+
}
|
|
57
|
+
.meta { font-size:0.85em;
|
|
58
|
+
padding-top:0.5em;
|
|
59
|
+
}
|
|
60
|
+
.views { font-size:2.7em;
|
|
61
|
+
font-weight:500;
|
|
62
|
+
padding-top:0.15em;
|
|
63
|
+
opacity:0.5;
|
|
64
|
+
}
|
|
65
|
+
}
|
|
66
|
+
li.placeholder { text-align:center;
|
|
67
|
+
padding:2em 0;
|
|
68
|
+
}
|
|
69
|
+
}
|
|
70
|
+
}
|
|
71
|
+
|
|
72
|
+
|
|
73
|
+
|
|
@@ -0,0 +1,49 @@
|
|
|
1
|
+
@mixin character_preview {
|
|
2
|
+
//
|
|
3
|
+
// Active admin blog article styles
|
|
4
|
+
//
|
|
5
|
+
article { padding:0em 1em 5em 1em;
|
|
6
|
+
}
|
|
7
|
+
|
|
8
|
+
|
|
9
|
+
//
|
|
10
|
+
// Put in here your blog post styles
|
|
11
|
+
//
|
|
12
|
+
article {
|
|
13
|
+
// Define font size for blog post preview
|
|
14
|
+
// Add some responsiveness here, to make it look good on big screens
|
|
15
|
+
// Content element is used to render proper blog post in article container
|
|
16
|
+
.content { font-size:12px;
|
|
17
|
+
}
|
|
18
|
+
|
|
19
|
+
.content { max-width:700px;
|
|
20
|
+
margin:0 auto;
|
|
21
|
+
color:#333;
|
|
22
|
+
font-family: Times, sans-serif;
|
|
23
|
+
|
|
24
|
+
p, li { font-size:1.3em;
|
|
25
|
+
line-height:1.6em;
|
|
26
|
+
}
|
|
27
|
+
|
|
28
|
+
p { margin-bottom:0.2em;
|
|
29
|
+
}
|
|
30
|
+
|
|
31
|
+
li { padding-left:1em;
|
|
32
|
+
&:before { content:"— ";
|
|
33
|
+
}
|
|
34
|
+
}
|
|
35
|
+
|
|
36
|
+
p + p { text-indent: 2em;
|
|
37
|
+
}
|
|
38
|
+
|
|
39
|
+
h1 { font-size: 1.75em;
|
|
40
|
+
line-height: 1.3em;
|
|
41
|
+
margin: 1em auto .5em;
|
|
42
|
+
}
|
|
43
|
+
h2 { font-size: 1.65em;
|
|
44
|
+
line-height: 1.3em;
|
|
45
|
+
margin: 1em auto .5em;
|
|
46
|
+
}
|
|
47
|
+
}
|
|
48
|
+
}
|
|
49
|
+
}
|
|
@@ -0,0 +1,32 @@
|
|
|
1
|
+
@import "base";
|
|
2
|
+
@import "icons";
|
|
3
|
+
@import "view_index";
|
|
4
|
+
@import "view_preview";
|
|
5
|
+
@import "view_editor";
|
|
6
|
+
|
|
7
|
+
body.active_admin.admin_character { background:$GRAY;
|
|
8
|
+
#main { @include global-reset;
|
|
9
|
+
@include character_body;
|
|
10
|
+
@include character_index;
|
|
11
|
+
@include character_preview;
|
|
12
|
+
@include character_editor;
|
|
13
|
+
margin-top:40px;
|
|
14
|
+
}
|
|
15
|
+
|
|
16
|
+
// Disable page header and footer
|
|
17
|
+
#active_admin_content,
|
|
18
|
+
#title_bar,
|
|
19
|
+
.footer { display:none;
|
|
20
|
+
}
|
|
21
|
+
|
|
22
|
+
#header { padding:9px 0px;
|
|
23
|
+
position:fixed;
|
|
24
|
+
width:100%;
|
|
25
|
+
.site_title { margin-left:30px;
|
|
26
|
+
}
|
|
27
|
+
#utility_nav { margin-right:30px;
|
|
28
|
+
}
|
|
29
|
+
}
|
|
30
|
+
}
|
|
31
|
+
|
|
32
|
+
|