Skip to content

Commit 74203e9

Browse files
committed
fix: replace fontawesome with svg
1 parent 706665a commit 74203e9

File tree

4 files changed

+56
-56
lines changed

4 files changed

+56
-56
lines changed

docs/form.html

Lines changed: 15 additions & 15 deletions
Original file line numberDiff line numberDiff line change
@@ -34,13 +34,13 @@ <h2>CoCreate-api form</h2>
3434
<div class="display:flex align-items:center transition:0.3s padding-left:10px" share-network="true" share-text="An api helper component in vanilla javascript to setup thirdparty api intergrations. Apis can be accessible using HTML5 attributes and/or JavaScript API"
3535
share-title="CoCreate API form" share-height="600" share-width="700" share-media="https://cdn.cocreate.app/docs/api.png" hover="display:block!important" hover-target=".social-networks">
3636
<div class="display:none social-networks">
37-
<a class="margin-right:15px" share-network='twitter' title="Share on twitter"><i class="fab fa-twitter"></i></a>
38-
<a class="margin-right:15px" share-network='facebook' title="Share on Facebook"><i class="fab fa-facebook"></i></a>
39-
<a class="margin-right:15px" share-network='instagram' title="Share on instagram"><i class="fab fa-instagram"></i></a>
37+
<a class="margin-right:15px" share-network='twitter' title="Share on twitter"><i class="height:20px fill:#505050" src="/assets/svg/twitter.svg"></i></a>
38+
<a class="margin-right:15px" share-network='facebook' title="Share on Facebook"><i class="height:20px fill:#505050" src="/assets/svg/facebook.svg"></i></a>
39+
<a class="margin-right:15px" share-network='instagram' title="Share on instagram"><i class="height:20px fill:#505050" src="/assets/svg/instagram.svg"></i></a>
4040
</div>
41-
<a class="margin-right:15px" share-network='share' title="Share on share"><i class="fas fa-share-alt"></i></a>
41+
<a class="margin-right:15px" share-network='share' title="Share on share"><i class="height:20px fill:#505050" src="/assets/svg/share-alt.svg"></i></a>
4242
</div>
43-
<a href="https://github.com/CoCreate-app/CoCreate-dnd" target="_blank" class=""><i class="fab fa-github"></i></a>
43+
<a href="https://github.com/CoCreate-app/CoCreate-dnd" target="_blank" class=""><i class="height:20px fill:#505050" src="/assets/svg/github.svg"></i></a>
4444
</div>
4545
</div>
4646
<h1 class="max-width:500px margin:20px_10px line-height:1.5 font-size:16px font-weight:100">CoCreate-api is a simple api helper component in vanilla javascript used by JavaScript developers to create thirdparty api intergrations. Thirdparty apis can be accessible using HTML5 attributes and/or JavaScript API. CoCreate-api includes the
@@ -52,7 +52,7 @@ <h1 class="max-width:500px margin:20px_10px line-height:1.5 font-size:16px font-
5252
<div id="api-install" class="border-bottom:1px_solid_lightgrey" scroll scroll-intersect="color:dodgerblue" scroll-target="#api-install-section">
5353
<span class="display:flex align-items:center width:fit-content" hover="display:block!important" hover-target='[href="#api-install"]'>
5454
<h2 class="padding:5px_0px">Install</h2>
55-
<a class="margin-left:10px display:none" href="#api-install"><i class="fas fa-link"></i></a>
55+
<a class="margin-left:10px display:none" href="#api-install"><i class="height:20px fill:#505050" src="/assets/svg/link.svg"></i></a>
5656
</span>
5757
</div>
5858

@@ -64,13 +64,13 @@ <h2 class="padding:5px_0px">Install</h2>
6464

6565
<div>
6666
<h2 id="api-server-run" hover="display:block" hover-target="" class="border-bottom:1px_solid_lightgrey padding:5px_0px">Server run</h2>
67-
<a class="display:none" href="#api-server-run"><i class="fas fa-link"></i></a>
67+
<a class="display:none" href="#api-server-run"><i class="height:20px fill:#505050" src="/assets/svg/link.svg"></i></a>
6868
</div>
6969
<pre><code class="language-javascript">npm run start</code></pre>
7070

7171
<div>
7272
<h2 id="api-dependencies" hover="display:block" hover-target="" class="border-bottom:1px_solid_lightgrey margin-top:80px padding:5px_0px">Dependencies components</h2>
73-
<a class="display:none" href="#api-dependencies"><i class="fas fa-link"></i></a>
73+
<a class="display:none" href="#api-dependencies"><i class="height:20px fill:#505050" src="/assets/svg/link.svg"></i></a>
7474
</div>
7575
<p class="padding:10px_0px line-height:1.5">
7676
<strong>CoCreate.js</strong>,
@@ -80,7 +80,7 @@ <h2 id="api-dependencies" hover="display:block" hover-target="" class="border-bo
8080

