skullstack 0.0.1 → 0.0.2
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- checksums.yaml +4 -4
- data/app/assets/stylesheets/application.scss +1 -0
- data/app/assets/stylesheets/skullstack.scss +6 -0
- data/app/assets/stylesheets/skullstack/base/_base.scss +4 -0
- data/app/assets/stylesheets/skullstack/base/_buttons.scss +13 -0
- data/app/assets/stylesheets/skullstack/base/_colors.scss +15 -0
- data/app/assets/stylesheets/skullstack/base/_fonts.scss +88 -0
- data/app/assets/stylesheets/skullstack/marketing/_marketing.scss +13 -0
- data/app/assets/stylesheets/skullstack/marketing/_sections.scss +33 -0
- data/app/helpers/skullstack_helper.rb +2 -0
- data/app/views/layouts/application.html.erb +16 -0
- data/lib/skullstack/version.rb +1 -1
- data/lib/tasks/skullstack_tasks.rake +23 -4
- metadata +12 -2
checksums.yaml
CHANGED
@@ -1,7 +1,7 @@
|
|
1
1
|
---
|
2
2
|
SHA1:
|
3
|
-
metadata.gz:
|
4
|
-
data.tar.gz:
|
3
|
+
metadata.gz: 95c62dead2aebae7e3cb9ed8c2df01627185a20d
|
4
|
+
data.tar.gz: b8fc5d326216fedc06802d097e9aa3ab05af7cf3
|
5
5
|
SHA512:
|
6
|
-
metadata.gz:
|
7
|
-
data.tar.gz:
|
6
|
+
metadata.gz: c55bc53e2b5abeee6af1ff0b502093b7bc2d9473641688c59c848ccc1074a3619a970bbddf5116df646254d75a31c6e52c25e85c327e5240d5d806b3a8ad596a
|
7
|
+
data.tar.gz: 1c64930637fda283ac4b27367429263f2ea1cdfea8bf489161ea4ff6745974721e8af679b6ec47ded9cbfa0821d7d62457d9035c7126d544b01eb5f42c582a01
|
@@ -0,0 +1 @@
|
|
1
|
+
@import 'skullstack';
|
@@ -0,0 +1,13 @@
|
|
1
|
+
.btn{
|
2
|
+
&.btn-primary{
|
3
|
+
background-color: $primary; border-color: $primary;
|
4
|
+
&:hover{
|
5
|
+
background-color: darken($primary, 10%); border-color: darken($primary, 10%);
|
6
|
+
}
|
7
|
+
}
|
8
|
+
&.btn-lg{
|
9
|
+
padding: 0.75rem 2.5rem;
|
10
|
+
font-size: 1rem;
|
11
|
+
border-radius: 0.5rem;
|
12
|
+
}
|
13
|
+
}
|
@@ -0,0 +1,15 @@
|
|
1
|
+
// Branding Colors
|
2
|
+
$black: #000000;
|
3
|
+
$white: #FFFFFF;
|
4
|
+
$red: #FF2C55;
|
5
|
+
$blue: #027AFF;
|
6
|
+
$grey: #F1F6FB;
|
7
|
+
$purple: #6331EE;
|
8
|
+
|
9
|
+
// App Colors
|
10
|
+
$background-color: #FFFFFF;
|
11
|
+
$text-color: #000000;
|
12
|
+
|
13
|
+
// App Buttons
|
14
|
+
$primary: #FE3958;
|
15
|
+
$secondary: #FFFFFF;
|
@@ -0,0 +1,88 @@
|
|
1
|
+
// Font Size Mixin
|
2
|
+
@mixin font-size($fs-map, $fs-breakpoints: $breakpoints) {
|
3
|
+
@each $fs-breakpoint, $fs-font-size in $fs-map {
|
4
|
+
@if $fs-breakpoint == null {
|
5
|
+
@include make-font-size($fs-font-size);
|
6
|
+
}
|
7
|
+
@else {
|
8
|
+
// If $fs-font-size is a key that exists in
|
9
|
+
// $fs-breakpoints, use the value
|
10
|
+
@if map-has-key($fs-breakpoints, $fs-breakpoint) {
|
11
|
+
$fs-breakpoint: map-get($fs-breakpoints, $fs-breakpoint);
|
12
|
+
}
|
13
|
+
@media screen and (min-width: $fs-breakpoint) {
|
14
|
+
@include make-font-size($fs-font-size);
|
15
|
+
}
|
16
|
+
}
|
17
|
+
}
|
18
|
+
}
|
19
|
+
|
20
|
+
// Utility function for mixin font-size
|
21
|
+
@mixin make-font-size($fs-font-size) {
|
22
|
+
// If $fs-font-size is a list, include
|
23
|
+
// both font-size and line-height
|
24
|
+
@if type-of($fs-font-size) == "list" {
|
25
|
+
font-size: nth($fs-font-size, 1);
|
26
|
+
@if (length($fs-font-size) > 1) {
|
27
|
+
line-height: nth($fs-font-size, 2);
|
28
|
+
}
|
29
|
+
}
|
30
|
+
@else {
|
31
|
+
font-size: $fs-font-size;
|
32
|
+
}
|
33
|
+
}
|
34
|
+
|
35
|
+
//
|
36
|
+
//
|
37
|
+
// Break Point Sizes
|
38
|
+
//
|
39
|
+
//
|
40
|
+
$breakpoints: (
|
41
|
+
small : 480px,
|
42
|
+
medium: 640px,
|
43
|
+
large : 1024px
|
44
|
+
);
|
45
|
+
|
46
|
+
//
|
47
|
+
//
|
48
|
+
// H1
|
49
|
+
//
|
50
|
+
//
|
51
|
+
$h1-font-sizes: (
|
52
|
+
null : 28px,
|
53
|
+
small : 31px,
|
54
|
+
medium : 33px,
|
55
|
+
large : 36px
|
56
|
+
);
|
57
|
+
|
58
|
+
//
|
59
|
+
//
|
60
|
+
// H1 Hero Sizes
|
61
|
+
//
|
62
|
+
//
|
63
|
+
$h1-hero-font-sizes: (
|
64
|
+
null : 32px,
|
65
|
+
small : 32px,
|
66
|
+
medium : 48px,
|
67
|
+
large : 60px
|
68
|
+
);
|
69
|
+
|
70
|
+
h1 {
|
71
|
+
@include font-size($h1-font-sizes);
|
72
|
+
}
|
73
|
+
|
74
|
+
//
|
75
|
+
//
|
76
|
+
// P, UL, OL
|
77
|
+
//
|
78
|
+
//
|
79
|
+
$p-font-sizes: (
|
80
|
+
null : 15px,
|
81
|
+
small : 16px,
|
82
|
+
medium : 17px,
|
83
|
+
large : 19px
|
84
|
+
);
|
85
|
+
|
86
|
+
p, ul, ol {
|
87
|
+
@include font-size($p-font-sizes);
|
88
|
+
}
|
@@ -0,0 +1,13 @@
|
|
1
|
+
body{
|
2
|
+
font-family: 'Roboto', sans-serif;
|
3
|
+
font-style: normal;
|
4
|
+
font-weight:400;
|
5
|
+
line-height: 1.6;
|
6
|
+
font-size: 14px;
|
7
|
+
background-color: $background-color;
|
8
|
+
color: $text-color;
|
9
|
+
-webkit-font-smoothing: antialiased;
|
10
|
+
text-rendering: optimizelegibility;
|
11
|
+
}
|
12
|
+
|
13
|
+
@import 'sections';
|
@@ -0,0 +1,33 @@
|
|
1
|
+
section{
|
2
|
+
width: 100%;
|
3
|
+
min-height: 75vh;
|
4
|
+
padding: 10px;
|
5
|
+
|
6
|
+
.row{
|
7
|
+
height:100%;
|
8
|
+
&.center{
|
9
|
+
text-align: center;
|
10
|
+
}
|
11
|
+
}
|
12
|
+
|
13
|
+
// Types of Sections
|
14
|
+
&.hero{
|
15
|
+
h1{
|
16
|
+
// @include font-size($h1-hero-font-sizes);
|
17
|
+
line-height: 1.5em;
|
18
|
+
}
|
19
|
+
}
|
20
|
+
|
21
|
+
// Size
|
22
|
+
&.half{height: 50vh;}
|
23
|
+
&.full{height: 100vh;}
|
24
|
+
|
25
|
+
// Colors
|
26
|
+
&.blue{background-color: $blue; color: $white;}
|
27
|
+
&.black{background-color: $black; color: $white;}
|
28
|
+
|
29
|
+
// Inside Elements
|
30
|
+
.container{
|
31
|
+
height: 100%;
|
32
|
+
}
|
33
|
+
}
|
@@ -0,0 +1,16 @@
|
|
1
|
+
<!DOCTYPE html>
|
2
|
+
<html lang="en">
|
3
|
+
<head>
|
4
|
+
<meta charset="utf-8">
|
5
|
+
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
|
6
|
+
<meta http-equiv="x-ua-compatible" content="ie=edge">
|
7
|
+
<title>Home</title>
|
8
|
+
<link href='https://fonts.googleapis.com/css?family=Roboto:400,500,700,300' rel='stylesheet' type='text/css'>
|
9
|
+
<%= stylesheet_link_tag 'application', media: 'all', 'data-turbolinks-track' => true %>
|
10
|
+
<%= javascript_include_tag 'application', 'data-turbolinks-track' => true %>
|
11
|
+
<%= csrf_meta_tags %>
|
12
|
+
</head>
|
13
|
+
<body>
|
14
|
+
<%= yield %>
|
15
|
+
</body>
|
16
|
+
</html>
|
data/lib/skullstack/version.rb
CHANGED
@@ -1,4 +1,23 @@
|
|
1
|
-
|
2
|
-
|
3
|
-
|
4
|
-
|
1
|
+
namespace :skullstack do
|
2
|
+
desc "Copy over sample application layout and scss files."
|
3
|
+
task :init do
|
4
|
+
Rake::Task["skullstack:layout"].invoke
|
5
|
+
Rake::Task["skullstack:stylesheet"].invoke
|
6
|
+
end
|
7
|
+
|
8
|
+
desc "Copy over sample application layout files."
|
9
|
+
task :layout do
|
10
|
+
# Application Layout
|
11
|
+
source = File.join(Gem.loaded_specs["skullstack"].full_gem_path, "app", "views", "layouts", "application.html.erb")
|
12
|
+
target = File.join(Rails.root, "app", "views", "layouts", "application.html.erb")
|
13
|
+
FileUtils.cp_r source, target
|
14
|
+
end
|
15
|
+
|
16
|
+
desc "Copy over sample application scss files."
|
17
|
+
task :stylesheet do
|
18
|
+
# Application Layout
|
19
|
+
source = File.join(Gem.loaded_specs["skullstack"].full_gem_path, "app", "assets", "stylesheets", "application.scss")
|
20
|
+
target = File.join(Rails.root, "app", "assets", "stylesheets", "application.scss")
|
21
|
+
FileUtils.cp_r source, target
|
22
|
+
end
|
23
|
+
end
|
metadata
CHANGED
@@ -1,14 +1,14 @@
|
|
1
1
|
--- !ruby/object:Gem::Specification
|
2
2
|
name: skullstack
|
3
3
|
version: !ruby/object:Gem::Version
|
4
|
-
version: 0.0.
|
4
|
+
version: 0.0.2
|
5
5
|
platform: ruby
|
6
6
|
authors:
|
7
7
|
- Matthew Black
|
8
8
|
autorequire:
|
9
9
|
bindir: bin
|
10
10
|
cert_chain: []
|
11
|
-
date: 2016-11-
|
11
|
+
date: 2016-11-28 00:00:00.000000000 Z
|
12
12
|
dependencies:
|
13
13
|
- !ruby/object:Gem::Dependency
|
14
14
|
name: rails
|
@@ -54,6 +54,16 @@ files:
|
|
54
54
|
- MIT-LICENSE
|
55
55
|
- README.md
|
56
56
|
- Rakefile
|
57
|
+
- app/assets/stylesheets/application.scss
|
58
|
+
- app/assets/stylesheets/skullstack.scss
|
59
|
+
- app/assets/stylesheets/skullstack/base/_base.scss
|
60
|
+
- app/assets/stylesheets/skullstack/base/_buttons.scss
|
61
|
+
- app/assets/stylesheets/skullstack/base/_colors.scss
|
62
|
+
- app/assets/stylesheets/skullstack/base/_fonts.scss
|
63
|
+
- app/assets/stylesheets/skullstack/marketing/_marketing.scss
|
64
|
+
- app/assets/stylesheets/skullstack/marketing/_sections.scss
|
65
|
+
- app/helpers/skullstack_helper.rb
|
66
|
+
- app/views/layouts/application.html.erb
|
57
67
|
- lib/skullstack.rb
|
58
68
|
- lib/skullstack/version.rb
|
59
69
|
- lib/tasks/skullstack_tasks.rake
|