-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
150 lines (136 loc) · 7.49 KB
/
index.html
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
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
<html>
<head>
<!-- Bootstrap -->
<link href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-rbsA2VBKQhggwzxH7pPCaAqO46MgnOM80zW1RWuH61DGLwZJEdK2Kadq2F9CUG65" crossorigin="anonymous">
<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap.bundle.min.js" integrity="sha384-kenU1KFdBIe4zVF0s0G1M5b4hcpxyD9F7jL+jjXkk+Q2h455rYXK/7HAuoJl+0I4" crossorigin="anonymous"></script>
<style>
.carousel-item {
padding-left: 10%;
padding-right: 10%;
}
#carousel {
width: 100%;
max-width: 700pt;
height: auto;
margin: 0 auto;
}
a:link {
color: #006591;
background-color: transparent;
text-decoration: underline;
}
a:visited {
color: #006591;
background-color: transparent;
text-decoration: underline;
}
a:hover {
color: #006591;
background-color: transparent;
text-decoration: underline;
}
a:active {
color: #006591;
background-color: transparent;
text-decoration: underline;
}
</style>
<script src="index.js"></script>
</head>
<body style="background-color:#94E4FC">
<div style="width:100%; margin:auto; padding-top:20pt">
<h1 style="color:white; text-align:center">Guitar fretboard: scales</h1>
<p style="color: #006591; font-weight: bold; width: 80%; margin: 0 auto; font-size: large; padding-bottom: 10pt;">
Guitar Fretboard app is designed to help you learn scales. Allows to customize every aspect of displaying a scale or chord notes/intervals on a guitar fretboard. Also shows each scale degree chords and modes with ability to highlight a chord on a scale.
Important: doesn't show how to play chords, shows only intervals of a chord and it is up to you to choose fingerings. Great for learning chords in details. Not great as a simple reference. Application is catered more to learning scales than chords unless you want to see all the chord notes on a fretboard. Plays notes when they are tapped on fretboard.
</p>
<div id="carousel" class="carousel slide" data-bs-interval="false">
<div class="carousel-inner">
<div class="carousel-item active">
<img src="Resources\Phone1.png" class="d-block w-100">
</div>
<div class="carousel-item">
<img src="Resources\Phone2.png" class="d-block w-100">
</div>
<div class="carousel-item">
<img src="Resources\Phone3.png" class="d-block w-100">
</div>
<div class="carousel-item">
<img src="Resources\Phone4.png" class="d-block w-100">
</div>
<div class="carousel-item">
<img src="Resources\Phone5.png" class="d-block w-100">
</div>
<div class="carousel-item">
<img src="Resources\Phone6.png" class="d-block w-100">
</div>
<div class="carousel-item">
<img src="Resources\Phone7.png" class="d-block w-100">
</div>
<div class="carousel-item">
<img src="Resources\Phone8.png" class="d-block w-100">
</div>
<div class="carousel-item">
<img src="Resources\Phone9.png" class="d-block w-100">
</div>
<div class="carousel-item">
<img src="Resources\Phone10.png" class="d-block w-100">
</div>
</div>
<button class="carousel-control-prev" type="button" data-bs-target="#carousel" data-bs-slide="prev" style="margin-top:5%">
<span class="carousel-control-prev-icon" aria-hidden="true"></span>
<span class="visually-hidden">Previous</span>
</button>
<button class="carousel-control-next" type="button" data-bs-target="#carousel" data-bs-slide="next" style="margin-top:5%">
<span class="carousel-control-next-icon" aria-hidden="true"></span>
<span class="visually-hidden">Next</span>
</button>
</div>
<div style="display: grid; grid-template-columns: 1fr 1fr;">
<div style="margin: 0 auto">
<a href='https://play.google.com/store/apps/details?id=com.slaverygames.guitarfretboard&pcampaignid=pcampaignidMKT-Other-global-all-co-prtnr-py-PartBadge-Mar2515-1'>
<img style="width: 190px; height: auto;" alt='Get it on Google Play' src='https://play.google.com/intl/en_us/badges/static/images/badges/en_badge_web_generic.png' />
</a>
</div>
<div style="margin: 0 auto">
<a href="https://apps.apple.com/us/app/guitar-fretboard-scales/id1623791852?itsct=apps_box_badge&itscg=30200" style="display: inline-block; overflow: hidden; border-radius: 13px; width: 150px; height: auto; margin-top: 10px">
<img src="https://tools.applemediaservices.com/api/badges/download-on-the-app-store/black/en-us?size=250x83&releaseDate=1654905600&h=f4802d3508cd275e9ac19760115d0889" alt="Download on the App Store" style="border-radius: 13px; width: 150px; height: auto;">
</a>
</div>
</div>
<p style="color: #006591; font-weight: bold; width: 80%; margin: 0 auto; font-size: large; padding-bottom: 10pt; ">
Features:<br />
- 45+ scales (Major scale modes, Harmonic minor scale modes, Melodic minor scale modes, Major/Minor pentatonic, Exotic scales, Bebop scales) and 35+ chords<br />
- Ability to add custom scales and chords<br />
- 35+ tunings<br />
- Ability to add custom tunings<br />
- Allows to change scale palette and add custom scale palettes<br />
- Allows to change fretboard style and add customs styles<br />
- 4 view modes including (no text, notes, intervals, both notes and intervals)<br />
- Allows to highlight intervals of a scale<br />
- Show/Hide notes outside of scale<br />
- Left handed mode<br />
- Zoom (use pinch gesture to zoom fretboard)<br />
- Play notes (guitar and bass)<br />
- Focus on scale notes only on specific area of a fretboard<br />
- Dark theme<br />
<br />
If you have any feature requests or encountered bugs please contact me at <a href="mailto: [email protected]">[email protected]</a>
</p>
<div style="display: grid; grid-template-columns: 1fr 1fr 1fr; margin-top:20pt">
<div style="margin: 0 auto">
<a href="https://vngames.github.io/GuitarFretboardTermsOfUse/" style="font-weight:bold; font-size:large;">Terms of use</a>
</div>
<div style="margin: 0 auto">
<a href="https://vngames.github.io/GuitarFretboardPrivacyPolicy/" style="font-weight:bold; font-size:large;">Privacy policy</a>
</div>
<div style="margin: 0 auto">
<a href="https://vngames.github.io/GuitarFretboardSupport/" style="font-weight:bold; font-size:large;">Support</a>
</div>
</div>
</div>
<script>
Initialize();
</script>
</body>
</html>