diff --git a/_layouts/new-layouts/post.html b/_layouts/new-layouts/post.html index 07cb68dbb..d7c93ad22 100644 --- a/_layouts/new-layouts/post.html +++ b/_layouts/new-layouts/post.html @@ -3,69 +3,76 @@ ---
-
+
-
-

{{ page.title }}

+
+

{{ page.title }}

- {% include authors.html authors=page.author compact=true %} + {% include authors.html authors=page.author compact=true %} - + + {% assign featured_image = page.featured-image %} {% assign + featured_image_dark = page.featured-image-dark %} {% if featured_image.url + %} + {{ featured_image.alt }} + {% endif %} {% if featured_image_dark.url %} + {{ featured_image_dark.alt }} + {% endif %} +
+ {{ content }} {% if page.author %} +
+

Authors

+ {% include authors.html authors=page.author %} {% endif %} - {% if page.image %} - {{ page.title }} featured image - {% endif %} +
-
- {{ content }} +

Continue Reading

- {% if page.author %} -
-

Authors

- {% include authors.html authors=page.author %} - {% endif %} - -
- -

Continue Reading

- - {% if page.previous or page.next %} - + {% if page.previous or page.next %} + + {% endif %}
-
\ No newline at end of file + + diff --git a/_posts/2024-09-17-announcing-swift-6.md b/_posts/2024-09-17-announcing-swift-6.md index 7bf9d56fd..83d0a114a 100644 --- a/_posts/2024-09-17-announcing-swift-6.md +++ b/_posts/2024-09-17-announcing-swift-6.md @@ -5,9 +5,6 @@ date: 2024-09-17 10:00:00 title: Announcing Swift 6 author: [hborla] category: "Language" -featured-image: - url: '/assets/images/placeholders/image_placeholder_large.png' - alt: 'An FPO image for a blog.' --- We're delighted to announce the general availability of Swift 6. This is a major new release that expands Swift to more platforms and domains. diff --git a/assets/images/6.2-blog/blog-posts-hero-dark@2x.png b/assets/images/6.2-blog/blog-posts-hero-dark@2x.png new file mode 100644 index 000000000..2d51a845b Binary files /dev/null and b/assets/images/6.2-blog/blog-posts-hero-dark@2x.png differ diff --git a/assets/images/6.2-blog/blog-posts-hero@2x.png b/assets/images/6.2-blog/blog-posts-hero@2x.png new file mode 100644 index 000000000..db966e74d Binary files /dev/null and b/assets/images/6.2-blog/blog-posts-hero@2x.png differ diff --git a/assets/javascripts/new-javascripts/blog.js b/assets/javascripts/new-javascripts/blog.js index 370112b0b..108dc1c16 100644 --- a/assets/javascripts/new-javascripts/blog.js +++ b/assets/javascripts/new-javascripts/blog.js @@ -1,37 +1,30 @@ const wrapper = document.querySelector('.blogs-and-filter-wrapper') const postsWrapper = wrapper.querySelector('.blogs-wrapper') const postData = JSON.parse(wrapper.querySelector('#post-data').textContent) -const checkboxes = [...wrapper.querySelectorAll('.category-filter')] +const filters = [...wrapper.querySelectorAll('.category-filter')] const selectAllBox = document.querySelector('.select-all') const dropdown = document.querySelector('.dropdown') -const allCheckboxes = [selectAllBox, ...checkboxes] +const allCheckboxes = [selectAllBox, ...filters] const filterMenuToggle = document.querySelector('.dropdown-toggle') -const dropdownCloseButton = document.querySelector('.dropdown-close') + // create post links const createAnchor = (postData) => { const anchor = document.createElement('a') - const imgEl = postData['image-url'] - ? `${postData['image-alt']}` - : '' - console.log(imgEl, postData.title) anchor.href = postData.url - anchor.classList = imgEl ? 'post-link post-link-with-image' : 'post-link' + anchor.classList = 'post-link' anchor.innerHTML = ` - ${imgEl} - ${imgEl ? '
' : ''}

${postData.title}

${postData.excerpt}

