Updated version non-uc

bardsley · Nov 25, 2024 · ff3bda2 · ff3bda2
1 parent 51fc171
commit ff3bda2
Show file tree

Hide file tree

Showing 6 changed files with 145 additions and 246 deletions.
diff --git a/docs/client/winchester/arrow.png → docs/client/winchester/arrow2.png b/docs/client/winchester/arrow.png → docs/client/winchester/arrow2.png
diff --git a/docs/client/winchester/attempt2.js b/docs/client/winchester/attempt2.js
@@ -122,7 +122,7 @@ document.addEventListener("DOMContentLoaded", function(event) {
           // delay: 0.1, // wait 0.2 seconds from the last scroll event before doing the snapping
           ease: 'power4.inOut' // the ease of the snap animation ("power3" by default)
       },
-      markers: true,
+      // markers: true,
     }
   });
 

diff --git a/docs/client/winchester/index.html b/docs/client/winchester/index.html
@@ -89,7 +89,27 @@ <h2>Our Measures</h2>
     <section class="spacer"></section>
 
     <section id="priorities">
-      <h2>Our Priorities</h2>
+      <h2> 
+        <button onclick="moveBack()" aria-roledescription="Previous Slide">
+          <svg fill="#004aad" height="50px" width="50px" version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" 
+            viewBox="0 0 330 330" xml:space="preserve">
+            <path id="XMLID_6_" d="M165,0C74.019,0,0,74.019,0,165s74.019,165,165,165s165-74.019,165-165S255.981,0,165,0z M205.606,234.394
+            c5.858,5.857,5.858,15.355,0,21.213C202.678,258.535,198.839,260,195,260s-7.678-1.464-10.606-4.394l-80-79.998
+            c-2.813-2.813-4.394-6.628-4.394-10.606c0-3.978,1.58-7.794,4.394-10.607l80-80.002c5.857-5.858,15.355-5.858,21.213,0
+            c5.858,5.857,5.858,15.355,0,21.213l-69.393,69.396L205.606,234.394z"/>
+          </svg>
+        </button>
+        Our Priorities
+        <button onclick="moveForward()" aria-roledescription="Next Slide">
+          <svg fill="#004aad" height="50px" width="50px" version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" 
+          viewBox="0 0 330 330" xml:space="preserve">
+        <path id="XMLID_2_" d="M165,0C74.019,0,0,74.019,0,165s74.019,165,165,165s165-74.019,165-165S255.981,0,165,0z M225.606,175.605
+          l-80,80.002C142.678,258.535,138.839,260,135,260s-7.678-1.464-10.606-4.394c-5.858-5.857-5.858-15.355,0-21.213l69.393-69.396
+          l-69.393-69.392c-5.858-5.857-5.858-15.355,0-21.213c5.857-5.858,15.355-5.858,21.213,0l80,79.998
+          c2.814,2.813,4.394,6.628,4.394,10.606C230,168.976,228.42,172.792,225.606,175.605z"/>
+        </svg>
+        </button>
+      </h2>
       <ul id="priority-slider">
         <li id="communities">
           <h3>communities</h3>
@@ -133,8 +153,7 @@ <h3>collaboration</h3>
         </li>
       </ul>
       <div id="controls">
-        <button onclick="moveBack()">Previous</button>
-        <button onclick="moveForward()">Next</button>
+
         <p id="debug" style="width: 100%; font-size: 2rem;"></p>
       </div>
 

diff --git a/docs/client/winchester/parallax.css b/docs/client/winchester/parallax.css
@@ -1,7 +1,7 @@
 
 :root {
   --organisation: #004aad;
-  --logo-dark: ##558dc4;
+  --logo-dark: #558dc4;
   --logo-light: #83a6d0;
   --yellow: #ffde59;
   --orange: #ff914d;
@@ -19,20 +19,19 @@ body {
   font-family:'Josefin Sans',sans-serif!important;
   position: relative;
   overflow-x:hidden;
-  background-image: url('./background2.png');
+  background-image: url('https://assets.prod.unioncloud-internal.com/image/images/570365/original/background2.png');
   font-size: 62.5%;
-  box-sizing: content-box;
+  box-sizing: border-box;
 }
 body * {
-  box-sizing: content-box;
+  box-sizing: border-box;
 }
 
-h1 { max-width: 80%; }
-h2 { margin:0;}
+
 
 #journey-line {
   height: 100%;
-  background-image: url(./dottedline.svg);
+  background-image: url('https://assets.prod.unioncloud-internal.com/image/images/570374/original/dottedline.svg');
   background-size: var(--line-wiggle-room) auto;
   background-repeat: repeat-y;
   position: absolute; right:0; top:0; bottom: 0;
@@ -82,7 +81,7 @@ header#hero {
 	margin: 0px auto;
 }
 header #hero-image {
