New site with MD, SCSS

.gitignore

@@ -41,3 +41,4 @@ Thumbs.db
 
 _site
 Gemfile.lock
+.jekyll-metadat*

Gemfile.lock

@@ -1,15 +1,15 @@
 GEM
   remote: https://rubygems.org/
   specs:
-    addressable (2.8.6)
-      public_suffix (>= 2.0.2, < 6.0)
+    addressable (2.8.7)
+      public_suffix (>= 2.0.2, < 7.0)
     colorator (1.1.0)
-    concurrent-ruby (1.2.3)
+    concurrent-ruby (1.3.3)
     em-websocket (0.5.3)
       eventmachine (>= 0.12.9)
       http_parser.rb (~> 0)
     eventmachine (1.2.7)
-    ffi (1.16.3)
+    ffi (1.17.0)
     forwardable-extended (2.6.0)
     google-protobuf (3.25.3-x86_64-linux)
     http_parser.rb (0.8.0)
@@ -46,14 +46,14 @@ GEM
     mercenary (0.4.0)
     pathutil (0.16.2)
       forwardable-extended (~> 2.6)
-    public_suffix (5.0.5)
+    public_suffix (6.0.0)
     rake (13.2.1)
     rb-fsevent (0.11.2)
     rb-inotify (0.11.1)
       ffi (~> 1.0)
-    rexml (3.2.8)
-      strscan (>= 3.0.9)
-    rouge (4.2.1)
+    rexml (3.3.1)
+      strscan
+    rouge (4.3.0)
     safe_yaml (1.0.5)
     sass-embedded (1.69.5)
       google-protobuf (~> 3.23)

README.md

