Website updates sidebar

CHANGELOG.md

@@ -232,7 +232,7 @@ It also fixes a few minor STIX abnormalities for ICS Techniques.
 ## Features
 
 * Updated docs to clarify that both STIX 2.0 and STIX 2.1 input data is supported. See issue [#317](https://github.com/mitre-attack/attack-website/issues/317).
-* Updated [privacy policy](https://attack.mitre.org/resources/privacy/).
+* Updated [privacy policy](https://attack.mitre.org/resources/legal-and-branding/privacy/).
 
 ## Bugfixes
 
@@ -245,7 +245,7 @@ It also fixes a few minor STIX abnormalities for ICS Techniques.
 * Improved usability of matrix side layout to better differentiate tactic columns. See issue [#273](https://github.com/mitre-attack/attack-website/issues/273).
 * Improved matrix layout selection to include layout in dropdown title. See issue [#277](https://github.com/mitre-attack/attack-website/issues/277).
 * Added links to tactics in the technique information card. See issue [#288](https://github.com/mitre-attack/attack-website/issues/288).
-* Updated the [working with ATT&CK](https://attack.mitre.org/resources/working-with-attack/) page to mention [ATT&CK Workbench](https://github.com/center-for-threat-informed-defense/attack-workbench-frontend) and [STIX 2.1 support](https://github.com/mitre-attack/attack-stix-data).
+* Updated the [working with ATT&CK](https://attack.mitre.org/resources/access-data-and-tools/) page to mention [ATT&CK Workbench](https://github.com/center-for-threat-informed-defense/attack-workbench-frontend) and [STIX 2.1 support](https://github.com/mitre-attack/attack-stix-data).
 * Updated matrix poster to most recent version of ATT&CK.
 
 ## Bugfixes
@@ -275,7 +275,7 @@ It also fixes a few minor STIX abnormalities for ICS Techniques.
 
 ## Bugfixes
 
-* Added missing groups excel in the ATT&CK in Excel section of [Working with ATT&CK](https://attack.mitre.org/resources/working-with-attack/).
+* Added missing groups excel in the ATT&CK in Excel section of [Working with ATT&CK](https://attack.mitre.org/resources/access-data-and-tools/).
 * Fixed CTI training ticket number 4473845 -> 473845. See issue [#296](https://github.com/mitre-attack/attack-website/issues/296).
 
 # v3.2.1 (2021-04-29)
@@ -302,7 +302,7 @@ It also fixes a few minor STIX abnormalities for ICS Techniques.
   * Added to fields on software pages: Associated Software, Type, and Platforms.
 * Added generation of Navigator layers for mitigations, and updated navigator layer version to 4.2. See issue [#234](https://github.com/mitre-attack/attack-website/issues/234).
 * Added ATT&CK IDs to Mitigations and Procedure Examples on technique pages, and software and group home pages. See issues [#235](https://github.com/mitre-attack/attack-website/issues/235) and [#236](https://github.com/mitre-attack/attack-website/issues/236).
-* Improved the [Working with ATT&CK](https://attack.mitre.org/resources/working-with-attack/) page with additional information about ATT&CK data and the tools with which it can be manipulated. The new page also includes generated Excel spreadsheets representing the ATT&CK knowledge base (see also [mitreattack-python](https://github.com/mitre-attack/mitreattack-python)'s attackToExcel converter). See issue [#142](https://github.com/mitre-attack/attack-website/issues/142).
+* Improved the [Working with ATT&CK](https://attack.mitre.org/resources/access-data-and-tools/) page with additional information about ATT&CK data and the tools with which it can be manipulated. The new page also includes generated Excel spreadsheets representing the ATT&CK knowledge base (see also [mitreattack-python](https://github.com/mitre-attack/mitreattack-python)'s attackToExcel converter). See issue [#142](https://github.com/mitre-attack/attack-website/issues/142).
 * Data sources in technique cards are now hyperlinks to the [attack-datasources GitHub repository](https://github.com/mitre-attack/attack-datasources).
 
 ## Bugfixes
@@ -322,7 +322,7 @@ It also fixes a few minor STIX abnormalities for ICS Techniques.
 * Release ATT&CK content version 8.2.
   See detailed changes [here](https://github.com/mitre/cti/releases/tag/ATT%26CK-v8.2).
 * Updated Navigator layers to version 4.1 so that users are no longer warned that they are out of date.
-* Updated introductory video on [getting started](https://attack.mitre.org/resources/getting-started/) page.
+* Updated introductory video on [getting started](https://attack.mitre.org/resources/) page.
 
 # No website version update (2020-11-12)
 
@@ -376,7 +376,7 @@ It also fixes a few minor STIX abnormalities for ICS Techniques.
 
 ## Features
 
-* Added note on the [CTI training page](https://attack.mitre.org/resources/training/cti/) to indicate that ATT&CK v6 should be used instead of ATT&CK v7. See issue [#221](https://github.com/mitre-attack/attack-website/issues/221).
+* Added note on the [CTI training page](https://attack.mitre.org/resources/learn-more-about-attack/training/cti/) to indicate that ATT&CK v6 should be used instead of ATT&CK v7. See issue [#221](https://github.com/mitre-attack/attack-website/issues/221).
 
 # No website version update (2020-07-15)
 
@@ -449,7 +449,7 @@ It also fixes a few minor STIX abnormalities for ICS Techniques.
 * Added horizontal scroll indicators to matrices so that it's easier to tell when there's more to the left or right. See issue [#93](https://github.com/mitre-attack/attack-website/issues/93).
 * The website tour route is now generated dynamically, allowing the site to adapt the tour to custom STIX content. See issue [#110](https://github.com/mitre-attack/attack-website/issues/110).
 * Added Navigator layers to the changelog of the sub-techniques update. See issue [#126](https://github.com/mitre-attack/attack-website/issues/126).
-* Updated [contribute page](https://attack.mitre.org/resources/contribute). See issue [#162](https://github.com/mitre-attack/attack-website/issues/162).
+* Updated [contribute page](https://attack.mitre.org/resources/engage-with-attack/contribute). See issue [#162](https://github.com/mitre-attack/attack-website/issues/162).
 
 ## Bugfixes
 

NOTICE.txt

@@ -15,4 +15,4 @@ See the License for the specific language governing permissions and
 limitations under the License.
 
 This project makes use of ATT&CK®
-ATT&CK® Terms of Use - https://attack.mitre.org/resources/terms-of-use/
+ATT&CK® Terms of Use - https://attack.mitre.org/resources/legal-and-branding/terms-of-use/

README.md

@@ -67,4 +67,4 @@ limitations under the License.
 
 This project makes use of ATT&CK®
 
-[ATT&CK Terms of Use](https://attack.mitre.org/resources/terms-of-use/)
+[ATT&CK Terms of Use](https://attack.mitre.org/resources/legal-and-branding/terms-of-use/)

attack-theme/static/scripts/search-presentation.js

@@ -68,12 +68,12 @@ function filter_date_helper(input_date) {
     for (let date_value of date_list) {
         if (date_value.checked){
             if(date_value.id.includes("1")){
-                if((year-date_year == 0) || (year-date_year == 1)){
+                if(year-date_year <= 1){
                     filter_date = true;
                 }
             }
             else if(date_value.id.includes("3")){
-                if(year-date_year == 3){
+                if(year-date_year <= 3){
                     filter_date = true;
                 }
             }

attack-theme/static/scripts/sidebar-load-all.js

@@ -15,6 +15,9 @@ $("#sidebars").load(mod_entry, function() {
         let v_number = mod_name[2];
         old_winlocation = old_winlocation.replace('/versions/'+ v_number,'');
     }
+    if (old_winlocation.includes('tour')){
+        old_winlocation = old_winlocation.split('?')[0];
+    }
     let navElements = document.querySelectorAll('.sidenav-head > a');
     let winlocation;
     navElements.forEach(function(element){
@@ -33,7 +36,7 @@ $("#sidebars").load(mod_entry, function() {
         winlocation = old_winlocation
     }
     if(element.href == winlocation){
-        $(element.parentNode).addClass("active")
+        $(element.parentNode).addClass("active");
     }});
 
     //This code is for creating a collapsable sidebar for the mobile view

attack-theme/static/scripts/tour/tour-versions.js

@@ -41,7 +41,7 @@ let tourSteps = [
         orphan: true,
         backdrop: false,
         title: "End of tour",
-        content: "We hope you have enjoyed this tour of the sub-techniques features of the ATT&CK website. If you have any feedback or suggestions, please visit <a href='" + base_url + "/contact'>the contact page</a> to get in touch.",
+        content: "We hope you have enjoyed this tour of the sub-techniques features of the ATT&CK website. If you have any feedback or suggestions, please visit <a href='" + base_url + "/resources/engage-with-attack/contact'>the contact page</a> to get in touch.",
         onShow: function() {
             lastStepReached = true;
         },

attack-theme/static/style/_colors.scss

@@ -8,7 +8,8 @@
 $attack-colors: (
     attack-orange: #c63f1f,
     attack-blue: #062f4f,
-    attack-footer:#0b2338
+    attack-footer:#0b2338,
+    attack-active: #0156b3
 );
 // User colors
 $user-colors: (
@@ -28,6 +29,7 @@ $colors: (
     primary: (color: if(variable-exists($name: use_attack_theme), map-get($attack-colors, attack-orange), map-get($user-colors, user-gray)),  on-color: white),  //used for header and some nav elements
     secondary: (color: if(variable-exists($name: use_attack_theme), map-get($attack-colors, attack-blue), map-get($user-colors, user-gray)), on-color: white),  //used for some buttons
     footer: (color: if(variable-exists($name: use_attack_theme), map-get($attack-colors, attack-footer), map-get($user-colors, user-gray)), on-color: #87deff),  //used for footer and some buttons
+    active: (color: if(variable-exists($name: use_attack_theme), map-get($attack-colors, attack-active), map-get($user-colors, user-gray)), on-color: #eaeaea),  //used for active buttons and sidebar links
     body: (color: white, on-color: #39434C),                                  //primary page body
     // body: (color: rgb(50, 50, 50), on-color: #cdcdcd),                          //example of a dark theme for the site
     link: (color: #4f7cac),                                                     //hyperlinks

attack-theme/static/style/_layouts.scss

@@ -170,18 +170,18 @@ a {
 
 .slide-button {
     @extend .brand-button;
-    border-color: #0156b3;
+    border-color: color(active);
     color: #ffffff;
-    background: #0156b3;
+    background: color(active);
     padding: 4px 16px;
     a & { text-decoration: none !important; }
 }
 
 .slide-button-secondary {
     @extend .brand-button;
-    color: #0156b3;
+    color: color(active);
     background: #ffffff;
-    border-color: #0156b3;
+    border-color: color(active);
     padding: 4px 16px;
     a & { text-decoration: none !important; }
 }
@@ -196,11 +196,11 @@ a {
 }
 
 .slide-button:hover {
-    background: #062f4f;
+    background: color(secondary);
 }
 
 .slide-button-secondary:hover {
-    background: #dfdfdf;
+    background: on-color(active);
 }
 
 // placeholder for base style of all navy colored buttons
@@ -561,7 +561,7 @@ code {
     width: 20%;
     top: 9.3rem;
     float: right;
-    background: #eaeaea;
+    background: on-color(active);
 }
 
 @media screen and (max-width: 90.62rem) {
@@ -632,7 +632,7 @@ a.partial-underline {
             margin: 0;
         }
         &.background {
-            background: #eaeaea;
+            background: on-color(active);
         }
     }
 }
@@ -641,7 +641,7 @@ a.partial-underline {
     @extend .brand-button;
     border: 0;
     width: 100%;
-    background: #0156b3;
+    background: color(active);
     padding: 2px 12px;
     justify-content: center;
     .card-button-text, .card-button-icon {
@@ -714,7 +714,7 @@ a.partial-underline {
 
 .card-title-icon {
     float: right;
-    color: #0156b3;
+    color: color(active);
 }
 /******/
 
@@ -753,19 +753,6 @@ a.partial-underline {
 }
 /******/
 
-.nestedlist {
-    counter-reset: item;
-}
-
-.nestedlist-item {
-    display: block;
-}
-
-.nestedlist-item::before {
-    content: counters(item, ".") ". ";
-    counter-increment: item;
-}
-
 /*CALLOUTS*/
 // callouts style in the Contribute page
 .bs-callout {
@@ -1268,7 +1255,7 @@ div#sidebars {
 		width: 90%;
 	}
     .sponsors-block {
-        background: #eaeaea;
+        background: on-color(active);
         text-align: center;
         display: flex;
         justify-content: space-evenly;
@@ -1327,7 +1314,7 @@ div#sidebars {
   }
   .resource {
     flex: 1;
-    background-color: #e0e0e0;
+    background-color: on-color(active);
     padding: 10px;
     box-sizing: border-box;
   }

attack-theme/static/style/_nav.scss

@@ -245,6 +245,7 @@
         display: flex;
         flex-direction: column;
         padding-right: 5px;
+        padding-left: 1rem;
         .heading {
             border-bottom: 1px solid color-alternate(body);
             flex: 0 1 0;
@@ -265,6 +266,7 @@
                     flex-direction: row;
                     a, .expand-button { //any direct child
                         cursor: pointer;
+                        color: black;
                         &:hover {
                             background: color-alternate(body);
                         }
@@ -287,12 +289,20 @@
                     }
 
                     &.active { //current page
-                        &, &>a { color: color(primary) !important; }
+                        &, &>a {
+                            color: color(active) !important;
+                            font-weight: bolder;
+                            background: on-color(active);
+                            font-family: "Roboto-Bold", sans-serif;
+                        }
                         // background-color: color-alternate(body);
                         // border-right: to-rem(3) solid color(primary);
                     }
 
                 }
+                .sidenav-body {
+                    padding-left: 0.75rem;
+                }
                 .sidenav { //nested
                     padding-left: to-rem(12);
                 }

attack-theme/templates/general/attack-index.html

@@ -17,15 +17,15 @@
                         <table id="tour-start-container" class="quick-links">
                             <tr>
                                 <td>
-                                    <a href="/resources/getting-started" role="button">Getting Started</a>
+                                    <a href="/resources/" role="button">Get Started</a>
                                 </td>
                                 <td>
                                     <a href="#" id="tour-start" onclick="start_tour()" role="button">Take a Tour</a>
                                 </td>
                             </tr>
                             <tr>
                                 <td>
-                                    <a href="/resources/contribute" role="button">Contribute</a>
+                                    <a href="/resources/engage-with-attack/contribute" role="button">Contribute</a>
                                 </td>
                                 <td>
                                     <a href="https://medium.com/mitre-attack" role="button" target="_blank" >Blog <img src="/theme/images/external-site-dark.jpeg" alt="External site" class="external-icon" /></a>

attack-theme/templates/general/attackcon-overview.html

@@ -13,13 +13,20 @@
 <ol class="breadcrumb">
     <li class="breadcrumb-item"><a href="/">Home</a></li>
     <li class="breadcrumb-item"><a href="/resources">Resources</a></li>
-    <li class="breadcrumb-item"><a href="/resources/attackcon">ATT&CKcon</a></li>
+    <li class="breadcrumb-item"><a href="/resources/learn-more-about-attack">Learn More about ATT&amp;CK</a></li>
+    <li class="breadcrumb-item"><a href="/resources/learn-more-about-attack/attackcon">ATT&CKcon</a></li>
     <li class="breadcrumb-item">{{ con.title }}</a></li>
 </ol>
 
-<div class="tab-content attackcons p-4 mb-3">
+<div class="tab-content attackcons mb-3">
     {% set conID = "-".join(con.date.split(' ')) %}
     <div class="container pb-3">
+        {% if "sponsors_img_list" in con %}
+            <h1>{{ con.title }} Presentations and Sponsors</h1>
+        {% else %}
+            <h1>{{ con.title }} Presentations</h1>
+        {% endif %}
+
         {% set ifSponsor = "sponsors_img_list" in con %}
         {% if "banner_img" in con %}
         <p>
@@ -119,12 +126,7 @@ <h6 class="presentation-count"></h6>
                 {% endfor %}
             </div>
             <div class="sponsors">
-                {% if "sponsors_img" in con %}
-                <div>
-                    <h5><strong>Sponsors</strong></h5>
-                    <img src="{{ con.sponsors_img }}" width="100%">
-                </div>
-                {% elif "sponsors_img_list" in con %}
+                {% if "sponsors_img_list" in con %}
                 <div>
                     <h5><strong>Sponsors</strong></h5>
                     <div class="sponsors-block">
@@ -139,7 +141,6 @@ <h5><strong>Sponsors</strong></h5>
             </div>
         </div>
     </div>
-
 </div>
 {% endblock %}
 

attack-theme/templates/general/base-template.html

@@ -94,14 +94,14 @@
                         <div class="footer-link-group">
                             <div class="row row-footer">
                                 <div class="px-3 col-footer">
-                                    <u class="footer-link"><a href="/contact" class="footer-link">Contact Us</a></u>
+                                    <u class="footer-link"><a href="/resources/engage-with-attack/contact" class="footer-link">Contact Us</a></u>
                                 </div>
                                 <div class="px-3 col-footer">
-                                    <u class="footer-link"><a href="/resources/terms-of-use" class="footer-link">Terms of Use</a></u>
+                                    <u class="footer-link"><a href="/resources/legal-and-branding/terms-of-use" class="footer-link">Terms of Use</a></u>
                                 </div>
                                 {% if RESOURCES %}
                                     <div class="px-3 col-footer">
-                                        <u class="footer-link"><a href="/resources/privacy" class="footer-link">Privacy Policy</a></u>
+                                        <u class="footer-link"><a href="/resources/legal-and-branding/privacy" class="footer-link">Privacy Policy</a></u>
                                     </div>
                                 {% endif %}
                                 <div class="px-3">