-  background-image: url(./header-background.png);
+  background-image: url('https://assets.prod.unioncloud-internal.com/image/images/570368/original/header-background.png');
   opacity: 0.5;
   background-position: center bottom;
 	background-repeat: no-repeat;
@@ -91,7 +90,7 @@ header #hero-image {
 	height: var(--hero-height);
 	position: absolute;
 }
-header h1 { 
+header#hero h1 { 
   color: #fff;
   text-transform: uppercase;
   z-index: 2;
@@ -100,7 +99,7 @@ header h1 {
 }
 @media screen and (min-width: 624px) {
 
-  header h1 { 
+  header#hero h1 { 
     font-size: 5rem;
   }
 }
@@ -170,7 +169,7 @@ section#introduction {
   border: 1px solid transparent;  
   /* background-color: hotpink; */
   display: block;
-  background-image: url(./sports.png);
+  background-image: url('https://assets.prod.unioncloud-internal.com/image/images/570367/original/sports.png');
   background-repeat: no-repeat;
   background-position-x: right;
   background-position-y: top;
@@ -223,17 +222,17 @@ section#introduction {
   flex-direction: column;
   justify-content: center;
   align-items: center;
-  left: 10%;
-  font-size: 4rem;
-  width: calc(80% - 2em);
+  /* left: 10%; */
+  font-size: 3.5rem;
+  width: 100%;
   padding: 1em;
   margin-top: 1em;
   /* opacity:0; */
   transform: translateX(100%) scale(0,0);
   /* scale: 0%; */
   /* min-height: 5rem; */
 }
-#goals #community { transform: translateX(0%) scale(0.8,0.8); }
+#goals #community { transform: translateX(0%), scale(1,1) }
 #goals #community { background-color: var(--purple); }
 #goals #familiarity { background-color: var(--red);}
 #goals #advocacy { background-color: var(--orange); color: #000;}
@@ -255,7 +254,7 @@ section#introduction {
 .rotator #goal-wheel-wrap {
   width: 80%;
   padding-top: 80px;
-  background-image: url(./arrow.png);
+  background-image: url('https://assets.prod.unioncloud-internal.com/image/images/570372/original/arrow2.png');
   background-repeat: no-repeat;
   background-position-x: 45%;
   background-position-y: 0px;
@@ -270,7 +269,7 @@ section#introduction {
 .rotator #goal-wheel-wrap .logo {
   width: 100%; height: calc(100% - 80px);
   position: absolute;
-  background-image: url(./swirl.png);
+  background-image: url('https://assets.prod.unioncloud-internal.com/image/images/570369/original/swirl.png');
   background-position: center center;
   background-repeat: no-repeat;
   background-size: 15% 15%;
@@ -337,7 +336,7 @@ section#introduction {
   border: 1px solid transparent;  
   /* background-color: hotpink; */
   display: block;
-  background-image: url(./students.png);
+  background-image: url('https://assets.prod.unioncloud-internal.com/image/images/570366/original/students.png');
   background-repeat: no-repeat;
   background-position-x: left;
   background-position-y: top;
@@ -391,9 +390,9 @@ section#introduction {
   flex-direction: column;
   justify-content: center;
   align-items: center;
-  left: 10%;
-  font-size: 4rem;
-  width: calc(80% - 2em);
+  /* left: 10%; */
+  font-size: 3.5rem;
+  /* width: calc(80% - 2em); */
   padding: 1em;
   margin-top: 1em;
   /* opacity:0; */
@@ -423,7 +422,7 @@ section#introduction {
 .rotator #goal-wheel-wrap {
   width: 80%;
   padding-top: 80px;
-  background-image: url(./arrow.png);
+  background-image: url('https://assets.prod.unioncloud-internal.com/image/images/570372/original/arrow2.png');
   background-repeat: no-repeat;
   background-position-x: 45%;
   background-position-y: 0px;
@@ -438,7 +437,7 @@ section#introduction {
 .rotator #goal-wheel-wrap .logo {
   width: 100%; height: calc(100% - 80px);
   position: absolute;
-  background-image: url(./swirl.png);
+  background-image: url('https://assets.prod.unioncloud-internal.com/image/images/570369/original/swirl.png');
   background-position: center center;
   background-repeat: no-repeat;
   background-size: 15% 15%;
@@ -508,7 +507,9 @@ section#introduction {
 
 
 }
-
+#priorities, #priorities * {
+  box-sizing: content-box;
+}
 #priorities {
   /* background-color: var(--organisation); */
   /* color: #fff; */
@@ -567,6 +568,9 @@ section#introduction {
   color: #fff;
 }
 
+#priorities h2 button {
+  border: none; background: none;
+}
 #controls {
   width: 100%;
   padding: 2rem 0 5rem;

diff --git a/...ioncloud-internal.com/global_assets/stylesheets/winchesterstudents/winchesterstudents.css b/...ioncloud-internal.com/global_assets/stylesheets/winchesterstudents/winchesterstudents.css
@@ -750,52 +750,125 @@ span.toggle-text {
         text-align:center
     }
 }