8181
<div>
8282
<h2 id="api-development" hover="display:block" hover-target="" class="border-bottom:1px_solid_lightgrey margin-top:80px padding:5px_0px">Development Guide</h2>
83-
<a class="display:none" href="#api-development"><i class="fas fa-link"></i></a>
83+
<a class="display:none" href="#api-development"><i class="height:20px fill:#505050" src="/assets/svg/link.svg"></i></a>
8484
</div>
8585

8686
<h3 class="margin-top:20px padding:5px_0px">1. Directory structure</h3>
@@ -173,7 +173,7 @@ <h4><span></span><span class="cocreate-badge success"></span></h4>
173173
<div id="api-demo" class="border-bottom:1px_solid_lightgrey" scroll scroll-intersect="color:dodgerblue" scroll-target="#api-demo-section">
174174
<span class="display:flex align-items:center width:fit-content" hover="display:block!important" hover-target='[href="#api-demo"]'>
175175
<h2 class="padding:5px_0px">Demo</h2>
176-
<a class="margin-left:10px display:none" href="#api-demo"><i class="fas fa-link"></i></a>
176+
<a class="margin-left:10px display:none" href="#api-demo"><i class="height:20px fill:#505050" src="/assets/svg/link.svg"></i></a>
177177
</span>
178178
</div>
179179

@@ -191,10 +191,10 @@ <h2 class="padding:5px_0px">Demo</h2>
191191
</div>
192192

193193
<div class="font-size:20px position:absolute top:10px right:10px opacity:0.6">
194-
<a class="margin-right:10px" id="eye" show="#eye-slash" hide="#eye, #demo-preview" toggle="code-height" toggle-target="#demo-code"><i class="far fa-eye"></i></a>
195-
<a class="margin-right:10px" hidden id="eye-slash" show="#eye, #demo-preview" hide="#eye-slash" toggle="code-height" toggle-target="#demo-code"><i class="fas fa-eye-slash"></i></a>
196-
<a class="margin-right:10px" id="code" show="#code-slash" hide="#code, #demo-code"><i class="fa fa-code"></i></a>
197-
<a class="margin-right:10px" hidden id="code-slash" show="#code, #demo-code" hide="#code-slash"><i class="fas fa-code"></i></a>
194+
<a class="margin-right:10px" id="eye" show="#eye-slash" hide="#eye, #demo-preview" toggle="code-height" toggle-target="#demo-code"><i class="height:18px fill:#505050" src="/assets/svg/eye.svg"></i></a>
195+
<a class="margin-right:10px" hidden id="eye-slash" show="#eye, #demo-preview" hide="#eye-slash" toggle="code-height" toggle-target="#demo-code"><i class="height:20px fill:#505050" src="/assets/svg/eye-slash.svg"></i></a>
196+
<a class="margin-right:10px" id="code" show="#code-slash" hide="#code, #demo-code"><i class="height:20px fill:#505050" src="/assets/svg/code.svg"></i></a>
197+
<a class="margin-right:10px" hidden id="code-slash" show="#code, #demo-code" hide="#code-slash"><i class="display:flex height:18px fill:#505050" src="/assets/svg/code.svg"></i></a>
198198
<a class="margin-right:5px" fullscreen fullscreen-target="#playground"></a>
199199
</div>
200200

@@ -204,7 +204,7 @@ <h2 class="padding:5px_0px">Demo</h2>
204204
</div>
205205
</div>
206206
<button href="https://github.com/CoCreate-app/CoCreate-api/tree/master/docs/index.html?message=docs%3A%20describe%20your%20change..." target="_blank" class="position:fixed bottom:15px right:15px padding:15px background:dodgerblue color:#fff font-size:1.5rem grow-hover border-radius:50% border-width:0 box-shadow:0px_2px_10px_0px_rgba(0,_0,_0,_0.4)">
207-
<i class="fas fa-pencil-alt"></i>
207+
<i class="height:20px fill:#505050" src="/assets/svg/pencil-alt.svg"></i>
208208
</button>
209209
</main>
210210

docs/index.html