${postData.categories.reduce((markup, category) => { return markup + ` ${category}` }, '')} - ${imgEl ? '
' : ''} ` return anchor } // checks all filters -const selectAllCategories = () => { +const selectAllCategories = (selectAllBox, checkboxes) => { if (selectAllBox.checked) { checkboxes.forEach((checkbox) => { checkbox.checked = true @@ -71,12 +64,12 @@ const elementsCache = postData.map((post) => { } }) -updatePosts(filterPosts(elementsCache, checkboxes), postsWrapper, postsWrapper) +updatePosts(filterPosts(elementsCache, filters), postsWrapper, postsWrapper) filterMenuToggle.addEventListener('click', () => { dropdown.classList.toggle('active') - const isExpanded = this.getAttribute('aria-expanded') === 'true' + const isExpanded = filterMenuToggle.getAttribute('aria-expanded') === 'true' filterMenuToggle.toggleAttribute('aria-expanded', !isExpanded) }) @@ -89,28 +82,32 @@ window.addEventListener('click', (evt) => { }) // Select all category filters -selectAllBox.addEventListener('click', selectAllCategories) - -dropdownCloseButton.addEventListener('click', () => { - const dropdown = this.closest('.dropdown') - dropdown.classList.remove('active') - document - .querySelector('.dropdown-toggle') - .setAttribute('aria-expanded', 'false') -}) +selectAllBox.addEventListener('click', () => + selectAllCategories(selectAllBox, filters), +) -checkboxes.forEach((checkbox) => { +filters.forEach((checkbox) => { checkbox.addEventListener('change', () => { - // If every box is either checked or none are, set all filter to checked - if ( - checkboxes.every((checkbox) => checkbox.checked === checkboxes[0].checked) - ) { + const enabledFilters = filters.filter((checkbox) => checkbox.checked) + + if (enabledFilters.length === 1) { + enabledFilters[0].disabled = true + } else { + filters.forEach((checkbox) => (checkbox.disabled = false)) + } + + // If every box is checked, select all + if (enabledFilters.length === filters.length) { selectAllBox.checked = true + selectAllBox.disabled = true selectAllCategories() return + // Uncheck all select all if filter was unchecked } else if (!checkbox.checked && selectAllBox.checked) { selectAllBox.checked = false + selectAllBox.disabled = false } - updatePosts(filterPosts(elementsCache, checkboxes), postsWrapper) + + updatePosts(filterPosts(elementsCache, filters), postsWrapper) }) }) diff --git a/assets/stylesheets/new-stylesheets/_helpers.scss b/assets/stylesheets/new-stylesheets/_helpers.scss index 4eb05388e..24bf957e4 100644 --- a/assets/stylesheets/new-stylesheets/_helpers.scss +++ b/assets/stylesheets/new-stylesheets/_helpers.scss @@ -195,6 +195,20 @@ } } +body[data-color-scheme='light'] { + .hide-light { + display: none + } +} + +body[data-color-scheme='dark'] { + .hide-dark { + display: none + } +} + + + @mixin underline { text-decoration: underline; text-decoration-color: color-mix(in srgb, currentColor 50%, transparent); diff --git a/assets/stylesheets/new-stylesheets/pages/_blog.scss b/assets/stylesheets/new-stylesheets/pages/_blog.scss index a2ccc0307..9b0aa7a43 100644 --- a/assets/stylesheets/new-stylesheets/pages/_blog.scss +++ b/assets/stylesheets/new-stylesheets/pages/_blog.scss @@ -325,7 +325,7 @@ } .dropdown-header { - padding: 53px 0 20px; + padding: 23px 0 20px; } &.active { @@ -361,6 +361,7 @@ width: 25px; height: 25px; border-radius: 5px; + outline: 1px solid var(--site-text-color); } label { diff --git a/blog/index.md b/blog/index.md index 2268a72d2..dfae2966e 100644 --- a/blog/index.md +++ b/blog/index.md @@ -11,10 +11,14 @@ title: Blog {% assign hero_card_title = site.data.new-data.blog.page-data.category_titles[0] %} {% assign hero_card_post = site.categories[hero_card_title][0] %} {% assign hero_card_thumbnail = hero_card_post.featured-image %} + {% assign hero_card_thumbnail_dark = hero_card_post.featured-image-dark %}