+
 /* #banner-section {
     margin:0; width: 100%;
     max-width: unset;
 }
 #full-width-arch-column-content {
     width: 100%;
 } */
-
 /* Strategy */
 
+
 /* Strategy Slider */
-/* Temp */
-.jcarousel-prev, .jcarousel-next {
-    /* display:none!important; */
-}
-#uc-page-id-strategy  #priorities-stripe #priorities-stripe ul li {
-    /* border: 1px solid hotpink; */
-    background-color: Var(--cobalt-blue); padding: 20px;
+
+/* #uc-page-id-strategy #priorities-stripe #priorities-stripe ul li {
+    background-color: Var(--cobalt-blue);
+    padding: 20px;
     width: 200px;
     border-radius: 15px;
-
 }
 
-#uc-page-id-strategy  #priorities-stripe #priorities-stripe .page-title {
+#uc-page-id-strategy #priorities-stripe #priorities-stripe .page-title {
     color: var(--white);
     font-size: 1.5rem;
 }
-#uc-page-id-strategy  #priorities-stripe #priorities-stripe .edit-mode-page {
+
+#uc-page-id-strategy #priorities-stripe #priorities-stripe .edit-mode-page {
     overflow: hidden;
 }
 
-
 #uc-page-id-strategy #priorities-stripe .jcarousel-skin-tango .jcarousel-clip-horizontal {
     width: 100%;
 }
 
-#uc-page-id-strategy  #priorities-stripe #priorities-stripe .edit-mode-page p {
+#uc-page-id-strategy #priorities-stripe #priorities-stripe .edit-mode-page p {
     color: var(--white);
 }
 
 #priorities-stripe-wrap {
-    height: 400px; 
-    /* border: solid 1px red; */
-} 
-#uc-page-id-strategy .jcarousel-list,
-#uc-page-id-strategy .jcarousel-clip,
-#uc-page-id-strategy .jcarousel-container,
-#uc-page-id-strategy .jcarousel-skin-tango,
-#uc-page-id-strategy #priorities-stripe { height: 100%;}
+    height: 400px;
+}
+
+#uc-page-id-strategy .jcarousel-list, #uc-page-id-strategy .jcarousel-clip, #uc-page-id-strategy .jcarousel-container, #uc-page-id-strategy .jcarousel-skin-tango, #uc-page-id-strategy #priorities-stripe {
+    height: 100%;
+} */
+
+
+/* Custom Strategy Page */
+
+#uc-page-id-strategy .row.content>.row,
+#uc-page-id-strategy .row.content>.row .home-content-wrap,
+#uc-page-id-strategy .row.content>.row .section {
+    max-width: unset; 
+    width: 100%;
+    margin:0;
+}
+
+#uc-page-id-strategy h1 { background: unset; }
+
+#uc-page-id-strategy h1 { max-width: 80%; }
+#uc-page-id-strategy h2 { margin:0;}
+#uc-page-id-strategy .wrapper .content .row .content-wrap p { font-size: unset; line-height:1em;}
+#uc-page-id-strategy #introduction h2 {
+    margin-bottom: 1.5rem;
+}
+#uc-page-id-strategy h2, 
+#uc-page-id-strategy.content .row .content-wrap h2 {
+    text-shadow: unset;
+    color: inherit;
+}
+
+#uc-page-id-strategy #goals {
+    height: calc(100vh - 100px);
+}
+
+#uc-page-id-strategy #goal-wheel-wrap {
+    max-width: 400px;
+}
+
+@media screen and (max-width: 470px) {
+    body {
+        font-size: 31.25%;
+    } 
+    #uc-page-id-strategy .content {
+        margin-top: 0;
+        padding: 0px 0 0px;
+        width: 100%;
+    }
+
+    #uc-page-id-strategy .wrapper .content .row .content-wrap p {
+        font-size: 0.8em;
+    }
+    #uc-page-id-strategy #goals {
+        padding-top:unset;
+    }
+}
+
+#uc-page-id-strategy .row.top, .row.top-union {
+    max-width: 100%;
+    overflow: hidden;
+}
+#uc-page-id-strategy .top-social div.mmu-search-icon {
+    display: none;
+}
+#uc-page-id-strategy #goals .description .value {
+    font-size: 3em;
+}
+#uc-page-id-strategy .rotator { width: 100%; }
+#uc-page-id-strategy #goals .ripple { padding: 100px 30px 30px; }
+#uc-page-id-strategy #goals .description {
+    height: unset;
+    display: flex; flex-direction: column;
+    padding:0;
+}
+#uc-page-id-strategy #goals .description .value {
+    width: 100%;
+    left: unset;
+    position: relative;
+    margin-top:0;
+    line-height: 1.1em;
+    font-size: 1.6rem;
+    border: solid 1px hotpink;
+}