Lines changed: 16 additions & 16 deletions
Original file line numberDiff line numberDiff line change
@@ -36,13 +36,13 @@ <h2>CoCreate-api</h2>
3636
<div class="display:flex align-items:center transition:0.3s padding-left:10px" share-network="true" share-text="Enter decription here" share-title="testing im a title" share-height="600" share-width="700" share-media="https://cdn.cocreate.app/docs/api.png"
3737
hover="display:block!important" hover-target=".social-networks">
3838
<div class="display:none social-networks">
39-
<a class="margin-right:15px" share-network='twitter' title="Share on twitter"><i class="fab fa-twitter"></i></a>
40-
<a class="margin-right:15px" share-network='facebook' title="Share on Facebook"><i class="fab fa-facebook"></i></a>
41-
<a class="margin-right:15px" share-network='instagram' title="Share on instagram"><i class="fab fa-instagram"></i></a>
39+
<a class="margin-right:15px" share-network='twitter' title="Share on twitter"><i class="height:20px fill:#505050" src="/assets/svg/twitter.svg"></i></a>
40+
<a class="margin-right:15px" share-network='facebook' title="Share on Facebook"><i class="height:20px fill:#505050" src="/assets/svg/facebook.svg"></i></a>
41+
<a class="margin-right:15px" share-network='instagram' title="Share on instagram"><i class="height:20px fill:#505050" src="/assets/svg/instagram.svg"></i></a>
4242
</div>
43-
<a class="margin-right:15px" share-network='share' title="Share on share"><i class="fas fa-share-alt"></i></a>
43+
<a class="margin-right:15px" share-network='share' title="Share on share"><i class="height:20px fill:#505050" src="/assets/svg/share-alt.svg"></i></a>
4444
</div>
45-
<a href="https://github.com/CoCreate-app/CoCreate-dnd" target="_blank" class=""><i class="fab fa-github"></i></a>
45+
<a href="https://github.com/CoCreate-app/CoCreate-dnd" target="_blank" class=""><i class="height:20px fill:#505050" src="/assets/svg/github.svg"></i></a>
4646
</div>
4747
</div>
4848
<h1 class="max-width:500px margin:20px_10px line-height:1.5 font-size:16px font-weight:100">CoCreate-api is a simple api helper component in vanilla javascript used by JavaScript developers to create thirdparty api intergrations. Thirdparty apis can be accessible using HTML5 attributes and/or JavaScript API. CoCreate-api includes the
@@ -53,7 +53,7 @@ <h1 class="max-width:500px margin:20px_10px line-height:1.5 font-size:16px font-
5353
<div id="api-install" class="border-bottom:1px_solid_lightgrey" scroll scroll-intersect="color:dodgerblue" scroll-target="#api-install-section">
5454
<span class="display:flex align-items:center width:fit-content" hover="display:block!important" hover-target='[href="#api-install"]'>
5555
<h2 class="padding:5px_0px">Install</h2>
56-
<a class="margin-left:10px display:none" href="#api-install"><i class="fas fa-link"></i></a>
56+
<a class="margin-left:10px display:none" href="#api-install"><i class="height:20px fill:#505050" src="/assets/svg/link.svg"></i></a>
5757
</span>
5858
</div>
5959

@@ -63,7 +63,7 @@ <h2 class="padding:5px_0px">Install</h2>
6363

6464
<div>
6565
<h2 id="api-dependencies" hover="display:block" hover-target="" class="border-bottom:1px_solid_lightgrey margin-top:80px padding:5px_0px">Dependencies components</h2>
66-
<a class="display:none" href="#api-dependencies"><i class="fas fa-link"></i></a>
66+
<a class="display:none" href="#api-dependencies"><i class="height:20px fill:#505050" src="/assets/svg/link.svg"></i></a>
6767
</div>
6868

6969
<p class="padding:10px_0px line-height:1.5">
@@ -76,7 +76,7 @@ <h2 id="api-dependencies" hover="display:block" hover-target="" class="border-bo
7676
<div id="api-usage" class="margin-top:80px border-bottom:1px_solid_lightgrey" scroll scroll-intersect="color:dodgerblue" scroll-target="#api-usage-section">
7777
<span class="display:flex align-items:center width:fit-content" hover="display:block!important" hover-target='[href="#api-usage"]'>
7878
<h2 class="padding:5px_0px">Usage</h2>
79-
<a class="margin-left:10px display:none" href="#api-usage"><i class="fas fa-link"></i></a>
79+
<a class="margin-left:10px display:none" href="#api-usage"><i class="height:20px fill:#505050" src="/assets/svg/link.svg"></i></a>
8080
</span>
8181
</div>
8282

@@ -89,7 +89,7 @@ <h4 class="margin-top:20px padding:5px_0px">Install package</h4>
8989

