Site Update - 5/27/2020
May 27, 2020
It may not seem like much has happened since the last time I made a post, but I have been doing a lot of work under the hood for this website. While messing around with CSS I have repeatedly broken and then fixed more elements than I would like to admit. I have been using a clone of this website to test changes before deploying to the real thing, it has been affectionately named Yuma.
Over the past month, I have implemented pagination, syntax highlighting, internet explorer specific CSS, and leveraged some of the features of Sass (as shown below). I don’t think that’s too bad considering that I’m taking 16 credit hours of classes right now.
Variables - I’m using variables to keep theme colors consistent and to allow each color to be changed with a single statement. I also have a variable for the font stack that I am using.
$blueprint_blue: #0b72ca;
$blueprint_line_light: #e0e7ff;
$blueprint_line_dark: #bcc7e8;
Mixins - I’m using mixins for transformations and box shadows, all I have to do is call the mixin on a single line with my desired inputs and Sass creates CSS declarations for a variety of browsers.
@mixin transform($property) {
-webkit-transform: $property;
-o-transform: $property;
-moz-transform: $property;
}
Nested CSS selectors - I’m using nested CSS selectors to clean up my stylesheet. The CSS selectors follow the same visual hierarchy as my HTML and are much more readable than what I previously used.
#pager {
list-style-type: none;
padding: 20px 0 20px 0;
margin: 0;
a {
color: $link_dark;
font-weight: bold;
font-size: 1.25em;
}
a:hover {
text-decoration: underline;
}
}
I am currently finishing out my lease in Cincinnati, which is somewhat prohibitive as most of my projects have been left at home. I have at least been collecting images to go over the work that I have put into both my XZ550 and YG1-TK.
~ JHE
