-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
118 lines (112 loc) · 8.63 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
<!DOCTYPE html>
<html lang="en">
<head>
<!-- Global site tag (gtag.js) - Google Analytics -->
<script async src="https://www.googletagmanager.com/gtag/js?id=UA-178635949-1"></script>
<script>
window.dataLayer = window.dataLayer || [];
function gtag() {
dataLayer.push(arguments);
}
gtag("js", new Date());
gtag("config", "UA-178635949-1");
</script>
<meta name="viewport" content="width=device-width, initial-scale=1" />
<link rel="stylesheet" href="styles.css" />
<title>Squared Circle</title>
</head>
<body>
<div class="welcome-header">
<div class="welcome-text">
<h1 style="font-size: 50px;">Welcome to Squared Circle!</h1>
<h3 id="welcome-subheader" style="font-size: 25px;">A blog about Books!</h3>
</div>
</div>
<div class="bubble-container">
<a href="reviews.html">
<div class="reviews-bubble">
<img src="books.png" alt="Image of a stack of books" title="All of my reviews!">
<h2>Book Reviews</h2>
</div>
</a>
<a href="about.html">
<div class="about-bubble">
<img src="favicon.ico" alt="Site logo" title="Learn about me and this site!">
<h2>About</h2>
</div>
</a>
<a href="booklist.html">
<div class="booklist-bubble">
<img src="podium.png" alt="Podium image" title="My top books organized by genre.">
<h2 style="position: relative; top: 30px;">Book Awards</h2>
</div>
</a>
</div>
<div id="updates-bubble">
<div id="updates-bubble-title">
<h1 style="text-align: center;">Site Updates</h1>
</div>
<p>
<strong>9/4/21</strong><br>
My first review in over 6 months is now live! It is quite a doozy because I gave it the lowest score ever on this site. If you are interested in seeing why, please <a href="reviews.html">go check it out</a> now!<br><br>
As a small note, I created a feedback form for the site on Google Forms where you can tell me what you like/dislike about the site, things you want to see in the future, or even requests for books for me to review.
You can find it <a href="https://forms.gle/aDihszQ4m7KiKaED9">here</a> or linked on the About page.
Unrelatedly, I am now back in school which means site updates will be a bit slower. For now I am very happy with the technical and design side of the site, so I will be focusing on some good old reviews! I hope you enjoy!
<br><br>
<strong>8/20/21</strong><br>
And with those final touches, this site should be fully responsive! That means it should be able to adapt and look good on any size device. It genuinely wasn't as hard as I was bracing myself for, and I yet again learned <i>a lot</i>,
particularly about CSS. I am very happy with all the progress I've made over only the past <b>two days(!)</b>. If you want to help me and enjoy the site at the same time, please report any issues on the GitHub repository <a href="https://github.com/4CorneredCircle/4CorneredCircle.github.io/issues" target="_blank" rel="noopener noreferrer">here</a>!
<br><br>
<strong>8/19/20 (Afternoon)</strong><br>
Well, I've done it! I didn't know if I could do it, but I have actually made a <a href="reviews.html">reviews page</a> I am really proud of and that I think looks really good. There was definitely a lot of frustration involved,
but its of the best kind - where you are learning something! The next major challenge for me with the site is making it compatible with devices smaller than my own. This is even harder for me personally
because it's also quite boring. I'll begin work on that sometime soon, but for now please enjoy the new reviews page! Yay!
<br><br>
<strong>8/19/21 (Morning) </strong><br>
Hey guys! It's only been half a year since I updated this site, but I'm back and ready to get some new things going! First, I am giving the site a major theme overhaul, with new fonts, colors,
and designs. I particularly like the new font, because it looks more like something you would find in a book to me. I also changed how you navigate the site by making links to other pages easy
to find at the top of the screen. In other news, my booklist has been renamed "Book Awards" - a title which is more descriptive and clear.<br>
But now the biggest news: For a while I have been unhappy with the reviews page as it gets longer because it is boring to scroll through all that text. This will continue to be a problem as I
create more reviews. The table of contents does help some in this regard, but it's not ideal to me. I tried adding the collapsible text and the return to top button, but those didn't address the real problem.
In order to find a solution to this problem I looked at what other book review sites have done, and the most common idea was to show small images of the books' covers with a link to the reviews.
I am going to attempt this solution, but there are two main problems with this. First, I don't love the idea of creating an entire new page for every review. Second, having an image for every book could take up a lot of storage, something
that I cannot afford because GitHub only allots 1 gigabyte of space for this site. But don't worry - I have a solution to both of these. First, I will include the reviews on the same page, just hidden until clicked.
And second, I will compress the cover images to preserve space. Look forward to this coming soon!
<br><br>
<strong>1/28/21</strong><br>
I anticipated for this project to take a lot longer than it did, but I am here today to tell you that <a href="booklist.html">my booklist</a> is now done! Once I sat down with the intention
to do it, it came really easily. And then the code for it wasn't too hard and, since I had time on my hands, I got it done pretty quickly! Check it out if you're interested, and happy reading!
<br><br>
<b>1/27/21</b><br>
I know it has only been a few hours since the last update, but I am back with some much-needed improvements to the site. The redesign of the homepage to add the live updates box
broke all of the formatting I had done for mobile viewing. I put up a haphazard yellow box that would cover the screen when someone tried to view it on mobile, but obviously that
was just a temporary band-aid. So, I have been hard at work today trying to fix the site. It is looking better, but there are still some kinks that need ironing out. It is usable
on mobile again, though, so I am ripping the band-aid off and allowing people to view it again. Hopefully it looks ok on your device, but if it doesn't, please know that I am working
on it and maybe just view the site on your desktop for now. <br><br>
In other news, the Reviews page is getting pretty long, and I wanted an easy way for people to return to the top without having to scroll all the way back up. I looked up a tutorial,
and we now have a "Return to Top" button that appears when you scroll down to the first review. I hope this improves your reading experience!<br><br>
Those are all the updates for now! See you later! <br><br>
<b>1/26/21</b><br>
Welcome to the Live Updates box! I thought that the constant banners announcing my new reviews were getting a little bit old, so I came up with an idea
to have a little box on the home screen where I can tell you what's new on the site! It has the added bonus of being a space for any news - not just new reviews. I hope you like
it and keep an eye on this space for updates in the future!
<br><br>
To kick off the grand opening of the updates box, I have an exciting announcement: I am finally starting work on <a href="booklist.html">my booklist</a>! The page has been empty
for a long time now, and I thought it would be a good idea to either do something with it or get rid of it. I am really excited, because I have always loved the idea of being able
to share my favorite books of all time with all of you. It should be coming (fairly) soon, so even more reason to watch these updates!
<br><br>
Until then, check out my <a href="reviews.html#nyxia">new review of Nyxia</a>, a science-fiction adventure sure to please fans of Ender's Game. Thanks for reading and I'll see you
soon!
</p>
</div>
<!--Div that makes sure that the page extends downwards past the bottom-most tag-->
<div class="footer" style="position: relative; top: 160px;">© 2020 - <span id="year"></span></div>
</body>
<script>
function toggleSidebar(x) {
document.getElementById("sidebar").classList.toggle("active");
x.classList.toggle("change");
}
document.getElementById("year").innerHTML = new Date().getFullYear();
</script>
</html>