9090
<div>
9191
<h2 id="api-server-run" hover="display:block" hover-target="" class="border-bottom:1px_solid_lightgrey padding:5px_0px">Server run</h2>
92-
<a class="display:none" href="#api-server-run"><i class="fas fa-link"></i></a>
92+
<a class="display:none" href="#api-server-run"><i class="height:20px fill:#505050" src="/assets/svg/link.svg"></i></a>
9393
</div>
9494

9595
<p class="padding:10px_0px line-height:1.5">
@@ -111,7 +111,7 @@ <h4 class="margin-top:20px padding:5px_0px">Client side</h4>
111111

112112
<div>
113113
<h2 id="api-functions" hover="display:block" hover-target="" class="border-bottom:1px_solid_lightgrey padding:5px_0px">CoCreate-api functions</h2>
114-
<a class="display:none" href="#api-functions"><i class="fas fa-link"></i></a>
114+
<a class="display:none" href="#api-functions"><i class="height:20px fill:#505050" src="/assets/svg/link.svg"></i></a>
115115
</div>
116116

117117
<ul class="list-style-type:none ">
@@ -200,7 +200,7 @@ <h4><span></span><span class="cocreate-badge success"></span></h4>
200200
<div id="api-demo" class="border-bottom:1px_solid_lightgrey" scroll scroll-intersect="color:dodgerblue" scroll-target="#api-demo-section">
201201
<span class="display:flex align-items:center width:fit-content" hover="display:block!important" hover-target='[href="#api-demo"]'>
202202
<h2 class="padding:5px_0px">Demo</h2>
203-
<a class="margin-left:10px display:none" href="#api-demo"><i class="fas fa-link"></i></a>
203+
<a class="margin-left:10px display:none" href="#api-demo"><i class="height:20px fill:#505050" src="/assets/svg/link.svg"></i></a>
204204
</span>
205205
</div>
206206
<div class="position:sticky top:0 padding:15px_0px height:100vh">
@@ -217,10 +217,10 @@ <h2 class="padding:5px_0px">Demo</h2>
217217
</div>
218218

219219
<div class="font-size:20px position:absolute top:10px right:10px opacity:0.6">
220-
<a class="margin-right:10px" id="eye" show="#eye-slash" hide="#eye, #demo-preview" toggle="code-height" toggle-target="#demo-code"><i class="far fa-eye"></i></a>
221-
<a class="margin-right:10px" hidden id="eye-slash" show="#eye, #demo-preview" hide="#eye-slash" toggle="code-height" toggle-target="#demo-code"><i class="fas fa-eye-slash"></i></a>
222-
<a class="margin-right:10px" id="code" show="#code-slash" hide="#code, #demo-code"><i class="fa fa-code"></i></a>
223-
<a class="margin-right:10px" hidden id="code-slash" show="#code, #demo-code" hide="#code-slash"><i class="fas fa-code"></i></a>
220+
<a class="margin-right:10px" id="eye" show="#eye-slash" hide="#eye, #demo-preview" toggle="code-height" toggle-target="#demo-code"><i class="height:18px fill:#505050" src="/assets/svg/eye.svg"></i></a>
221+
<a class="margin-right:10px" hidden id="eye-slash" show="#eye, #demo-preview" hide="#eye-slash" toggle="code-height" toggle-target="#demo-code"><i class="height:20px fill:#505050" src="/assets/svg/eye-slash.svg"></i></a>
222+
<a class="margin-right:10px" id="code" show="#code-slash" hide="#code, #demo-code"><i class="height:20px fill:#505050" src="/assets/svg/code.svg"></i></a>
223+
<a class="margin-right:10px" hidden id="code-slash" show="#code, #demo-code" hide="#code-slash"><i class="display:flex height:18px fill:#505050" src="/assets/svg/code.svg"></i></a>
224224
<a class="margin-right:5px" fullscreen fullscreen-target="#playground"></a>
225225
</div>
226226

@@ -231,7 +231,7 @@ <h2 class="padding:5px_0px">Demo</h2>
231231
</div>
232232

233233
<button href="https://github.com/CoCreate-app/CoCreate-api/tree/master/docs/index.html?message=docs%3A%20describe%20your%20change..." target="_blank" class="position:fixed bottom:15px right:15px padding:15px background:dodgerblue color:#fff font-size:1.5rem grow-hover border-radius:50% border-width:0 box-shadow:0px_2px_10px_0px_rgba(0,_0,_0,_0.4)">
234-
<i class="fas fa-pencil-alt"></i>
234+
<i class="height:20px fill:#505050" src="/assets/svg/pencil-alt.svg"></i>
235235
</button>
236236
</main>
237237
<script src="/apikey.js"></script>

0 commit comments

Comments
 (0)