@@ -1,30 +1,30 @@
-Project 2 Learnings
--------------------
-
-Content Matters
-===============
-
-I had a difficulty figuring out what to say about myself in a succinct and interesting way. A lot of my work was done for companies with non-disclosure agreements, so that was out. This covered a lot of my web work, so I had to go back to print design materials. I found myself looking to draft text that was short and more like blog entries, which seemed a poor approach to the needs. I went back to some other documents I drafted for non-profits.
-
-Structured Documents
-====================
-
-The HTML was really straightforward for me. I knew how to assemble these relatively simple documents. That was not where I found myself struggling...
-
-Style
-=====
-
-...It was the stylesheets. This was not easy at the start and got more difficult as I continued. I wanted to demonstrate the ability to handle mobile first structure, transformative design, decent color model, good typography and responsive design; all without it looking like garbage. That was more than I anticipated.
-
-I researched a lot of other personal sites for how they implemented their liquid layout. I was stumped at the beginning because I goofed up the margins and padding for the page. I needed to understand how the various base sizes (300px, 748px, etc.) needed to be coded. I finally got to the point I used the appropriate full width for a page div, then each child div with appropriate left/right padding was the appropriate size. The color bands were in the appropriate places. 
-
-Looking at mobile first, I wanted to make sure that the single column basic design looked clear and had navigation that was navigable with "one eye, one thumb". That resulted in a bottom aligned buttons. That was easy. Having the navigation reset itself when the width changed was challenging. Further, I wanted to make sure this navigation was "button like" at a mobile size. This put me in the position of needing to use display:table and its design components so the buttons would have vertically centered text. (Yup, that's what it took.) This resulted in other issues between Chrome and other browsers. Chrome does not display css tables with the proper use of margins and padding (the navigations buttons showed up in a second box using the same margins as its parent div). To fix this, I needed to have the navigation div have no margins or padding left and right and used an auto margin to achieve the look browser to browser. The navigation moved using absolute positioning with relative ease at the larger widths.
-
-A lot of the issues I had were with color and fonts. I had to read up a bit on color theory. I had to get a TypeKit account. These got fixed within a few hours to the point I was happy with the start.
-
-With the larger sizes, I had to figure out multiple columns with appropriate number of columns and widths. It took a bit of revisions to get the right configuration, some of which may be somewhat kludged with the number of blocks I used (3) versus what I may eventually need to accomplish with more "articles". 
-
-Version Control
-===============
-
+Project 2 Learnings
+-------------------
+
+Content Matters
+===============
+
+I had a difficulty figuring out what to say about myself in a succinct and interesting way. A lot of my work was done for companies with non-disclosure agreements, so that was out. This covered a lot of my web work, so I had to go back to print design materials. I found myself looking to draft text that was short and more like blog entries, which seemed a poor approach to the needs. I went back to some other documents I drafted for non-profits.
+
+Structured Documents
+====================
+
+The HTML was really straightforward for me. I knew how to assemble these relatively simple documents. That was not where I found myself struggling...
+
+Style
+=====
+
+...It was the stylesheets. This was not easy at the start and got more difficult as I continued. I wanted to demonstrate the ability to handle mobile first structure, transformative design, decent color model, good typography and responsive design; all without it looking like garbage. That was more than I anticipated.
+
+I researched a lot of other personal sites for how they implemented their liquid layout. I was stumped at the beginning because I goofed up the margins and padding for the page. I needed to understand how the various base sizes (300px, 748px, etc.) needed to be coded. I finally got to the point I used the appropriate full width for a page div, then each child div with appropriate left/right padding was the appropriate size. The color bands were in the appropriate places. 
+
+Looking at mobile first, I wanted to make sure that the single column basic design looked clear and had navigation that was navigable with "one eye, one thumb". That resulted in a bottom aligned buttons. That was easy. Having the navigation reset itself when the width changed was challenging. Further, I wanted to make sure this navigation was "button like" at a mobile size. This put me in the position of needing to use display:table and its design components so the buttons would have vertically centered text. (Yup, that's what it took.) This resulted in other issues between Chrome and other browsers. Chrome does not display css tables with the proper use of margins and padding (the navigations buttons showed up in a second box using the same margins as its parent div). To fix this, I needed to have the navigation div have no margins or padding left and right and used an auto margin to achieve the look browser to browser. The navigation moved using absolute positioning with relative ease at the larger widths.
+
+A lot of the issues I had were with color and fonts. I had to read up a bit on color theory. I had to get a TypeKit account. These got fixed within a few hours to the point I was happy with the start.
+
+With the larger sizes, I had to figure out multiple columns with appropriate number of columns and widths. It took a bit of revisions to get the right configuration, some of which may be somewhat kludged with the number of blocks I used (3) versus what I may eventually need to accomplish with more "articles". 
+
+Version Control
+===============
+
 At the beginning, I was working as I always had: more revisions before versions. As I started to push versions, I started doing so more frequently as it became more "normal". (Also, understanding how the Windows GUI to Git worked helped.) I think I have more that I need to learn as to how to more efficiently use Git; I admit that I am still gunshy in using it more regularly.

_config.yml

@@ -1,3 +1,4 @@
+<<<<<<< Updated upstream
 lsi: false
 safe: true
 source: ./
@@ -11,3 +12,43 @@ kramdown:
   syntax_highlighter: rouge
 domain: tonysansone.me           # if you want to force HTTPS, specify the domain without the http at the start, e.g. example.com
 url: https://www.tonysansone.me  # the base hostname and protocol for your site, e.g. http://example.com
+=======
+lsi: false
+safe: true
+disable_disk_cache: true
+profile: true
+incremental: true
+livereload: true
+
+source: .
+destination: ./_site
+layouts_dir: ./_layouts
+sass:
+  sass_dir: ./assets/_sass
+
+exclude: 
+  - Gemfile
+  - Gemfile.lock
+  - .sass-cache/
+  - .jekyll-cache/
+  - gemfiles/
+  - node_modules
+  - vendor/bundle/
+  - vendor/cache/
+  - vendor/gems/
+  - vendor/ruby/
+
+
+gist:
+  noscript: false
+
+markdown: kramdown
+kramdown:
+  math_engine: mathjax
+  syntax_highlighter: rouge
+  input: GFM
+  parse_block_html: true
+highlighter: rouge
+
+
+>>>>>>> Stashed changes

_layouts/default.html

@@ -1,64 +1,65 @@
-<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
-<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en" id="anthony-sansone-com">
-
-<head>
-
-  <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
-  <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=5.0" />
-
-  <!--Change the path to respond.min.js to reflect its location in your site-->
-  <script type="text/javascript" src="js/respond.min.js"></script>
-
-  <title>{{ page.title }}</title>
-
-  <link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Roboto&family=Roboto+Slab">
-  <link rel="stylesheet" type="text/css" media="screen, print" href="css/reset.css" />
-  <link rel="stylesheet" type="text/css" media="screen" href="css/screen.css" />
-  <link rel="stylesheet" type="text/css" media="print" href="css/print.css" />
-  <link rel="icon" href="favicon.png" type="image/png" />
-
-</head>
-
-<body id="{{page.id}}" class="pct">
-
-  <header>
-
-    <h1><a href="" rel="home">Anthony T. Sansone</a></h1>
-
-    <div class="topline">
-      <div class="tagline">Designer. Writer. Board Member. Mentor. Educator.</div>
-
-      <div class="contact">
-        +1 312 725 2450
-        [email protected]
-      </div>
-    </div>
-
-    <ul class="accessibility">
-      <li><a href="#navigation">Jump to Navigation</a></li>
-      <li><a href="#content">Jump to Content</a></li>
-    </ul>
-
-  </header>
-
-  <main>
-
-    {{ content }}
-
-  </main>
-
-  <nav>
-    <div><a href="index.html">Home</a></div>
-    <div><a href="about.html">About</a></div>
-    <div><a href="resume.html">Resume</a></div>
-    <div><a href="cv.html">CV</a></div>
-  </nav>
-
-  <footer>
-    Site built with valid <a href="http://validator.w3.org/check?uri=referer" title="Validate this page's XHTML">XHTML</a>, <a href="http://jigsaw.w3.org/css-validator/check/referer?profile=css3" title="Validate this page's CSS">CSS3</a> and (mostly) <a href="http://jigsaw.w3.org/css-validator/check/referer" title="Validate this page's CSS">CSS2</a>, with the exception of Media Queries. Content and design by <a href="http://anthony-sansone.com" title="Check out the Home Page">Anthony T. Sansone</a>.
-  </footer>
-
-</body>
-
-</html>
-
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
+<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
+
+<head>
+
+  <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
+  <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=5.0" />
+
+  <!--Change the path to respond.min.js to reflect its location in your site-->
+  <script type="text/javascript" src="/assets/js/respond.min.js"></script>
+
+  <title>{{ page.title }}</title>
+
+  <link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Roboto&family=Roboto+Slab">
+  <link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Material+Symbols+Outlined:opsz,wght,FILL,[email protected],100..700,0..1,-50..200" />
+  <link rel="stylesheet" type="text/css" media="screen, print" href="/assets/css/reset.css" />
+  <link rel="stylesheet" type="text/css" media="screen" href="/assets/css/screen.css" />
+  <link rel="stylesheet" type="text/css" media="print" href="/assets/css/print.css" />
+  <link rel="icon" href="favicon.png" type="image/png" />
+
+</head>
+
+<body id="{{page.id}}">
+
+  <header>
+
+    <h1><a href="" rel="home">Anthony T. Sansone</a></h1>
+
+    <div class="topline">
+      <div class="tagline">Maker. Mentor. Teacher.</div>
+
+      <div class="contact">
+        +1 312 725 2450
+        [email protected]
+      </div>
+    </div>
+
+    <ul class="accessibility">
+      <li><a href="#navigation">Jump to Navigation</a></li>
+      <li><a href="#content">Jump to Content</a></li>
+    </ul>
+
+  </header>
+
+  <main>
+
+    {{ content }}
+
+  </main>
+
+  <nav>
+    <div><a href="index.html">Home</a></div>
+    <div><a href="resume.html">Resume</a></div>
+    <div><a href="cv.html">CV</a></div>
+    <div><a href="portfolio.html">Portfolio</a></div>
+  </nav>
+
+  <footer>
+    Site built with valid <a href="http://validator.w3.org/check?uri=referer" title="Validate this page's XHTML">XHTML</a>, <a href="http://jigsaw.w3.org/css-validator/check/referer?profile=css3" title="Validate this page's CSS">CSS3</a> and (mostly) <a href="http://jigsaw.w3.org/css-validator/check/referer" title="Validate this page's CSS">CSS2</a>, with the exception of Media Queries. Content and design by <a href="http://anthony-sansone.com" title="Check out the Home Page">Anthony T. Sansone</a>.
+  </footer>
+
+</body>
+
+</html>
+