hotwire-debug 0.1.2 → 0.1.3
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/Gemfile.lock +2 -1
- data/README.md +17 -1
- data/lib/hotwire/debug/version.rb +1 -1
- data/vendor/assets/stylesheets/hotwire-debug.scss +21 -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: fbbbc2b571a96c83400f8f74272a17ee880b10cc7d7967b66b79c6eb2cbfbed0
|
|
4
|
+
data.tar.gz: 625126eed00dfa30c2c7a73b988c048e3bda5a1652e15e2f2271a6e4ff987b60
|
|
5
5
|
SHA512:
|
|
6
|
-
metadata.gz:
|
|
7
|
-
data.tar.gz:
|
|
6
|
+
metadata.gz: 3cb0141f23dce0738bd4e62a730013e1cdf2b955302c9c6b8eb0076d380b808ed3e059d1511271832e5dc80fe9b11623566bd11803a4377c086cb818e74519c7
|
|
7
|
+
data.tar.gz: d9850ea93af3735710529e77f8a2629baa775355a0709785830530ebd2a634c1136ab2c1c53281846f061e9953635c1139003f01488d06e506eaae10b56bf1aa
|
data/Gemfile.lock
CHANGED
data/README.md
CHANGED
|
@@ -1,5 +1,6 @@
|
|
|
1
1
|
# Hotwire::Debug
|
|
2
|
-
|
|
2
|
+
<img src="https://user-images.githubusercontent.com/8511/104638257-8fdc4900-566b-11eb-8230-c267d09c5de9.mov" style="width: 300px" alt="hotwire-debug v0.1.1 demo">
|
|
3
|
+
|
|
3
4
|
## Installation
|
|
4
5
|
|
|
5
6
|
Add this line to your application's Gemfile:
|
|
@@ -43,8 +44,23 @@ bin/rails g hotwire_debug:webpacker
|
|
|
43
44
|
|
|
44
45
|
# Options
|
|
45
46
|
|
|
47
|
+
## Colorscheme
|
|
46
48
|
By default the color-scheme is a Hotwire-inspired teal and yellow. There's an alternate color scheme available. Add `data-hotwire-scheme-dark` to the root element.
|
|
47
49
|
|
|
50
|
+
## Postition
|
|
51
|
+
|
|
52
|
+
The default behavior is to appear in the lower right corner of the UI. You can change the vertical position by adding one of the following:
|
|
53
|
+
|
|
54
|
+
* `data-hotwire-debug-top`
|
|
55
|
+
* `data-hotwire-debug-middle`
|
|
56
|
+
* `data-hotwire-debug-bottom` [Default]
|
|
57
|
+
|
|
58
|
+
For hoizontal positioning you can apply to the root element:
|
|
59
|
+
|
|
60
|
+
* `data-hotwire-debug-left`
|
|
61
|
+
* `data-hotwire-debug-center`
|
|
62
|
+
* `data-hotwire-debug-right`
|
|
63
|
+
|
|
48
64
|
## Development
|
|
49
65
|
|
|
50
66
|
After checking out the repo, run `bin/setup` to install dependencies. You can also run `bin/console` for an interactive prompt that will allow you to experiment.
|
|
@@ -1,11 +1,30 @@
|
|
|
1
1
|
:root {
|
|
2
2
|
--color-highlight: rgba(255, 232, 1, 1);
|
|
3
3
|
--color-main: rgba(95, 206, 214, 1);
|
|
4
|
+
--color-secondary: rgba(239, 107, 170, 1);
|
|
4
5
|
}
|
|
5
6
|
:root[data-hotwire-scheme-dark] {
|
|
6
7
|
--color-highlight: rgba(200, 200, 200, 1);
|
|
7
8
|
--color-main: rgba(0, 0, 0, 1);
|
|
8
9
|
}
|
|
10
|
+
[data-hotwire-debug-bottom] #hotwire-toggle {
|
|
11
|
+
bottom: 1rem !important;
|
|
12
|
+
}
|
|
13
|
+
[data-hotwire-debug-middle] #hotwire-toggle {
|
|
14
|
+
bottom: 50% !important;
|
|
15
|
+
}
|
|
16
|
+
[data-hotwire-debug-top] #hotwire-toggle {
|
|
17
|
+
top: 1rem !important;
|
|
18
|
+
}
|
|
19
|
+
[data-hotwire-debug-center] #hotwire-toggle {
|
|
20
|
+
right: 50% !important;
|
|
21
|
+
}
|
|
22
|
+
[data-hotwire-debug-left] #hotwire-toggle {
|
|
23
|
+
left: 1rem !important;
|
|
24
|
+
}
|
|
25
|
+
[data-hotwire-debug-right] #hotwire-toggle {
|
|
26
|
+
right: 1rem !important;
|
|
27
|
+
}
|
|
9
28
|
#hotwire-toggle {
|
|
10
29
|
height: 2rem;
|
|
11
30
|
position: fixed;
|
|
@@ -17,6 +36,7 @@
|
|
|
17
36
|
svg path {
|
|
18
37
|
fill: var(--color-main) !important;
|
|
19
38
|
transition: fill ease-in-out 0.3s;
|
|
39
|
+
stroke: var(--color-secondary);
|
|
20
40
|
}
|
|
21
41
|
&:hover svg {
|
|
22
42
|
fill: var(--color-highlight) !important;
|
|
@@ -26,6 +46,7 @@
|
|
|
26
46
|
:root[data-hotwire-debug] #hotwire-toggle {
|
|
27
47
|
svg path {
|
|
28
48
|
fill: var(--color-highlight) !important;
|
|
49
|
+
stroke: var(--color-secondary);
|
|
29
50
|
}
|
|
30
51
|
|
|
31
52
|
&:hover {
|
metadata
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
--- !ruby/object:Gem::Specification
|
|
2
2
|
name: hotwire-debug
|
|
3
3
|
version: !ruby/object:Gem::Version
|
|
4
|
-
version: 0.1.
|
|
4
|
+
version: 0.1.3
|
|
5
5
|
platform: ruby
|
|
6
6
|
authors:
|
|
7
7
|
- Jim Remsik
|
|
@@ -10,7 +10,7 @@ authors:
|
|
|
10
10
|
autorequire:
|
|
11
11
|
bindir: bin
|
|
12
12
|
cert_chain: []
|
|
13
|
-
date: 2021-
|
|
13
|
+
date: 2021-02-04 00:00:00.000000000 Z
|
|
14
14
|
dependencies:
|
|
15
15
|
- !ruby/object:Gem::Dependency
|
|
16
16
|
name: bundler
|