Back

Flight Rising Discussion

Discuss everything and anything Flight Rising.
TOPIC | Redesigning FR (CSS/HTML/GitHub Preview)
[center][url=https://sepharial.github.io/rising/]Click here for a live preview of FR 2.1![/url] [/center] [img]https://i.imgur.com/UMnlpPh.png[/img] I decided to redesign one of my dragon's pages for fun (actual one is [url=http://flightrising.com/main.php?dragon=17154474]here[/url]) and just really got carried away! For the Non-Web-Developers, HTML (hypertext markup language) builds elements like text boxes and images, and CSS (cascading style sheets) makes them look nice. That's what I used to make this 'website' (with a bit of Javascript/jQuery for the fun elements). This is composed of over a thousand lines of code, all written from the ground up! If you want to see my files/mess around with them yourself, I'll make my GitHub repository public :D ----- [b]New Stuff[/b] [LIST] [*][b]Features Users Have Historically Wanted[/b]: coliseum section that showcases stats and stones! Also, commas so you can easily read how much treasure you have. There is also a toggle-able lineage section, now with pictures (and a toggle-able bio section)! Above the familiar, there is a place to enter their name :3 my fave addition. And finally, there are links to scry/dress your dragon. [*][b]Things I Think Are Nice[/b]: In the sidebar, the links include a new section called "Ops" which contains RL things like buying gems. The well-fed bonus is three blue circles beneath the user menu, which has a new animation! Navigating between dragons in the lair is done by row instead of clicking left or right. [*]Banner image by Ecci on [url=http://www1.flightrising.com/forums/cc/2287471/1]this thread[/url] [/LIST] [b]Subtractions[/b]: the newsbar at the top and picture based buttons aka my NEMESIS [b]Other Comments[/b]: Made for Chrome and checked on Safari; let me know how the site looks/take screenshots if you use IE/Firefox/Opera! I'd like to see if it still works haha ----- So what do y'all think? Questions, more suggestions? I'd like to hear everything! [b]Edit[/b]: Round one of alterations done! There's a clicky button to change the color scheme from grey to gold, and the flag is no longer sideways :D Thank you all for commenting! [b]Edit 2[/b]: Yes, the default scheme is grey, but that’s because those hex colors are easy to remember and use when first designing the site. Site colors are now the default, click "Toggle Colors" to see the greyscale! Heart is back (?) but with FontAwesome. And remember, this is just for fun! Thanks again ;D
UMnlpPh.png

I decided to redesign one of my dragon's pages for fun (actual one is here) and just really got carried away! For the Non-Web-Developers, HTML (hypertext markup language) builds elements like text boxes and images, and CSS (cascading style sheets) makes them look nice. That's what I used to make this 'website' (with a bit of Javascript/jQuery for the fun elements).

This is composed of over a thousand lines of code, all written from the ground up! If you want to see my files/mess around with them yourself, I'll make my GitHub repository public :D



New Stuff
  • Features Users Have Historically Wanted: coliseum section that showcases stats and stones! Also, commas so you can easily read how much treasure you have. There is also a toggle-able lineage section, now with pictures (and a toggle-able bio section)! Above the familiar, there is a place to enter their name :3 my fave addition. And finally, there are links to scry/dress your dragon.
  • Things I Think Are Nice: In the sidebar, the links include a new section called "Ops" which contains RL things like buying gems. The well-fed bonus is three blue circles beneath the user menu, which has a new animation! Navigating between dragons in the lair is done by row instead of clicking left or right.
  • Banner image by Ecci on this thread

Subtractions: the newsbar at the top and picture based buttons aka my NEMESIS

Other Comments: Made for Chrome and checked on Safari; let me know how the site looks/take screenshots if you use IE/Firefox/Opera! I'd like to see if it still works haha



So what do y'all think? Questions, more suggestions? I'd like to hear everything!

Edit: Round one of alterations done! There's a clicky button to change the color scheme from grey to gold, and the flag is no longer sideways :D Thank you all for commenting!
Edit 2: Yes, the default scheme is grey, but that’s because those hex colors are easy to remember and use when first designing the site. Site colors are now the default, click "Toggle Colors" to see the greyscale! Heart is back (?) but with FontAwesome. And remember, this is just for fun! Thanks again ;D
FVLARTi.png
Oh wow. This is gorgeous.
Oh wow. This is gorgeous.
this is amazing

holy sheet
this is amazing

holy sheet
Cosimia123.gif
hi im cosimia!
i like frogs
forever young ♥


[quote name="Cakeless" date="2018-08-11 09:17:27" ] Oh wow. This is gorgeous. [/quote]
Cakeless wrote on 2018-08-11 09:17:27:
Oh wow. This is gorgeous.
Uq1cq4S.png
This is pretty damn fantastic! It's so much easier to browse through and see everything about the dragon, and the additions of the breed/dressing room/predict morphology buttons are some very good choices. The userbox (in my opinion) looks a bit less sleek and chunkier and the banner is sideways hhmhnmngnmg
This is pretty damn fantastic! It's so much easier to browse through and see everything about the dragon, and the additions of the breed/dressing room/predict morphology buttons are some very good choices. The userbox (in my opinion) looks a bit less sleek and chunkier and the banner is sideways hhmhnmngnmg
68180427.png

- My name's Levi
- Male
- I eat dirt
- wishlist
- Earth Flight Best Flight
this is amazing omg
this is amazing omg
:D
i love it!
i love it!
xulc4O8.png
aw man i like current fr This is gorgeous, though! (for reference, this is it what it looks like on my computer. browser is firefox) [img]https://i.imgur.com/DiQdUSN.jpg[/img]
aw man i like current fr

This is gorgeous, though!

(for reference, this is it what it looks like on my computer. browser is firefox)
DiQdUSN.jpg
j0lGliX.png
she/her
FR+3
woah! beautiful! <3
woah! beautiful! <3
NB43KMu.png
it's clean which I like

But what I like about the current page are all the little things (example - clicking the heart to bond with your familiar, not just a text box).
And it's really heavy with grey boxes. I feel like the image of the dragon is fighting with everything trying to stand out but with all the grey and text going on around the image, it's just getting squeezed in the corner.

I would actually like to see it where the dragon is in the centre along with the familiar and all the info / stats are underneath the image of the dragon.
it's clean which I like

But what I like about the current page are all the little things (example - clicking the heart to bond with your familiar, not just a text box).
And it's really heavy with grey boxes. I feel like the image of the dragon is fighting with everything trying to stand out but with all the grey and text going on around the image, it's just getting squeezed in the corner.

I would actually like to see it where the dragon is in the centre along with the familiar and all the info / stats are underneath the image of the dragon.