kaiserkiwi/cyber-circle-creator
1
0
Fork 0
forked from revengeday/cyber-circle-creator
Code Pull requests Activity

Style adjustments

Browse source 
- FAQ Section
- Credit Section
This commit is contained in:
Ramses Revengeday 2024-11-15 23:29:25 +00:00
parent 47e71940d9
commit e008aec397
1 changed files with 74 additions and 29 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

103
index.html
View file

@ -73,34 +73,79 @@
</div> </div>
</div> </div>
</section> </section>
<section class="faq-section"> <section class="faq-section">
<h3>Frequently Asked Questions</h3> <h3>Frequently Asked Questions</h3>
<p><strong>Q:</strong> What does Cyber Score mean?</p>
<p><strong>A:</strong> The higher you set the value, the more your Fediverse conversations are examined to determine with which users you interact the most. Imagine it as if you would like to view the last 7 days, the last 14 days, the last 30 days. Note that the higher the value you enter, the longer it takes for your Cyber Circle to be generated. <div class="faq-item">
<hr> <input type="checkbox" id="faq1" class="faq-checkbox">
<p><strong>Q:</strong> Why is a Cyberpunk figure displayed instead of a profile picture?</p> <label for="faq1" class="faq-question">What does Cyber Score mean?</label>
<p><strong>A:</strong> If a user's profile picture cannot be loaded, a placeholder image (in this case, a Cyberpunk figure) is displayed. This is done to provide a visual substitute in case the original image is unavailable due to loading errors or missing image URLs.</p> <div class="faq-answer">
<hr> <p>The higher you set the value, the more your Fediverse conversations are examined to determine with which users you interact the most. Imagine it as if you would like to view the last 7 days, the last 14 days, the last 30 days. Note that the higher the value you enter, the longer it takes for your Cyber Circle to be generated.</p>
<p><strong>Q:</strong> What do the different lines on the canvas represent?</p> </div>
<p><strong>A:</strong> <strong>Green Lines:</strong> These are default dashed lines that run from the center of the canvas to the user positions. They serve as visual connections between the main user and the other participants. <strong>Yellow Lines:</strong> These lines may be randomly drawn between different user positions to create additional visual connections and make the layout more dynamic. <strong>Red Line:</strong> The red line randomly connects the center of the canvas to one of the user positions, adding a highlight to the layout and emphasizing a particular connection.</p> </div>
<hr>
<p><strong>Q:</strong> Why is there a maze background on the canvas?</p> <div class="faq-item">
<p><strong>A:</strong> It adds visual complexity to the canvas and is created using random diagonal lines in a grid pattern.</p> <input type="checkbox" id="faq2" class="faq-checkbox">
<hr> <label for="faq2" class="faq-question">Why is a Cyberpunk figure displayed instead of a profile picture?</label>
<p><strong>Q:</strong> What happens if there is a delay in loading avatars?</p> <div class="faq-answer">
<p><strong>A:</strong> During the loading of avatars, a progress status is shown on the webpage indicating <strong>how many avatars have been successfully loaded</strong> (e.g., "Loading avatars: 1/10"). Once all avatars are loaded, this display disappears.</p> <p>If a user's profile picture cannot be loaded, a placeholder image (in this case, a Cyberpunk figure) is displayed. This is done to provide a visual substitute in case the original image is unavailable due to loading errors or missing image URLs.</p>
<hr> </div>
<p><strong>Q:</strong> What does the message "Something went horribly wrong, couldn't fetch your user: Error fetching .../api/v1/accounts/lookup?acct=" mean?</p> </div>
<p><strong>A:</strong> This message indicates that the instance is currently not responding. Please try again later.</p>
<hr> <div class="faq-item">
<p><strong>Q:</strong> Is it possible to directly link to my account?</p> <input type="checkbox" id="faq3" class="faq-checkbox">
<p><strong>A:</strong> Yes, it is possible. Simply change the URL to <i>https://ccc.cyber.to/?@revengeday@corteximplant.com</i>, replacing <i>@revengeday@corteximplant.com</i> with your own account details.</p> <label for="faq3" class="faq-question">What do the different lines on the canvas represent?</label>
<hr> <div class="faq-answer">
</section> <p><strong>Green Lines:</strong> These are default dashed lines that run from the center of the canvas to the user positions. They serve as visual connections between the main user and the other participants. <strong>Yellow Lines:</strong> These lines may be randomly drawn between different user positions to create additional visual connections and make the layout more dynamic. <strong>Red Line:</strong> The red line randomly connects the center of the canvas to one of the user positions, adding a highlight to the layout and emphasizing a particular connection.</p>
<section class="credits-section"> </div>
<h3>Credits</h3> </div>
<p> Cyber Circle Creator builds upon <a href="https://github.com/AMNatty/Mastodon-Circles" target="_blank" rel="nofollow">AMNatty/Mastodon-Circles</a>, which is a further development of <a href="https://github.com/andigandhi/Mastodon-Circles" target="_blank" rel="nofollow">andigandhi/Mastodon-Circles</a>. This project is licensed under the <a href="https://www.gnu.org/licenses/agpl-3.0.html" target="_blank" rel="nofollow">GNU Affero General Public License</a> and benefits from Fedibird support by <a href="https://github.com/noellabo/Mastodon-Circles" target="_blank" rel="nofollow">noellabo</a>, enhancing its functionality even further. We invite you to <a href="https://git.cyberwa.re/revengeday/cyber-circle-creator" target="_blank" rel="nofollow">create your own fork of Cyber Circle Creator</a> ♥ Moreover, the design employs the <a href="https://github.com/rektdeckard/departure-mono" target="_blank" rel="nofollow">departure-mono</a> typeface, crafted by rektdeckard and available under the <a href="https://opensource.org/licenses/MIT" target="_blank" rel="nofollow">MIT License</a>. </p>
</section> <div class="faq-item">
<input type="checkbox" id="faq4" class="faq-checkbox">
<label for="faq4" class="faq-question">Why is there a maze background on the canvas?</label>
<div class="faq-answer">
<p>It adds visual complexity to the canvas and is created using random diagonal lines in a grid pattern.</p>
</div>
</div>
<div class="faq-item">
<input type="checkbox" id="faq5" class="faq-checkbox">
<label for="faq5" class="faq-question">What happens if there is a delay in loading avatars?</label>
<div class="faq-answer">
<p>During the loading of avatars, a progress status is shown on the webpage indicating <strong>how many avatars have been successfully loaded</strong> (e.g., "Loading avatars: 1/10"). Once all avatars are loaded, this display disappears.</p>
</div>
</div>
<div class="faq-item">
<input type="checkbox" id="faq6" class="faq-checkbox">
<label for="faq6" class="faq-question">What does the message "Something went horribly wrong, couldn't fetch your user: Error fetching .../api/v1/accounts/lookup?acct=" mean?</label>
<div class="faq-answer">
<p>This message indicates that the instance is currently not responding. Please try again later.</p>
</div>
</div>
<div class="faq-item">
<input type="checkbox" id="faq7" class="faq-checkbox">
<label for="faq7" class="faq-question">Is it possible to directly link to my account?</label>
<div class="faq-answer">
<p>Yes, it is possible. Simply change the URL to <i>https://ccc.cyber.to/?@revengeday@corteximplant.com</i>, replacing <i>@revengeday@corteximplant.com</i> with your own account details.</p>
</div>
</div>
</section>
<section class="credits-section">
<h3>Credits</h3>
<div class="credits-content">
<p>
<span class="credits-title">Cyber Circle Creator</span> builds upon <a href="https://github.com/AMNatty/Mastodon-Circles" target="_blank" rel="nofollow">AMNatty/Mastodon-Circles</a>,
which is a further development of <a href="https://github.com/andigandhi/Mastodon-Circles" target="_blank" rel="nofollow">andigandhi/Mastodon-Circles</a>.
</p>
<p>This project is licensed under the <a href="https://www.gnu.org/licenses/agpl-3.0.html" target="_blank" rel="nofollow">GNU Affero General Public License</a> and benefits from Fedibird support by <a href="https://github.com/noellabo/Mastodon-Circles" target="_blank" rel="nofollow">noellabo</a>, enhancing its functionality even further.</p>
<p>
We invite you to <a href="https://git.cyberwa.re/revengeday/cyber-circle-creator" target="_blank" rel="nofollow">create your own fork of Cyber Circle Creator</a> ♥.
</p>
<p>Moreover, the design employs the <a href="https://github.com/rektdeckard/departure-mono" target="_blank" rel="nofollow">departure-mono</a> typeface, crafted by rektdeckard and available under the <a href="https://opensource.org/licenses/MIT" target="_blank" rel="nofollow">MIT License</a>.</p>
</div>
</section>
</main> </main>
<footer id="footer"> <footer id="footer">
<p class="footer-note">Created by revengeday → <a href="https://corteximplant.com/@revengeday">@revengeday@corteximplant.com</a></p> <p class="footer-note">Created by revengeday → <a href="https://corteximplant.com/@revengeday">@revengeday@corteximplant.com</a></p>
@ -109,6 +154,6 @@
<script src="js/image.js"></script> <script src="js/image.js"></script>
<script src="js/url.js"></script> <script src="js/url.js"></script>
<script src="js/slider.js"></script> <script src="js/slider.js"></script>
<script>initializeSlider();</script> <script>initializeSlider();</script>
</body> </body>
</html> </html>