diff --git a/components/SubscriptionsPage/ClassCard.tsx b/components/SubscriptionsPage/ClassCard.tsx
index d3ea45ec..df44480b 100644
--- a/components/SubscriptionsPage/ClassCard.tsx
+++ b/components/SubscriptionsPage/ClassCard.tsx
@@ -4,6 +4,7 @@ import { LastUpdated } from '../common/LastUpdated';
 import { DesktopSectionPanel } from '../ResultsPage/Results/SectionPanel';
 import { getFormattedSections } from '../ResultsPage/ResultsLoader';
 import DropdownArrow from '../icons/DropdownArrow.svg';
+import IconCollapseExpand from '../icons/IconCollapseExpand';
 import CourseCheckBox from '../panels/CourseCheckBox';
 import { CRNBadge } from './CRNBadge';
 import axios from 'axios';
@@ -24,8 +25,10 @@ export const ClassCardWrapper = ({
 }: ClassCardWrapperType): ReactElement => {
   return (
     <div className="SearchResult">
-      <div>{headerLeft}</div>
-      {headerRight}
+      <div className="SearchResult__header">
+        <div className="SearchResult__header--left">{headerLeft}</div>
+        {headerRight}
+      </div>
 
       {body}
       {afterBody}
@@ -72,24 +75,45 @@ export function ClassCard({
   return (
     <ClassCardWrapper
       headerLeft={
+        // ask Nick what this is and if this makes me not have to div --left
         <>
           <span className="SearchResult__header--classTitle">
             {course.subject} {course.classId}: {course.name}
           </span>
-          <LastUpdated
+          {/* <LastUpdated
             lastUpdateTime={course.lastUpdateTime}
             className="SearchResult__header--sub"
-          />
-          {course.sections.map((section) => (
-            <CRNBadge
-              key={section.crn}
-              userInfo={userInfo}
-              crn={section.crn}
-            ></CRNBadge>
-          ))}
+          />  */}
+          <div className="SearchResult__header--sub">
+            {course.sections.map((section) => (
+              <CRNBadge
+                key={section.crn}
+                userInfo={userInfo}
+                crn={section.crn}
+              ></CRNBadge>
+            ))}
+          </div>
         </>
       }
-      headerRight={<button onClick={unsubscribeAll}>Unsubscribe</button>}
+      headerRight={
+        <div
+          className="SearchResult__showAll"
+          onClick={() => setAreSectionsHidden(!areSectionsHidden)}
+          style={{
+            cursor: 'pointer',
+            display: 'inline-flex',
+            alignItems: 'center',
+          }}
+        >
+          <IconCollapseExpand
+            className={
+              areSectionsHidden
+                ? 'SearchResult__showAll--subscriptionCollapsed'
+                : 'SearchResult__showAll--subscriptionExpanded'
+            }
+          />
+        </div>
+      }
       body={
         <>
           <div style={{ display: areSectionsHidden ? 'none' : 'block' }}>
@@ -143,27 +167,26 @@ export function ClassCard({
         </>
       }
       afterBody={
-        <>
-          <div
-            className={
-              areSectionsHidden
-                ? 'SearchResult__showAll--subscriptionButton'
-                : 'SearchResult__showAll'
-            }
-            role="button"
-            tabIndex={0}
-            onClick={() => setAreSectionsHidden(!areSectionsHidden)}
-          >
-            <span>{areSectionsHidden ? 'Show sections' : 'Hide sections'}</span>
-            <DropdownArrow
+        !areSectionsHidden && (
+          <>
+            <div
               className={
                 areSectionsHidden
-                  ? 'SearchResult__showAll--subscriptionCollapsed'
-                  : 'SearchResult__showAll--subscriptionExpanded'
+                  ? 'SearchResult__showAll--subscriptionButton'
+                  : 'SearchResult__showAll'
               }
-            />
-          </div>
-        </>
+              role="button"
+              tabIndex={0}
+            >
+              <button
+                className={'SearchResult__showAll--unsubscribeButton'}
+                onClick={unsubscribeAll}
+              >
+                Unsubscribe All
+              </button>
+            </div>
+          </>
+        )
       }
     />
   );
diff --git a/package.json b/package.json
index 4a2c3839..5715997b 100644
--- a/package.json
+++ b/package.json
@@ -115,5 +115,6 @@
   },
   "engines": {
     "node": ">=18"
-  }
+  },
+  "packageManager": "yarn@1.22.22+sha512.a6b2f7906b721bba3d67d4aff083df04dad64c399707841b7acf00f6b133b7ac24255f2652fa22ae3534329dc6180534e98d17432037ff6fd140556e2bb3137e"
 }
diff --git a/pages/subscriptions.tsx b/pages/subscriptions.tsx
index ac4d1e28..7a47edfd 100644
--- a/pages/subscriptions.tsx
+++ b/pages/subscriptions.tsx
@@ -7,6 +7,11 @@ import { SubscriptionCourse } from '../components/types';
 import { gqlClient } from '../utils/courseAPIClient';
 import useUserInfo from '../utils/useUserInfo';
 import { EmptyCard } from '../components/SubscriptionsPage/EmptyCard';
+import getTermInfosWithError from '../utils/TermInfoProvider';
+import { getTermName, getLatestTerm } from '../components/terms';
+import { Campus } from '../components/types';
+import Keys from '../components/Keys';
+import axios from 'axios';
 
 async function fetchCourseNotifs(classMapping, courseIds) {
   for (const courseId of courseIds) {
@@ -116,6 +121,10 @@ export default function SubscriptionsPage(): ReactElement {
   // is the user subscribed to at least one class
   const [isSubscribed, setIsSubscribed] = useState(false);
 
+  const termInfos = getTermInfosWithError().termInfos;
+  const termId = getLatestTerm(termInfos, Campus.NEU);
+  const termName = getTermName(termInfos, termId).replace('Semester', '');
+
   useEffect(() => {
     if (isUserInfoLoading) {
       return;
@@ -145,6 +154,22 @@ export default function SubscriptionsPage(): ReactElement {
     fetchSubscriptions();
   }, [userInfo?.phoneNumber, isUserInfoLoading]);
 
+  const unsubscribeAll = () => {
+    const allSections = Array.from(classes.values()).flatMap(
+      (course) => course.sections
+    );
+
+    axios
+      .delete(`${process.env.NEXT_PUBLIC_NOTIFS_ENDPOINT}/user/subscriptions`, {
+        data: {
+          token: userInfo.token,
+          sectionIds: allSections.map((s) => Keys.getSectionHash(s)),
+          // courseIds: [Keys.getClassHash(course)],
+        },
+      })
+      .then(() => fetchUserInfo());
+  };
+
   if (isFetching) {
     return (
       <>
@@ -171,7 +196,6 @@ export default function SubscriptionsPage(): ReactElement {
       <div>
         <Header
           title={`Subscriptions`}
-          // TODO (sam 11-04-2024: maybe we can get the previous campus/termid if we wnt to preserve this behavior)
           campus={null}
           termId={null}
           searchData={null}
@@ -180,30 +204,38 @@ export default function SubscriptionsPage(): ReactElement {
           onSignOut={onSignOut}
         />
       </div>
+
       {isSubscribed ? (
-        <>
-          <div className="Results_Container">
-            <div className="Results_MainWrapper">
-              <div className="Results_Main">
-                <h2>Subscriptions</h2>
-                {Array.from(classes)
-                  .sort((a, b) => (a > b ? 1 : -1)) // Sort to ensure the sub order doesn't change
-                  .map(([courseCode, course]) => {
-                    return (
-                      <ClassCard
-                        key={courseCode}
-                        course={course}
-                        sections={course.sections}
-                        userInfo={userInfo}
-                        fetchUserInfo={fetchUserInfo}
-                        onSignIn={onSignIn}
-                      />
-                    );
-                  })}
+        <div className="Results_Container">
+          <div className="Results_MainWrapper">
+            <div className="Results_Main">
+              <div className="Subscriptions_Header_Container">
+                <h2 className="Subscriptions_Title">
+                  {termName} Notifications
+                </h2>
+                <button
+                  className="Unsubscribe_All_Button"
+                  onClick={unsubscribeAll}
+                >
+                  <img src="/unsubscribe.svg" className="Unsubscribe_Icon" />
+                  Unsubscribe All
+                </button>
               </div>
+              {Array.from(classes)
+                .sort((a, b) => (a > b ? 1 : -1))
+                .map(([courseCode, course]) => (
+                  <ClassCard
+                    key={courseCode}
+                    course={course}
+                    sections={course.sections}
+                    userInfo={userInfo}
+                    fetchUserInfo={fetchUserInfo}
+                    onSignIn={onSignIn}
+                  />
+                ))}
             </div>
           </div>
-        </>
+        </div>
       ) : (
         <EmptyCard />
       )}
diff --git a/public/unsubscribe.svg b/public/unsubscribe.svg
new file mode 100644
index 00000000..e814122b
--- /dev/null
+++ b/public/unsubscribe.svg
@@ -0,0 +1,7 @@
+<svg width="22" height="22" viewBox="0 0 22 22" fill="none" xmlns="http://www.w3.org/2000/svg">
+<g id="Unsubscribe">
+<path id="Vector 1" d="M8.88456 5.27706C4.54715 6.4819 5.35038 11.7029 5.51102 14.4338L4.78812 16.1206H16.3546L15.6317 14.4338C16.3546 7.2048 14.4268 5.759 12.2581 5.27706C12.2581 4.79512 11.9316 3.83125 10.5713 3.83125C9.12552 3.83125 8.88456 4.79512 8.88456 5.27706Z" stroke="#E63946" stroke-width="1.5"/>
+<path id="Vector 2" d="M10.8123 18.7713C9.07731 18.7713 8.16165 17.0845 8.4026 16.3616H12.74C12.981 17.0845 12.1699 18.7713 10.8123 18.7713Z" stroke="#E63946" stroke-width="1.5"/>
+<path id="Vector 3" d="M3.54092 19.5303L4.07125 20.0607L4.60158 19.5303L19.5303 4.60158L20.0607 4.07125L19.5303 3.54092L18.4591 2.46967L17.9288 1.93934L17.3984 2.46967L2.46967 17.3984L1.93934 17.9288L2.46967 18.4591L3.54092 19.5303Z" fill="#E63946" stroke="white" stroke-width="1.5"/>
+</g>
+</svg>
diff --git a/styles/pages/_Results.scss b/styles/pages/_Results.scss
index 15c67690..aac5b4f6 100644
--- a/styles/pages/_Results.scss
+++ b/styles/pages/_Results.scss
@@ -175,6 +175,47 @@ $SIDEBAR_WIDTH: 268px;
     padding-left: 10px;
   }
 
+  .Subscriptions_Header_Container {
+    display: flex;
+    justify-content: space-between;
+    align-items: end;
+    flex-direction: row;
+
+    .Subscriptions_Title {
+      font-family: Lato;
+      font-size: 24px;
+      font-style: normal;
+      font-weight: 700;
+      line-height: 28.8px;
+    }
+
+    .Unsubscribe_All_Button {
+      display: flex;
+      gap: 8px;
+      align-items: center;
+
+      padding: 9px 18px;
+
+      cursor: pointer;
+
+      border: 0.5px solid #1d3557;
+      background-color: white;
+      border-radius: 8px;
+
+      color: #212121;
+      font-family: Lato;
+      font-size: 14px;
+      font-style: normal;
+      font-weight: 700;
+      line-height: 16px;
+
+      .Unsuscribe_Icon {
+        width: 8px;
+        height: 8px;
+      }
+    }
+  }
+
   .Results_Main__EmptyCard {
     display: flex;
     flex-direction: column;
diff --git a/styles/results/_SearchResult.scss b/styles/results/_SearchResult.scss
index 7c76499e..82473637 100644
--- a/styles/results/_SearchResult.scss
+++ b/styles/results/_SearchResult.scss
@@ -29,6 +29,7 @@
       font-size: 18px;
       line-height: 2px;
       border-radius: 5px 5px 0 0;
+      color: Colors.$NEU9;
     }
 
     &--employeeName {
@@ -175,6 +176,7 @@
   &__sectionTable > thead > tr > th {
     text-align: left;
     padding-left: 16px;
+    padding-top: 20px;
   }
 
   &__sectionTable > thead > tr > th:nth-child(6) {
@@ -236,15 +238,28 @@
     }
 
     &--subscriptionExpanded {
-      transform: rotate(-180deg);
+      transform: rotate(-90deg);
       margin-top: 2px;
     }
 
     &--subscriptionCollapsed {
-      transform: rotate(0deg);
+      transform: rotate(90deg);
       margin-top: 3px;
     }
 
+    &--unsubscribeButton {
+      margin-left: auto;
+      width: fit-content;
+      display: flex;
+      width: auto;
+      padding: 8px 16px;
+      align-items: center;
+      border-radius: 8px;
+      border: 1px solid #d1d3d7;
+      font-weight: 700;
+      background: #fff;
+    }
+
     & > span {
       margin-right: 8px;
     }