diff --git a/config/default/editor.editor.basic_html.yml b/config/default/editor.editor.basic_html.yml
index d4fe1be..3f818ce 100644
--- a/config/default/editor.editor.basic_html.yml
+++ b/config/default/editor.editor.basic_html.yml
@@ -13,8 +13,11 @@ editor: ckeditor5
settings:
toolbar:
items:
+ - heading
+ - alignment
- bold
- italic
+ - underline
- '|'
- link
- '|'
@@ -22,13 +25,69 @@ settings:
- numberedList
- '|'
- blockQuote
- - drupalInsertImage
- '|'
- - heading
+ - drupalMedia
- code
+ - codeBlock
- '|'
- sourceEditing
plugins:
+ ckeditor5_alignment:
+ enabled_alignments:
+ - center
+ - justify
+ - left
+ - right
+ ckeditor5_codeBlock:
+ languages:
+ -
+ label: 'Plain text'
+ language: plaintext
+ -
+ label: C
+ language: c
+ -
+ label: 'C#'
+ language: cs
+ -
+ label: C++
+ language: cpp
+ -
+ label: CSS
+ language: css
+ -
+ label: Diff
+ language: diff
+ -
+ label: HTML
+ language: html
+ -
+ label: Java
+ language: java
+ -
+ label: JavaScript
+ language: javascript
+ -
+ label: PHP
+ language: php
+ -
+ label: Python
+ language: python
+ -
+ label: Ruby
+ language: ruby
+ -
+ label: TypeScript
+ language: typescript
+ -
+ label: XML
+ language: xml
+ -
+ label: YAML
+ language: yml
+ -
+ label: JSON
+ language: json
ckeditor5_heading:
enabled_headings:
- heading2
@@ -36,8 +95,6 @@ settings:
- heading4
- heading5
- heading6
- ckeditor5_imageResize:
- allow_resize: true
ckeditor5_list:
properties:
reversed: false
diff --git a/config/default/filter.format.basic_html.yml b/config/default/filter.format.basic_html.yml
index 2c59252..b33103c 100644
--- a/config/default/filter.format.basic_html.yml
+++ b/config/default/filter.format.basic_html.yml
@@ -35,7 +35,7 @@ filters:
status: true
weight: -10
settings:
- allowed_html: '
![]()
' + allowed_html: '
' filter_html_help: false filter_html_nofollow: false filter_html_image_secure: diff --git a/web/themes/custom/dchadwick/css/style.css b/web/themes/custom/dchadwick/css/style.css index eb4e555..8130a4e 100644 --- a/web/themes/custom/dchadwick/css/style.css +++ b/web/themes/custom/dchadwick/css/style.css @@ -143,6 +143,11 @@ header#header #block-dchadwick-main-menu > ul a.is-active:hover { margin: 0; } +blockquote { + font-style: italic; + border-left: 1px solid var(--site-primary); +} + .table { width: auto; margin: auto; @@ -474,6 +479,7 @@ table.cols-5 td.incorrect { font-size: 14px; color: var(--site-gray); margin-bottom: 10px; + border-radius: 10px; } .node-type-article .left-side .article-info .info-item { display: flex; @@ -487,26 +493,54 @@ table.cols-5 td.incorrect { font-size: 16px; line-height: 24px; } +.node-type-article .left-side img { + border-radius: 10px; +} .node-type-article .right-side { display: inline-block; vertical-align: top; width: 24%; - text-align: center; + text-align: left; right: 0; } +.node-type-article .right-side ul { + list-style-type: none; + padding: 0; + margin: 0; + display: flex; + flex-wrap: wrap; + margin-left: 5px; + padding-left: 10px; + border-left: 2px solid var(--site-primary); +} +.node-type-article .right-side ul li a { + display: inline-block; + margin-left: 20px; + width: 100%; + margin: 20px 0; + font-size: 18px; + font-weight: 700; + cursor: pointer; + transition: all 0.2s ease; + text-decoration: none; + text-decoration-thickness: 0px; +} +.node-type-article .right-side ul li a:hover { + color: var(--site-gray); + text-decoration: underline; + text-decoration-thickness: 5px; +} .node-type-article .right-side.fixed-sidebar { position: fixed; top: 0; - right: 25px; - background: var(--site-secondary); - color: var(--site-primary); - transition: all 0.2s ease-in-out; + right: 34px; } html { font-size: 100%; box-sizing: border-box; overflow-x: hidden; + scroll-behavior: smooth; } .region-content { @@ -545,4 +579,16 @@ p { .container { margin: 0 50px; } +} + +blockquote { + font-style: italic; + border-left: 1px solid var(--site-primary); + padding-left: 20px; +} + +pre { + background: #414559; + color: #c6d0f5; + padding: 10px; } \ No newline at end of file diff --git a/web/themes/custom/dchadwick/js/articles.js b/web/themes/custom/dchadwick/js/articles.js index 8b8d3eb..b3430eb 100644 --- a/web/themes/custom/dchadwick/js/articles.js +++ b/web/themes/custom/dchadwick/js/articles.js @@ -9,22 +9,45 @@ Drupal.behaviors.articleBehaviors = { attach(context) { let rightSidebar = once('articleBehavior', '#article-body .right-side', context); - let anchor = document.querySelector('.right-side').offsetTop; - - const seeIfSticky = (element) => { - // get right sidebar scroll top. - let jumpLinks = document.querySelector('.right-side'); - var curScroll = (window.pageYOffset !== undefined) ? window.pageYOffset : (document.documentElement || document.body.parentNode || document.body).scrollTop; - console.log(curScroll + ":: jumpPos: " + anchor); - if (curScroll >= anchor) { - jumpLinks.classList.add('fixed-sidebar'); - } - else if (curScroll < anchor) { - jumpLinks.classList.remove('fixed-sidebar'); - } - }; - rightSidebar.forEach(function(elem) { + let anchor = document.querySelector('.right-side').offsetTop; + // get all headings. + let headings = context.querySelectorAll(".article-content h2, h3, h4, h5, h6"); + // create an + // add each item as
- Text
+ let jumpLinks = document.createElement('ul'); + headings.forEach(function(heading) { + if (heading.classList.contains("visually-hidden")) { + return; + } + // convert text to a name. + let headingText = heading.innerText; + let headingId = headingText.replace(/\s+/g, '-').toLowerCase(); + // set as the id. + heading.id = headingId; + let listElement = document.createElement('li'); + let listElementLink = document.createElement('a'); + listElementLink.href = "#" + headingId; + listElementLink.innerText = headingText; + listElement.appendChild(listElementLink) + jumpLinks.appendChild(listElement); + }); + elem.innerHTML = ""; + elem.append(jumpLinks); + // Function to check if the nav should stick. + const seeIfSticky = (element) => { + // get right sidebar scroll top. + let jumpLinks = document.querySelector('.right-side'); + var curScroll = + (window.pageYOffset !== undefined) ? + window.pageYOffset : (document.documentElement || document.body.parentNode || document.body).scrollTop; + if (curScroll >= anchor) { + jumpLinks.classList.add('fixed-sidebar'); + } + else if (curScroll < anchor) { + jumpLinks.classList.remove('fixed-sidebar'); + } + }; document.addEventListener("scroll", seeIfSticky); }); }, diff --git a/web/themes/custom/dchadwick/src/sass/partials/article.scss b/web/themes/custom/dchadwick/src/sass/partials/article.scss index e071afc..ec56433 100644 --- a/web/themes/custom/dchadwick/src/sass/partials/article.scss +++ b/web/themes/custom/dchadwick/src/sass/partials/article.scss @@ -5,12 +5,10 @@ } .article-intro { - h1 { margin: 0; font-size: 56px; color: var(--site-white); - // max-width: 70%; } } @@ -33,6 +31,7 @@ font-size: 14px; color: var(--site-gray); margin-bottom: 10px; + border-radius: 10px; .info-item { display: flex; @@ -49,22 +48,53 @@ font-size: 16px; line-height: 24px; } + + img { + border-radius: 10px; + } } .right-side { display: inline-block; vertical-align: top; width: 24%; - text-align: center; + text-align: left; right: 0; + ul { + list-style-type: none; + padding: 0; + margin: 0; + display: flex; + flex-wrap: wrap; + margin-left: 5px; + padding-left: 10px; + border-left: 2px solid var(--site-primary); + + li a { + display: inline-block; + margin-left: 20px; + width: 100%; + margin: 20px 0; + font-size: 18px; + font-weight: 700; + cursor: pointer; + transition: all .2s ease; + text-decoration: none; + text-decoration-thickness: 0px; + + &:hover { + color: var(--site-gray); + text-decoration: underline; + text-decoration-thickness: 5px; + } + } + } + &.fixed-sidebar { position: fixed; top: 0; - right: 25px; - background: var(--site-secondary); - color: var(--site-primary); - transition: all .2s ease-in-out; + right: 34px; } } } diff --git a/web/themes/custom/dchadwick/src/sass/partials/main.scss b/web/themes/custom/dchadwick/src/sass/partials/main.scss index 0a29565..dacd1d9 100644 --- a/web/themes/custom/dchadwick/src/sass/partials/main.scss +++ b/web/themes/custom/dchadwick/src/sass/partials/main.scss @@ -1,8 +1,4 @@ -main { - // max-width: $container-full; - // margin: auto; -} - -#main { - // z-index: 501; +blockquote { + font-style: italic; + border-left: 1px solid var(--site-primary); } diff --git a/web/themes/custom/dchadwick/src/sass/style.scss b/web/themes/custom/dchadwick/src/sass/style.scss index d16ba62..d86c647 100644 --- a/web/themes/custom/dchadwick/src/sass/style.scss +++ b/web/themes/custom/dchadwick/src/sass/style.scss @@ -52,6 +52,7 @@ html { font-size: 100%; box-sizing: border-box; overflow-x: hidden; + scroll-behavior: smooth; } .region-content { @@ -91,3 +92,15 @@ p { } } +blockquote { + font-style: italic; + border-left: 1px solid var(--site-primary); + padding-left: 20px; +} + +pre { + background: #414559; + color: #c6d0f5; + padding: 10px; +} + diff --git a/web/themes/custom/dchadwick/templates/node/node--article.html.twig b/web/themes/custom/dchadwick/templates/node/node--article.html.twig index 2e6a4a4..cc6ae8a 100644 --- a/web/themes/custom/dchadwick/templates/node/node--article.html.twig +++ b/web/themes/custom/dchadwick/templates/node/node--article.html.twig @@ -82,21 +82,21 @@- {{ content.body }} +- {{ node.changed.value|date("m/d/Y h:i A") }} + {{ node.changed.value|date("m/d/Y") }}- {{ content.field_read_time|default('1 minute read time') }} + {{ node.changed.value|date("h:i A") }} +++ {{ content.field_read_time|default('1 minute read time') }}+ {{ content.body }} +diff --git a/web/themes/custom/dchadwick/templates/system/page.html.twig b/web/themes/custom/dchadwick/templates/system/page.html.twig index 87f48e8..6324f32 100644 --- a/web/themes/custom/dchadwick/templates/system/page.html.twig +++ b/web/themes/custom/dchadwick/templates/system/page.html.twig @@ -1,11 +1,3 @@ - -This is where link block goes
-This is where link block goes
-This is where link block goes
-This is where link block goes
-This is where link block goes
-This is where link block goes
{{ page.navigation }} @@ -22,20 +14,6 @@