spuit 0.1.1 → 0.1.2
Sign up to get free protection for your applications and to get access to all the features.
- checksums.yaml +4 -4
- data/assets/html/index.ejs +3 -0
- data/assets/stylesheets/styles.scss +18 -0
- data/lib/spuit/version.rb +1 -1
- data/package.json +1 -1
- data/scss/components/_triangle.scss +27 -28
- data/scss/modules/_background-image.scss +10 -0
- data/scss/variables/_svgs.scss +5 -0
- metadata +2 -2
checksums.yaml
CHANGED
@@ -1,7 +1,7 @@
|
|
1
1
|
---
|
2
2
|
SHA256:
|
3
|
-
metadata.gz:
|
4
|
-
data.tar.gz:
|
3
|
+
metadata.gz: 7d5d0ae0eb74464233d67d5e50880957780f3c5152ca1ea22169d9584b657e6a
|
4
|
+
data.tar.gz: 4875ecdea8fa1c5397ecea9af959e0d5c2c26fdf01d2384ba934c223e59c2549
|
5
5
|
SHA512:
|
6
|
-
metadata.gz:
|
7
|
-
data.tar.gz:
|
6
|
+
metadata.gz: 0c276fb77296b3e8b03accca9acab129185c15cad883528043fcd7d2e51523243c4839788ef59f2ec10e522bcd85c88c450ef3a694f1918352c048e6b7fb05fa
|
7
|
+
data.tar.gz: 477eb76eb340839eb03136a776f671ccb31547c34e4f559f6e8cab8ee99c4306d22c069b30e0813354649b3dde692d703cfc2365cc385d109e8dedda920358ff
|
data/assets/html/index.ejs
CHANGED
@@ -2,6 +2,7 @@
|
|
2
2
|
@import '../../scss/includes/grid';
|
3
3
|
@import '../../scss/components/wrap';
|
4
4
|
@import '../../scss/components/wordwrap-fadeout';
|
5
|
+
@import '../../scss/components/triangle';
|
5
6
|
|
6
7
|
@import 'styles/config/variables';
|
7
8
|
@import 'styles/config/mixins';
|
@@ -166,8 +167,25 @@ body {
|
|
166
167
|
.icon-hatena {
|
167
168
|
@include icon-hatena;
|
168
169
|
}
|
170
|
+
|
171
|
+
.icon-svg {
|
172
|
+
&::before {
|
173
|
+
content: '';
|
174
|
+
@include background-map-svg($map-svg-star);
|
175
|
+
}
|
176
|
+
}
|
169
177
|
|
170
178
|
.wordwrap-fadeout {
|
171
179
|
@include wordwrap-fadeout;
|
172
180
|
}
|
181
|
+
|
182
|
+
.triangle-container {
|
183
|
+
@include triangle(#2dd, 10px, 15px, 0, 50%, "left", "after");
|
184
|
+
// @include triangle(#2dd, 15px, 10px, 50%, 0, "down", "after");
|
185
|
+
|
186
|
+
display: inline-block;
|
187
|
+
width: 30px;
|
188
|
+
height: 30px;
|
189
|
+
background-color: #ddd;
|
190
|
+
}
|
173
191
|
}
|
data/lib/spuit/version.rb
CHANGED
data/package.json
CHANGED
@@ -1,46 +1,45 @@
|
|
1
1
|
// Example:
|
2
|
-
//
|
2
|
+
// @include triangle(#2dd, 15px, 10px, 50%, 0, "down", "after");
|
3
3
|
|
4
|
-
@mixin triangle($c: #2dd, $w:
|
4
|
+
@mixin triangle($c: #2dd, $w: 15px, $h: 10px, $l: 50%, $t: 0, $direction: "down", $element: "after") {
|
5
5
|
position: relative;
|
6
|
+
|
6
7
|
&:#{$element} {
|
7
8
|
content: "";
|
8
9
|
position: absolute;
|
9
|
-
|
10
|
+
border-style: solid;
|
11
|
+
display: inline-block;
|
10
12
|
height: 0;
|
11
|
-
|
12
|
-
border-top-color: $c;
|
13
|
+
width: 0;
|
13
14
|
}
|
14
|
-
|
15
|
+
|
16
|
+
@if $direction == "up" {
|
15
17
|
&:#{$element} {
|
16
|
-
|
17
|
-
|
18
|
-
|
19
|
-
top: $t;
|
18
|
+
border-color: transparent transparent $c;
|
19
|
+
border-width: 0 ($w / 2) $h;
|
20
|
+
left: calc(#{$l} - #{$w/2});
|
21
|
+
top: $t - $h;
|
20
22
|
}
|
21
|
-
}
|
22
|
-
@if ($direction == "right") {
|
23
|
+
} @else if $direction == "right" {
|
23
24
|
&:#{$element} {
|
24
|
-
|
25
|
-
|
26
|
-
right: $l;
|
27
|
-
top: $t;
|
25
|
+
border-color: transparent transparent transparent $c;
|
26
|
+
border-width: ($h / 2) 0 ($h / 2) $w;
|
27
|
+
right: $l - $w;
|
28
|
+
top: calc(#{$t} - #{$h/2});
|
28
29
|
}
|
29
|
-
}
|
30
|
-
@if ($direction == "top") {
|
30
|
+
} @else if $direction == "down" {
|
31
31
|
&:#{$element} {
|
32
|
-
|
33
|
-
|
34
|
-
left: $l;
|
35
|
-
|
32
|
+
border-color: $c transparent transparent;
|
33
|
+
border-width: $h ($w / 2) 0;
|
34
|
+
left: calc(#{$l} - #{$w/2});
|
35
|
+
bottom: $t - $h;
|
36
36
|
}
|
37
|
-
}
|
38
|
-
@if ($direction == "bottom") {
|
37
|
+
} @else if $direction == "left" {
|
39
38
|
&:#{$element} {
|
40
|
-
|
41
|
-
|
42
|
-
left: $l;
|
43
|
-
|
39
|
+
border-color: transparent $c transparent transparent;
|
40
|
+
border-width: ($h / 2) $w ($h / 2) 0;
|
41
|
+
left: $l - $w;
|
42
|
+
top: calc(#{$t} - #{$h/2});
|
44
43
|
}
|
45
44
|
}
|
46
45
|
}
|
@@ -42,6 +42,16 @@
|
|
42
42
|
line-height: $h;
|
43
43
|
}
|
44
44
|
|
45
|
+
@mixin background-map-svg($map-svg) {
|
46
|
+
display: inline-block;
|
47
|
+
background-image: url("data:image/png;base64, #{map-get($map-svg, base64)}");
|
48
|
+
background-repeat: no-repeat;
|
49
|
+
background-position: center center;
|
50
|
+
background-size: cover;
|
51
|
+
width: map-get($map-svg, width);
|
52
|
+
height: map-get($map-svg, height);
|
53
|
+
}
|
54
|
+
|
45
55
|
//for rails
|
46
56
|
@mixin background-image-url($w: 50px, $h: 50px, $path: '/images/xxx', $extension: 'png') {
|
47
57
|
display: inline-block;
|
data/scss/variables/_svgs.scss
CHANGED
@@ -5,3 +5,8 @@ $svg-twitter: '%3Csvg%20width%3D%2226px%22%20height%3D%2222px%22%20viewBox%3D%2
|
|
5
5
|
$svg-hatena: '%0A%3Csvg%20width%3D%2222px%22%20height%3D%2220px%22%20viewBox%3D%229%2010%2022%2020%22%20version%3D%221.1%22%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20xmlns%3Axlink%3D%22http%3A//www.w3.org/1999/xlink%22%3E%0A%20%20%20%20%3Cpath%20d%3D%22M17.91544%2C25.36632%20C17.43128%2C25.66368%2016.59696%2C25.80976%2015.42632%2C25.80976%20L13.69448%2C25.80976%20L13.69448%2C21.83744%20L15.50112%2C21.83744%20C16.70336%2C21.83744%2017.53432%2C21.98864%2017.97632%2C22.29072%20C18.42552%2C22.59296%2018.64648%2C23.12664%2018.64648%2C23.89272%20C18.64648%2C24.57832%2018.40432%2C25.07072%2017.91544%2C25.36632%20Z%20M13.69448%2C14.93992%20L14.75864%2C14.93992%20C15.98848%2C14.93992%2016.81472%2C15.0788%2017.24112%2C15.35504%20C17.66192%2C15.63296%2017.8764%2C16.11224%2017.8764%2C16.79536%20C17.8764%2C17.45248%2017.64808%2C17.91544%2017.1964%2C18.18688%20C16.73904%2C18.45328%2015.9048%2C18.58816%2014.68384%2C18.58816%20L13.69448%2C18.58816%20L13.69448%2C14.93992%20Z%20M22.25328%2C20.64824%20C21.52864%2C19.8384%2020.52144%2C19.38336%2019.22888%2C19.28504%20C20.37848%2C18.9716%2021.21344%2C18.51336%2021.74152%2C17.90088%20C22.26712%2C17.29656%2022.52784%2C16.47616%2022.52784%2C15.44368%20C22.52784%2C14.6264%2022.3492%2C13.90328%2022.00304%2C13.27872%20C21.64816%2C12.658%2021.13792%2C12.16088%2020.46776%2C11.78896%20C19.8812%2C11.4664%2019.18432%2C11.23896%2018.37192%2C11.1048%20C17.55552%2C10.9748%2016.12656%2C10.90912%2014.07624%2C10.90912%20L9.09088%2C10.90912%20L9.09088%2C29.09088%20L14.22736%2C29.09088%20C16.29064%2C29.09088%2017.77888%2C29.01864%2018.68872%2C28.8804%20C19.59768%2C28.73752%2020.36048%2C28.49704%2020.97792%2C28.16736%20C21.74152%2C27.76432%2022.32392%2C27.19088%2022.73096%2C26.45408%20C23.1404%2C25.71488%2023.34344%2C24.86256%2023.34344%2C23.88776%20C23.34344%2C22.53944%2022.98024%2C21.45576%2022.25328%2C20.64824%20L22.25328%2C20.64824%20Z%22%20id%3D%22Fill-4%22%20stroke%3D%22none%22%20fill%3D%22%23FFFFFF%22%20fill-rule%3D%22evenodd%22%3E%3C/path%3E%0A%20%20%20%20%3Cpath%20d%3D%22M28.60648%2C24.48488%20C27.33392%2C24.48488%2026.30304%2C25.51504%2026.30304%2C26.78752%20C26.30304%2C28.06%2027.33392%2C29.09088%2028.60648%2C29.09088%20C29.87736%2C29.09088%2030.90912%2C28.06%2030.90912%2C26.78752%20C30.90912%2C25.51504%2029.87736%2C24.48488%2028.60648%2C24.48488%22%20id%3D%22Fill-5%22%20stroke%3D%22none%22%20fill%3D%22%23FFFFFF%22%20fill-rule%3D%22evenodd%22%3E%3C/path%3E%0A%20%20%20%20%3Cpolygon%20id%3D%22Fill-6%22%20stroke%3D%22none%22%20fill%3D%22%23FFFFFF%22%20fill-rule%3D%22evenodd%22%20points%3D%2226.60608%2023.0311998%2030.60608%2023.0311998%2030.60608%2010.9099998%2026.60608%2010.9099998%22%3E%3C/polygon%3E%0A%3C/svg%3E';
|
6
6
|
|
7
7
|
$svg-facebook: '%0A%3Csvg%20width%3D%2218px%22%20height%3D%2234px%22%20viewBox%3D%2216%206%2018%2034%22%20version%3D%221.1%22%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20xmlns%3Axlink%3D%22http%3A//www.w3.org/1999/xlink%22%3E%0A%20%20%20%20%3Cpath%20d%3D%22M27.4852836%2C39.9843284%20L27.4852836%2C24.558209%20L32.6633433%2C24.558209%20L33.4385672%2C18.5462687%20L27.4852836%2C18.5462687%20L27.4852836%2C14.7079104%20C27.4852836%2C12.9673134%2027.9685672%2C11.781194%2030.4646866%2C11.781194%20L33.6482687%2C11.7797015%20L33.6482687%2C6.40268657%20C33.0975224%2C6.32955224%2031.2078209%2C6.1658209%2029.0093134%2C6.1658209%20C24.4193134%2C6.1658209%2021.2770746%2C8.96746269%2021.2770746%2C14.1126866%20L21.2770746%2C18.5462687%20L16.0858806%2C18.5462687%20L16.0858806%2C24.558209%20L21.2770746%2C24.558209%20L21.2770746%2C39.9843284%20L27.4852836%2C39.9843284%20Z%22%20id%3D%22Fill-4%22%20stroke%3D%22none%22%20fill%3D%22%23FEFEFE%22%20fill-rule%3D%22evenodd%22%3E%3C/path%3E%0A%3C/svg%3E';
|
8
|
+
|
9
|
+
$map-svg-star: (
|
10
|
+
width: 30px,
|
11
|
+
height: 30px,
|
12
|
+
base64: 'iVBORw0KGgoAAAANSUhEUgAAAB4AAAAcCAYAAAB2+A+pAAAAAXNSR0IArs4c6QAAAm9JREFUSA21V01rFEEQfTUbg4iePAgLggFXjZt4EIyJn2CO/gFP3vwD/gA95G948uYf8KYn0agXEeNHEoggLHjwpATRNeWrTrozM9szsz2rDU1XV9V7r2u6Z3oXaNn0La5bbwnHVFsgcff2sMsTcKRB9R0us1p1nXYaejc7awOC4n7A5e3gbDakOaWYoe+xiCFeFLxTWJKzWC34GibpFQ9z1XryYdhv72kckyrm3l7ADl5FWTMsyBxeR2MRZ1rFWlNZXSwiPHbFuoYF/MHLCMe+q4OL0q94IvtZzioI6wCH8A0nIejx5J5iRi90xbESNj4VfGVgI3TBOrk2cBSb0sW2B8me2EMGFynY5VhYjE+ceBQyKwZkX+UibmduFYIVEk//N1Fb9W5B0xReMc1QHfewzxP7hAnjPdLUR2BbkGGZZ2DNoEHYJvoRp/ELT2l2bf4P24DP84acwSfPWXidXEBwjcv54hMmHo2LnHlR4yxU7EX0A07gt6t8xvtajls4wEpn8bmML1Tsgy5ReNcKNr0veTQsOWKixhWt2Ivw2lui/dzPE8dLcq50meQIohWHuOB4sFONBmyT8FyqXsgX1GLrhbUeHERiRgO2Sbgf4xzLp/wg1bTKw6VbOIjv+EFsJ4oXPHN+xZVoHLzLjuCwzOBnLF5d8TZmCRgVFbyh/6bM46p1s/lumK/cOryLjCPaqoV3RvZ3nQK36D3P1+SxZ3M2fS4GXoH5NsoRotXC/nDYJy/DHcyjzwofiV1vpWY+i1mOy/WfXM9RyrdptTB4S2W4y53u8bfUA5IPI/iCy3Is1zAOaxypTXWifxlOro7jL4uUj5CGbnNHAAAAAElFTkSuQmCC');
|
metadata
CHANGED
@@ -1,14 +1,14 @@
|
|
1
1
|
--- !ruby/object:Gem::Specification
|
2
2
|
name: spuit
|
3
3
|
version: !ruby/object:Gem::Version
|
4
|
-
version: 0.1.
|
4
|
+
version: 0.1.2
|
5
5
|
platform: ruby
|
6
6
|
authors:
|
7
7
|
- is8r
|
8
8
|
autorequire:
|
9
9
|
bindir: bin
|
10
10
|
cert_chain: []
|
11
|
-
date: 2019-
|
11
|
+
date: 2019-08-20 00:00:00.000000000 Z
|
12
12
|
dependencies:
|
13
13
|
- !ruby/object:Gem::Dependency
|
14
14
|
name: aruba
|