x x x
x

Versions Compared

Old Version 37

changes.mady.by.user Mazin Abubeker

Saved on

compared with

New Version 38

changes.mady.by.user Mazin Abubeker

Saved on

Key

  • This line was added.
  • This line was removed.
  • Formatting was changed.

...

HTML
<style>
.header{
	font-size: 35px;
	font-weight: bold!important;
}
div#admin-panel{
	display: flex;
	flex-direction: row;
}
div#admin-panel * {
    font-weight: bold!important;
}

.applicationBannerNotStarted, .applicationBannerStarted, .applicationBannerSubmitted{
	display: none;
}

.dash-banner{
	height: fit-content!important;
}

.dash-banner .banner-segment:nth-child(1){
	padding: 40px 0!important;
	height: fit-content!important;
}

.dash-banner .banner-segment:nth-child(2){
	height: unset!important;
}
</style>
<script>

const searchJiraApplicationsForUser = async (issueType) => {
  let jiraRes = await jQuery.ajax({
    url: "/rest/scriptrunner/latest/custom/searchJiraTickets",
    headers: {
      'X-Atlassian-Token' : 'nocheck',
      'Content-type' : 'application/json'
    },
    type: "POST",
    processData: false,
    contentType: false,
    data: JSON.stringify({
      jql: `issuetype = "${issueType}" AND ('Confluence User Key' ~ '${AJS.params.remoteUserKey}') ORDER BY updated DESC`
    }),
	success: W=>{
		console.log(W)
	},
	error: L=>{
		console.log(L)
	}
  }).then(res => res);
  return jiraRes;
}

const showDynamicApplicationBanner = async (pageTitle, issueType, applicationDeadlinePassed = false) => {
  var bannerApplicationSubmitted = false;
  var bannerApplicationComplete = false;
  var bannerApplicationStarted = false;

  if (applicationDeadlinePassed) {
    $(".applicationBannerDeadlinePassed").waitUntilExists(() => {
      $('.applicationBannerLoading').remove();
      $(".applicationBannerDeadlinePassed").show();
    });

    return;
  }

  await searchJiraApplicationsForUser(issueType).then((appsCheck) => {
    if (appsCheck.issues.length !== 0) {
      bannerApplicationStarted = true;
      if (appsCheck.issues[0].fields.customfield_10631) {
        bannerApplicationSubmitted = true;
      }
    }

    if (bannerApplicationSubmitted) {
      // show submitted banner
      $(".applicationBannerSubmitted").waitUntilExists(() => {
        $('.applicationBannerLoading').remove();
        $(".applicationBannerSubmitted").show();
      });
    } else if (bannerApplicationStarted) {
      // show started banner
      $(".applicationBannerStarted").waitUntilExists(() => {
        $('.applicationBannerLoading').remove();
        $(".applicationBannerStarted").show();
      });
    } else {
      // show get started banner
      $(".applicationBannerNotStarted").waitUntilExists(() => {
        $('.applicationBannerLoading').remove();
        $(".applicationBannerNotStarted").show();
      });
    }
  })
}

</script>


HTML
<!--
To add:

- Redirect for admins to admin dashboard & judges to judging dashboard

-->
HTML
<style>

.rw_page_left_section{
	background: unset<style>
div.banner-segment.second-segment{
	background: url('https://gsvlabs-confluence-files.s3.us-west-2.amazonaws.com/images/MSIA/application_banner.jpg')!important;
	background-size: cover!important;
	borderposition: unset!important;
	padding: unsetrelative!important;
}

@media only screen and (min-width: 580px){
.dash-sqaure{
    width: 250px!important;
    min-width: 250px!important;
    max-width: 250px!important;
}

}
@media only screen and (min-device-width: 320px) and (max-device-width: 480px){
	.button_container{
		background: white!important;
	}
	.mobile-menu-sticky .button_container.active{
		background: var(--mobile-menu-background)!important;
	}
}

.aboutcard{
	height: fit-content!important;
}
@media only screen and (max-width: 580px) {
	.arrow-right{
		display: none!important;
	}
	#main-content .dash-banner{
		padding-bottom: 0!important;
		flex-direction: column!important;
		height: fit-content!important;
	}
	.banner-segment{
		width: 100%!important;
		height: fit-content!important;
		overflow: visible!important;
		padding: 0!important;
	}
	.second-segment{
		height: 250px!important;
	}
	.dashboard-content{
		flex-direction: column!important;
	}
	.aboutcard{
		flex-direction: column-reverse!important;
	}
	.dashimg-container{
		display: none!important;
	}
	.dates-container{
		width: 100%!important;
	}
	.headertext{
		text-align: center;
	}
}

div#announcements-wrapper .header {
    color: white;
}
 </style>
HTML
div.banner-segment.second-segment::after{
	position: absolute;
	bottom: 20px;
	left: 20px;
	content: "July 15, 2022  5 PM ET";
 	font-size: 18px;
	color: white;
	font-family: var(--main-font-family);
 	z-index: 100;
}

div.banner-segment.second-segment::before{
	position: absolute;
	bottom: 40px;
	left: 20px;
	content: "Application Deadline:";
	font-size: 22px;
	font-weight: bold!;
	color: white;
	font-family: var(--main-font-family);
	z-index: 100;
}

div div#announcements-wrapper{
	margin-top: 20px!important;
}
 p.header{
	margin-bottom: 30px!important
}
.announcementcard .confirmationButton, .dash-banner .bottom-content a {
	text-transform: uppercase;
	font-weight: bold !important;
}
#key-dates-list {
    font-size: 16px;
    padding-left: 15px;
    margin-top: 5px;
}
#key-dates-headertext {
	height: max-content !important;
}
</style>

<link rel="stylesheet" href="https://gsvlabs-confluence-files.s3.us-west-2.amazonaws.com/stylesheets/MS+SBA/home.css?v=1">


HTML
<!-- Redirect msia judges/admins -->


HTML
<link href="https://fonts.googleapis.com/css2?family=IBM+<link href="https://fonts.googleapis.com/css2?family=IBM+Plex+Mono&&display=swap" rel="stylesheet">
<style>

#rw_theme_content{
	margin-top: 0!important;
}
#content{
	background: url(https://gsvlabs-confluence-files.s3.us-west-2.amazonaws.com/images/MStanley/dashboard-background.jpg),var(--main-background)!important;
    background-repeat: no-repeat!important;
    background-size: contain!important;
}

#main-content .aui-popup.aui-dialog .dialog-button-panel button.button-panel-button{
	background: var(--primary-color)!important;
}

#main-content span#cf_messages a[title="Delete"]{
	color: var(--primary-color)!important;
}

.text-encompasser font{
	font-family: Helvetica!important;
}

.text-encompasser button{
	background: var(--primary-color)!important;
}

#admin-panel button,#admin-panel a{
	background: var(--primary-color)!important;
}

#main-content{
	background: none!important;
}

.microblog-sidebar-container{
    width: 30%!important;
}

.aui-nav span{
    font-size: 18px!important;
}

.micropost-author{
    font-size: 16px!important;
}

.microblog-tooltip{
    font-size: 14px!important;
}

.micropost-content p{
    font-size: 14px!important;
}


/*
.rw_item_name{
	font-family: var(--main-font-family)!important;
	font-size: 16px!important;
	letter-spacing: 0.5px!important;
}*/
.rw_category_items{
	float: left;
}
span > .table-wrap{
    box-shadow: 0 0 15px 2px rgb(0 0 0 / 20%)
}

.cf_dashboardannouncementspremium_table{
    background: white;
}


.cf_linkStyle_tr,.cf_linkStyle{
	display: none!important;
}
</style>
HTML
<script>

window.addEventListener("load", showDynamicApplicationBanner(AJS.params.pageTitle.toLowerCase(), 'LBNL Issue Type'), false);
</script>
HTML
<style>

.dash-banner p{
	color: var(--primary-color)!important;
}

.micropost-left{
	width: 0!important;
}

#announcement-overlay{
	display: none!important;
}

.micropost-footer, .microblog-timeline-action-menu{
    display: none!important;
}


div.wiki-content table.tablesorter>thead>tr>th{
	background: var(--primary-color)!important;
	border-radius: 0px!important;
	width: auto!important;
}


.text-encompasser font{
	font-family: var(--main-font-family)!important;
}



.empty-state-container.medium .description-container {
    display: none;
}

button[title="New Announcement"] {
  background: var(--btn-color-primary) !important;
}

a[title='View/Edit stored data']{
    margin-left: 10px;
    border-radius: unset !important; 
    background: var(--secondary-color) !important;
    text-decoration: unset;   
}   

.microBlogWrapper a.aui-nav-item.space {
    display: none !important;
}

button {
  font-family: var(--main-font-family) !important;
}

#announcements-wrapper .general-text-container {
  padding: 0px;
}

#announcementcontainer {
  width: 100% !important;
  flex-direction: column !important;
}

#announcements-wrapper {
  flex-direction: column;
  height: fit-content !important;
  align-items: flex-start !important;
  display: flex !important;
  justify-content: center;
  width: 75% !important;
  margin: 0 12.5% !important;
}

#announcements-wrapper .announcementcard {
  padding: 0;
  cursor: unset !important;
  border-radius: 0px !important;
  border: 0px solid #ffffff;
  width: calc(100% - 6px) !important;
  margin: 0px;
  height: 350px;
  background-position: right top;
   flex-direction: row;
    background: white;
    box-shadow: 0 0 15px 2px rgb(0 0 0 / 20%);
    
}

.announcementcard .imgalign {
  width: 45%;
  border-radius: 0px;
}

#announcements-wrapper div.text-encompasser {
	

  width: 55%;
  border: none;
  padding: 0 20px;
  display: flex;

  justify-content: flex-start;
}

#announcements-wrapper img {
  border-radius: var(--card-shadow);
  width: 100%;
  height: 100%;
  border: none;
  margin: 0;
  object-fit: cover;
  object-position: center;
}

.announcementcard .imgalign {
  height: 100%;
  background-size: cover;
  background-position: center;
}

.announcementcard .card-title {
  font-size: 21px;
  color: black;
  line-height: normal;
  letter-spacing: normal;
  font-weight: bold;
  padding: 0;
  text-align: left;
  margin: 0 0 10px 0 !important;
}

.announcementcard .card-description {
  font-size: 15px;
  font-weight: var(--font-weight-paragraph-text);
  line-height: 1.5;
  letter-spacing: normal;
}

/* The dots/bullets/indicators */
#dot-container {
  width: 100%;
  margin: 15px 0px 30px 0px;
}

.cdot {
  text-align: center;
  cursor: pointer;
  height: 5px;
  width: 5px;
  margin: 0 2px;
  background-color: var(--secondary-color) !important;
  opacity: 0.5;
  border-radius: 50%;
  display: inline-block;
  transition: background-color 0.6s ease;
}

.active,
.cdot:hover {
  opacity: 1;
}

/* Fading animation */
.fade {
  -webkit-animation-name: fade;
  -webkit-animation-duration: 1.5s;
  animation-name: fade;
  animation-duration: 1.5s;
}

@-webkit-keyframes fade {
  from {
    opacity: 0.4;
  }
  to {
    opacity: 1;
  }
}

@keyframes fade {
  from {
    opacity: 0.4;
  }
  to {
    opacity: 1;
  }
}

.largeimagewithtextbelow-listmempag p.card-subtitle {
  font-size: var(--font-size-s);
}

.table-wrap p {
  margin-bottom: 10px;
}

label span {
  float: unset !important;
}

div#announcements-wrapper {
  width: 90% !important;
  margin: auto !important;
}


/** CAROUSEL STYLING **/

.carousel-container {
    align-self: center;
}

a#toggle-admin-table {
    background: var(--secondary-color);
    font-family: var(--main-font-family);
    color: var(--primary-color);
    text-decoration: none;
	width: fit-content;
    font-weight: 900;
    display: flex;
	align-items: center;
	justify-content: center;
	padding: 0.5em 1em;
}

.tablesorter-header-inner {
    color: #172b4d !important;
}

div#announcementsTable {
    height: auto !important;
}

button.aui-button.aui-button-primary.cf_dashboardannouncementspremium {
    display: flex;
	align-items: center;
	padding: 1.5em 1em;
    margin-right: 10px;
}

.carousel-arrow{
  font-size: 30px;
  color: var(--primary-color);
  cursor: pointer;
}

/* ================================================================= MOBILE STYLING ================================================================= */
@media only screen and (max-width: 480px) and (min-width: 320px) {

div#main-content{
	background: #eeeff6!important;
}

.dash-banner{
	min-height: auto!important;
	padding-bottom: 350px!important;
}

.important-dates-img{
	display: none!important;
}

.important-dates-img-mobile{
	display: none!important;
}


.announcementcard{
	flex-direction: column-reverse!important;
}

.imgalign{
	height: 200px!important;
}

span.carousel-arrow.carousel-next {
    display: none;
}

span.carousel-arrow.carousel-previous {
    display: none;
}

  .cdot {
    top: 0px;
  }

  /*Changes the cards properties for mobile */
  .announcementcard {
    display: flex;
    flex-direction: column;
    width: 75%;
  }
  /*Aligns the image for mobile */
  .imgalign {
    width: 50px;
    height: 50px;
  }
  /* changes the image for card for mobile*/
  . img {
    width: 50px;
    height: 50px;
  }
  .date-container {
    width: 50%;
  }

  .button-wrapper {
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: space-between;
    align-items: center;
    position: absolute;
  }

  .button-wrapper {
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: space-between;
    align-items: center;
    position: absolute;
  }

  div.cell.normal {
    padding: 0px !important;
  }

  div#announcementcontainer {
    width: 100% !important;
    margin: auto;
    margin-top: -10px;
  }

  #announcements-wrapper .general-text-container {
    width: 100% !important;
  }

  p.my-title {
    text-align: left;
    padding: 0;
  }

  #announcements-wrapper .announcementcard {
    width: 100%;
    height: fit-content;
	padding: 0px;
  }

  .announcementcard .imgalign {
    width: 100%;
  }

  div.text-encompasser {
    width: fit-content !important;
    margin: auto 0 !important;
    height: fit-content;
    padding: 20px !important;
  }

  div.custom-card-container.cardstyle.largeimagewithtextbelow-autocards {
    width: 100%;
    margin: 10px 0px;
  }

  div#myCards-newsContainer {
    width: 100%;
  }

  .innerCell {
    width: 100%;
  }

  div.largeimagewithtextbelow-autocards .image-container {
    width: 100%;
  }

  .list-member-paginated-cards a {
    width: 100%;
  }

  div.custom-card-container.cardstyle.largeimagewithtextbelow-listmempag {
    width: 100%;
    margin: 10px 0px;
  }

  .largeimagewithtextbelow-listmempag .image-container {
    width: 100% !important;
    height: fit-content !important;
  }

  a.aui-button.aui-style-default.aui-dropdown2-trigger {
    display: none;
  }
/*
  .aui-button.aui-button-primary.cf_dashboardannouncementspremium {
    display: none;
  }
*/
  .columnLayout.three-equal {
    margin-top: -15px;
  }
}

</style>
HTML
<!-- DASHBOARD BANNER STYLING -->
<style>
#announcement-overlay{
	position: absolute;
   width: 100%;
    	height: 100%;
}

.dash-banner{
  height: 350px;
    width: 90vw;
    margin: auto;
    background: white;
    display: flex;
    flex-direction: column;
    position: relative;
	box-shadow: 0 0 15px 2px rgba(0 0 0 / 20%);
}


.dash-banner .important-dates{
	position: absolute;
    left: 0;
    bottom: 0;
    border-bottom: 220px solid #eceff5;
    border-right: 300px solid transparent;
    height: 0px;
    width: 50%;
}

.dash-banner .important-dates-img{
display: none;
	position: absolute;
    left: 0px;
    bottom: 0px;
    max-width: 100%;
    max-height: 200px;
    height: auto;
}

.dash-banner .important-dates-img-mobile{
	display: none;
	position: absolute;
    left: 0px;
    bottom: 0px;
    width: 100%!important;
    height: auto;
}

.dash-banner .content-head{
  font-size: 40px!important;
  color: var(--primary-color);
  font-weight: bold;
}

.dash-banner .top-content{
  display: flex;
  flex-direction: column;
  width: 70%;
  padding: 0 0 0 40px;
}

.dash-banner .top-content .smith-logo-banner {
  width: 35%;
}

.dash-banner .content-text{
  font-size: 16px!important;
  width: 100%;
  line-height: 1.75;
  color: var(--primary-color);
  margin: 20px 0;
	font-family: var(--secondary-font-family);
  opacity: .8;
}

.dash-banner .bottom-content{
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
  padding: 0 40px;
  margin-top: 10px;
}

.dash-banner .bottom-content img{
  width: 430px;
  height: 138px;
  /*margin-right: 20px;*/
  padding-top: 10em;
}

.dash-banner .bottom-content a{
  text-decoration: none;
  color: white;
  background: var(--primary-color);
  font-size: 16px;
  font-weight: normal;
  text-align: center;
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding: 0.75em 1em;

  height: 50px;
  width: 300px;
	
  box-sizing: border-box;
}

@media only screen and (max-width: 1500px) {
  .dash-banner .bottom-content img{
    padding-top: 7em;
  }
}

@media only screen and (max-width: 1370px) {
  .dash-banner .bottom-content img{
    padding-top: 3em;
  }
}


@media only screen and (max-width: 920px) and (min-width: 320px) {
  .dash-banner{ 
    background-size: cover;
	background-position: top center;
    padding: 40px 0;
  }
  
  .dash-banner .top-content{
    /*margin-left: 20px*/;
	width: 90%;
	padding: unset;
	margin: 0 auto;    
  }

  .dash-banner .content-text {
	width: 100%;
  }
  
  .dash-banner .bottom-content{
    align-items: flex-start;
/*     background: yellow; */
    margin: 0 auto;
    flex-direction: column-reverse;
    padding: 0;
	width: 90%;
  }
  
  .dash-banner .bottom-content img{
    margin-right: unset;
    margin-top: unset;
    object-fit: contain;
    width: auto;
}
  .dash-banner .bottom-content a{
    margin-bottom: 20px;    
  }
/*
  .important-dates-img {
    position: unset !important;
    left: unset !important;
    bottom:  unset !important;
    height: unset !important;
    width: 80%;
    margin: auto;
  }  */
}
</style>

<style>

div#announcements-wrapper {
    margin-top: 50px !important;
}

div#announcements-wrapper .header {
  font-size: 24px;
  font-weight: 900;
  margin-bottom: 20px;
  line-height: 1.52;
  color: var(--primary-font-color);
}

div#announcements-wrapper .card-title {
  font-size: 20px;
  line-height: 1.45;
  color: black;
}

div#announcements-wrapper .card-description {
  font-size: 16px;
  font-weight: 300;
  line-height: 1.5;
  color: black;
}
#announcements-wrapper div.text-encompasser {
    flex-direction: column;
    justify-content: center;
    width: 50%;
	z-index: 5;
    margin-left: 30px;
    background: transparent;
    height: 80%;
    margin: auto;
	box-sizing: border-box;
}


.dash-banner .content-text {
    font-size: 20px;
}


#announcements-wrapper .announcementcard {
    width: 90vw !important;
}

.dash-banner .bottom-content {
    flex-direction: column;
}

.dash-banner .bottom-content img {
    padding-top: 2em;
}

div#admin-panel a,div#admin-panel button{
    color: white!important;
}

@media only screen and (max-width: 480px) and (min-width: 320px) {
	div#admin-panel a,div#admin-panel button{
    	box-sizing: border-box!important;
		height: 45px!important;
		margin: 0 10px 0 0!important;
	}

  .dash-banner .top-content .smith-logo-banner {
	width: 100%;
  }

  .dash-banner .bottom-content img{
    width: 100%; 
    padding-top: 0;
  }

  .dash-banner .content-head{
    font-size: 22px;
  }

  .dash-banner .content-text {
	font-size: 14px;
  }

  .dash-banner .bottom-content a {
	width: 100%;
	padding: 0.75em 0;
  }

#announcement-overlay{
    	background:  var(--primary-color) ;
}

div#admin-panel {
    flex-direction: row;
    align-items: flex-start;
}

button.aui-button.aui-button-primary.cf_dashboardannouncementspremium {
    margin-bottom: 10px;
}

}


@media only screen and (max-width: 950px) and (min-width: 480px){
div#announcements-wrapper .card-title{
    font-size: 18px;
}

div#announcements-wrapper .card-desription{
    font-size: 14px;

}

button.confirmationButton{
    font-size: 10px;
}
}




.dash-banner{
	display: flex;
	flex-direction: row;
}

.banner-segment{
	width: 50%;
	height: 350px;
	box-sizing: border-box;
	overflow: hidden;
}

.second-segment{
	background: url(https://gsvlabs-confluence-files.s3.us-west-2.amazonaws.com/images/MStanley/dash-banner-img.jpg);
    background-size: cover;
    background-position: center;
}
</style>
<!-- END DASHBOARD BANNER STYLING -->
HTML
<style>
#loadingIndicatorbanner {
    position: absolute;
    left: 50%;
    margin-top: 100px;
    /*background: var(--main-background);*/
    transition-duration: .3s;
}

#iconbanner {
    border: 8px solid var(--secondary-color);
    border-top: 8px solid var(--tertiary-color);
    border-radius: 50%;
    width: 50px;
    height: 50px;
    animation: spin 1.5s linear infinite;
}

@keyframes spin {
  0% { transform: rotate(0deg); }
  100% { transform: rotate(360deg); }
}

@media only screen and (max-device-width: 480px) and (min-device-width: 320px) {
	#loadingIndicatorbanner {
		left: unset;
	}
}
</style>

<div id="loadingIndicatorbanner">
  <div id="iconbanner">
  </div>
</div>

...

classapplicationBannerStarted
HTML
<div class="dash-banner">
	<div class='banner-segment' style="padding-top: 40px;">
  <div class="top-content">
    <p class="content-head">You're almost there!</p>
    <p class="content-text">Continue your application for Lawrence Berkeley National Laboratory!</p>
  </div>
  <div class="bottom-content">
    <a href="/display/MEA">Continue My Application</a>    
  </div>
	</div><div class='banner-segment second-segment dash-banner-image'> </div>
</div>

...

classapplicationBannerNotStarted
HTML
<div class="dash-banner">
<div class='banner-segment' style="padding-top: 40px;">
  <div class="top-content">
    <p class="content-head">Welcome to the Lawrence Berkeley National Laboratory startup competition!</p>
    <p class="content-text">Click here to get started on your application.</p>
  </div>
  <div class="bottom-content">
    <a href="/display/MEA">Start Your Application</a>    
  </div>
</div><div class='banner-segment second-segment dash-banner-image'> </div>
</div>

...

classapplicationBannerSubmitted
HTML
<div class="dash-banner">
<div class='banner-segment' style="padding-top: 40px;">
  <div class="top-content">
    <p class="content-head">Thank you for submitting your application!</p>
	<p class="content-text">If you need to contact Lawrence Berkeley National Laboratory, please email <a href="mailto:lbnl@theonevalley.com" style="text-decoration: underline; color: var(--primary-color)!important;">lbnl@theonevalley.com</a>.</p>
  </div>
</div><div class='banner-segment second-segment dash-banner-image'> </div>
</div>
HTML
<!--

Show the following only to admins

-->

...

additionalFormAdminsconfluence-administrators, morganstanley-admins
closeButtonLabelCancel
formNamedashboardannouncementspremium
saveButtonLabelCreate/Save
registrationFormTitleNew Announcement

...

titletruetrue

imagetruetrue

cardLinktruetrue

descriptiontruetrue

cardButtonTexttruetrue

titleTitletexttrue

imageImageimage/*filetrue

cardLinkExternal Linkfalse[events=Event|mentor=Mentor|resources=Resource|]This link set where the button button redirects to. Used to set external links for announcements.text

descriptionDescriptionDescription must be less than 244 characters.false[events=Event|mentor=Mentor|resources=Resource|]textareatrue^.{1,250}

linkStyleLink Style (IGNORE)text

cardButtonTextButton TextText that displays on button. This is the button that will take user to external link set above.texttrue

!cardLink:[empty]Reset valuecardLink

!cardLink:[empty]linkStyle=inactivelinkSet valuetruecardLink



 HTML
<script>
window.addEventListener("load", showDynamicApplicationBanner(AJS.params.pageTitle.toLowerCase(), 'LBNL Issue Type'), false);
</script>

 Divbox
classapplicationBannerSubmitted

 HTML
<div class="dash-banner">
  <div class='banner-segment' style="display: flex; flex-direction: column; justify-content: center;">
    <div class="top-content">
      <p class="content-head">Thank you for submitting your application for the Innovation Awards.</p>
      <p class="content-text">We will update you as to the status of your application by January 2023.</p>
    </div>
    <div class="bottom-content">
      <a href="/display/MSIAP">View your Application</a>    
    </div>
  </div>
  <div class='banner-segment second-segment dash-banner-image'> </div>
</div>



 Divbox
classapplicationBannerStarted

 HTML
<div class="dash-banner">
	<div class='banner-segment' style="display: flex; flex-direction: column; justify-content: center;">
      <div class="top-content">
        <p class="content-head">You're almost there!</p>
        <p class="content-text">Continue your application for the Morgan Stanley Innovation Awards.</p>
      </div>
      <div class="bottom-content">
        <a href="/display/MSIAP">Continue your Application</a>    
      </div>
	</div>
    <div class='banner-segment second-segment dash-banner-image'> </div>
</div>


 Divbox
classapplicationBannerNotStarted

 HTML
<div class="dash-banner">
<div class='banner-segment' style="display: flex; flex-direction: column; justify-content: center;">
  <div class="top-content">
    <p class="content-head">The Innovation Awards Application is Now Open</p>
    <p class="content-text">Click below get started.</p>
  </div>
  <div class="bottom-content">
    <a href="/display/MSIAP">Apply Now</a>
  </div>
</div><div class='banner-segment second-segment dash-banner-image'> </div>
</div>


 HTML
<!-- Start id=announcementcontainer section -->

 HTML
<!-- Start admin section -->

 ConfiForms Form Definition
additionalFormAdminsconfluence-administrators, morganstanley-admins,mssba-admins
closeButtonLabelCancel
formNamedashboardannouncementspremium
saveButtonLabelCreate/Save
registrationFormTitleNew Announcement

Create/SavedashboardannouncementspremiumCancelconfluence-administrators,morganstanley-admins,mssba-adminsNew AnnouncementINLINE
titletruetrue
imagetruetrue
cardLinktruetrue
descriptiontruetrue
cardButtonTexttruetrue
titleTitletexttrue
imageImageimage/*filetrue
cardLinkExternal Linkfalse[events=Event|mentor=Mentor|resources=Resource|]This link set where the button button redirects to. Used to set external links for announcements.text
descriptionDescriptionDescription must be less than 244 characters.false[events=Event|mentor=Mentor|resources=Resource|]textareatrue
linkStyleLink Style (IGNORE)text
cardButtonTextButton TextText that displays on button. This is the button that will take user to external link set above.texttrue
!cardLink:[empty]Reset valuecardLink
!cardLink:[empty]linkStyle=inactivelinkSet valuetruecardLink



 HTML
<!-- End admin section -->

 HTML
<!-- End id=announcementcontainer section -->

 HTML
<div>
<p class="header">About the Alliance for Children’s Mental Health</p>
</div>

 HTML
<div style="width: 100%; height: 400px; display: flex; background: white;  box-shadow: 0 4px 10px 5px rgba(0, 0, 0, 0.1);">
	<div style="box-sizing: border-box; display: flex; flex-direction: column; align-items: flex-start; justify-content: center; width: 100%; padding: 40px;">
		<p style="margin-bottom: 20px; color: #187aba; font-size: 20px;">The Morgan Stanley Alliance for Children’s Mental Health combines the resources and reach of Morgan Stanley with the knowledge and experience of our distinguished nonprofit member organizations to help deliver positive, tangible impact on the critical challenges of stress, anxiety and depression in children, adolescents and young people.</p>
		<button class="aui-button aui-button-primary" style="width: 280px; height: 50px; font-size: 16px; border-radius: 5px; font-weight: normal;" onclick="window.open('https://www.morganstanley.com/about-us/giving-back/alliance-childrens-mental-health')">LEARN MORE ABOUT THE ALLIANCE</button>
	</div>
 	<img style="box-sizing: border-box; width: 50%; object-fit: contain; padding: 0 5%;" src="https://gsvlabs-confluence-files.s3.us-west-2.amazonaws.com/images/MSIA/childrens_health_announcement.png"/>
</div>

 HTML
</div>

<script>
var checkExist = setInterval(function() {
   if ($('.topic-select-group label').length) {  
$('.topic-select-group label')[0].innerHTML =`Topic:<sup data-v-62c157d1="" class="fullSite">*</sup>`
      clearInterval(checkExist);
   }
}, 100);

/*
window.onload = function(){
	$('.editor')[0].append($('.microblog-header-container')[0]);
};
*/

</script>

 HTML
<script>
$( ".announcementcard a" ).each(function( index ) {
  console.log( index + ": " + $( this ).attr("href") );
  if($( this ).attr("href").includes("//h")){
    $( this ).attr("href", $( this ).attr("href").replace("//http", "http"))
  }
});
</script>

 HTML
<style>
.benefits-container a {
	text-decoration: unset;
	margin: 0px;
    background: none;
    color: var(--primary-color) !important;
    padding: 0px;
}
.benefits-container a:hover {
	text-decoration: underline;
}
</style>

 HTML
<style>
@media only screen and (max-width: 580px) {
	div.dates-container {
		width: 100% !important;
	}
	#key-dates-headertext {
		text-align: left;
	}
}

 HTML
<div id="admin-panel">


<a href="#cf_messages" id="toggle-admin-table">Manage Announcements</a>

</div>

<script>
$( "#toggle-admin-table" ).click(function() {
  if($('.announcementsTable').is(":visible")){
        $('.announcementsTable').hide()
    }
    else{
    $('.announcementsTable').show()
}
});

let adminPanel = document.getElementById('admin-panel')
let addAnouncement = $('button.aui-button.aui-button-primary.cf_dashboardannouncementspremium')[0]
adminPanel.insertAdjacentElement('afterbegin',addAnouncement)
</script>
...
classannouncementsTable
...
stylez-index:13; background:none; border:none; padding:0; 
...
pagerNO LIMIT
formNamedashboardannouncementspremium
enableGridEdittrue
...
 HTML
<!--

End Admin section

-->
 HTML
<style>
.table-wrap p {
    color: white;
    text-align: left;
    font-size: 14px;
}

.table-wrap span {
    margin-bottom: 15px;
}

input#i_image {
    margin-top: 10px;
}

.carousel-container {
    display: flex;
    align-items: center;
}

span.carousel-arrow.carousel-next {
    margin-left: 5px;
    }

span.carousel-arrow.carousel-previous {
    margin-right: 5px;
}

.arrow-right {
    width: 0;
    height: 0;
    border-top: 25px solid transparent;
    border-bottom: 25px solid transparent;
    border-left: 25px solid white;
    z-index: 12;
    margin: 25px 0 0 -24px;
    transform: rotate(180deg);
}

</style>

<h1 class="header"> Announcements </h1>
<div class="carousel-container"> 
<span class="carousel-arrow carousel-previous">◀</span>
...
formNamedashboardannouncementspremium
sortcreated DESC
 HTML
<span class="carousel-arrow carousel-next">▶</span>
</div>
<script>
let anouncementNo = document.getElementsByClassName("announcementcard").length
if(anouncementNo < 2){
	$('.carousel-next').hide()
	$('.carousel-previous').hide()
}

$('.carousel-previous').click(function() {
if(slideIndex -1 === 0){
        currentSlide(anouncementNo)
    }
    else{
    currentSlide(slideIndex - 1)    
}  

});

$('.carousel-next').click(function() {
  if(slideIndex + 1 > anouncementNo){
        currentSlide(1)
    }
    else{
    currentSlide(slideIndex + 1)    
}
});
let div = document.getElementsByClassName('carousel-container')[0]
div.addEventListener('touchstart', handleTouchStart, false); 
div.addEventListener('touchmove', handleTouchMove, false);

var xDown = null; 
var yDown = null;

function getTouches(evt) {
return evt.touches || // browser API
evt.originalEvent.touches; // jQuery
} 

function handleTouchStart(evt) {
console.log('touched')
const firstTouch = getTouches(evt)[0]; 
xDown = firstTouch.clientX; 
yDown = firstTouch.clientY; 
}; 

function handleTouchMove(evt) {
if ( ! xDown || ! yDown ) {
return;
}

var xUp = evt.touches[0].clientX; 
var yUp = evt.touches[0].clientY;

var xDiff = xDown - xUp;
var yDiff = yDown - yUp;

if ( Math.abs( xDiff ) > Math.abs( yDiff ) ) {/*most significant*/
if ( xDiff > 0 ) {
/* left swipe */ 
console.log('swiped left')
if(slideIndex + 1 > anouncementNo){
currentSlide(1)
}
else{
currentSlide(slideIndex + 1) 
}
} else {
/* right swipe */
console.log('swiped right')
if(slideIndex -1 === 0){
currentSlide(anouncementNo)
}
else{
currentSlide(slideIndex - 1) 
} 
} 
} else {
if ( yDiff > 0 ) {
/* up swipe */ 
console.log('swiped up')
} else { 
/* down swipe */
console.log('swiped down')
} 
}
/* reset values */
xDown = null;
yDown = null; 
};</script>
 HTML
<!--

Old carousel macro here

-->
 HTML
<div>
<p class="headertext" style="color: black; padding: 0px;"><strong>About</strong>
 </p>
</div>
 HTML
<style>
.headertext {
  font-size: 24px;
  font-weight: 300;
  margin-bottom: 20px;
  line-height: 1.52;
  color: var(--primary-color);
  padding: 25px 40px;
}

.headertextalt {
  font-size: 24px;
  font-weight: 300;
  margin-bottom: 20px;
  line-height: 1.52;
  color: var(--primary-color);
  padding: 0px 40px;
}

.stat {
  text-align: center;
}

#dates {
  background-color: var(--primary-color);
  flex-direction: column;
  height: 350px;
}

</style>
 HTML
<style>
a.button-panel-link.button-panel-cancel-link {
    color: var(--secondary-color) !important;
}

span#cf_messages a[title="Delete"] {
    color: var(--secondary-color);
}


.aui-message.aui-message-info {
    border-color: var(--secondary-color);
}


button.aui-button.aui-button-primary.cf_dashboardannouncementspremium {
  background: var(--secondary-color) !important;
  color: var(--primary-font-color) !important;
}

div#announcementcontainer {
  width: 90% !important;
  margin: 40px auto 0 auto;
}

div#announcements-wrapper {
  width: 100% !important;
  margin-top: 10px !important;
}

a.button-panel-link.button-panel-cancel-link {
  color: black !important;
}

a.aui-button.aui-style-default.aui-dropdown2-trigger {
  display: none;
}
</style >

<style>
div#forum-container {
  width: 90%;
  margin: auto;
  margin-bottom: 60px;
}

div#forum-top-bar .header {
  font-size: 24px;
  font-weight: 900;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.52;
  letter-spacing: normal;
  color: var(--primary-font-color);
}

div#forum-top-bar {
  display: flex;
  justify-content: space-between;
}

.filter-btns {
  display: flex;
  align-items: center;
}

a.aui-nav-item {
  color: var(--primary-font-color) !important;
}

div#main-content {
  /*background: url(https://gsvlabs-confluence-files.s3-us-west-2.amazonaws.com/images/SeaAhead/seaaheadDashboardBackground.png);*/
  background: url(https://gsvlabs-confluence-files.s3-us-west-2.amazonaws.com/images/SeaAhead/seaahead_dashboard.svg);
  background-size: cover;
  background-position: bottom;
  padding-top: 40px;
}

button.aui-button.aui-button-primary.fullSite {
}

button.aui-button.aui-button-primary {
  background: var(--secondary-color);
  border-radius: unset;
}

button.aui-button.aui-button-link {
  color: var(--secondary-color);
}

.action-group.topic-select-container label {
  color: var(--secondary-color);
}

.globalTimeline-container {
  background: white;
  margin-top: 20px;
}

span.micropost-topic {
  display: none;
}

span.micropost-author a {
  color: var(--secondary-color) !important;
  font-size: 18px;
  font-weight: 900;
  font-stretch: normal;
  font-style: normal;
  line-height: 2.17;
  letter-spacing: 0.54px;
}

.micropost-profile-picture.aui-avatar-inner {
  border-radius: unset;
}

.aui-avatar.aui-avatar-large {
  display: flex;
}

.micropost-profile-picture.aui-avatar-inner {
  height: 118px;
  width: 80px;
  max-width: unset;
  max-height: unset;
}

.micropost-left {
  display: flex;
  padding: unset;
  width: auto;
}

.aui-avatar.aui-avatar-large {
  display: unset;
}

a.userLogoLink {
  margin: unset;
  margin: 0 30px 0 20px;
}

span.microblog-tooltip {
  opacity: 0.71;
  font-size: 12px;
  line-height: 1.92;
  color: var(--primary-font-color);
}

.micropost-content p {
  font-size: 12px;
  line-height: 1.42;
  color: #0c0c0c;
}

ul.micropost-meta a {
  color: var(--secondary-color) !important;
}

.micropost .micropost-right .micropost-footer {
  justify-content: flex-end;
  padding-right: 30px;
}

span.aui-icon.aui-icon-small.aui-iconfont-more {
  color: var(--secondary-color);
}

.aui-avatar.aui-avatar-large,
.aui-avatar.aui-avatar-large .aui-avatar-inner {
  height: unset !important;
  max-width: unset !important;
  max-height: unset !important;
  width: unset !important;
}

.aui-avatar img {
  height: unset;
  width: 91px;
}

button.confirmationButton {
/*  width: 134px;
  height: 47px; */
  text-decoration: none;
  color: white;
  background: #ee3e62;
  font-size: 16px;
  font-weight: 700;
  border: unset;
  margin-top: 50px;
  cursor:pointer;
  padding: 0.75em 2em;
}
.selection-title {
    display: none;
}

.microblog-content-container .editor {
    margin-top: 20px;
}

a.userLogoLink.userlink-1 {
    pointer-events: none;
}

a.url.fn.confluence-userlink.userlink-1 {}

.micropost-author a {
    pointer-events: none;
}

ul.micropost-meta .micropost-saveDate a {
    pointer-events: none;
}


.wiki-content table.tablesorter>thead>tr>th {
    background: var(--secondary-color) center right no-repeat !important;
}

.microblog-topic-select-dropdown .select2-results li.select2-result-with-children > .select2-result-label {

	display: none;
}

.action-container {
    display: none;
}

.micropost .reply-editor .profile-picture {
    display: none;
}

.micropost-profile-picture.aui-avatar-inner {
    display: none;
}

.aui-button.active, .aui-button-subtle.aui-button.active {
    background: unset;
}

a.copy-micropost-permalink-action {
    display: none;
}

section#subscription-dialog a {
    color: var(--secondary-color);
}

.aui-message.warning, .aui-message-warning {
    border-color: var(--secondary-color);
}

section#subscription-dialog .aui-dialog2-footer-hint {
    display: none;
}


@media only screen and (max-width: 480px) and (min-width: 320px) {
  .micropost-right {
	width: 80%;
	padding: 0 20px;
  }
}

@media only screen and (min-device-width : 320px) and (max-device-width : 480px) {
a#toggle-admin-table {
    margin-top: 10px;
}

  #cf_messages {
	height: auto;
    width: inherit;
    position: relative;
    overflow: hidden;
    margin: 0 auto;
  }

    button.aui-button.aui-style-default.aui-dropdown2-trigger.aui-dropdown2-trigger-arrowless {
        opacity: unset !important;
        margin-right: 20px;
    }

.aui-dialog2-large.aui-layer {
    display:none;
}

button.aui-button.aui-button-subtle[data-dialog-id="subscription"] {
display: none;
}

a.aui-nav-item.space[original-title="SMITH Dashboard"] {
    display: none;
}

span.mb-icon.mb-icon-bullet-list.nav-trigger-icon {
    color: var(--secondary-color);
}



span[original-title="SMITH Dashboard"] {
    color: transparent;
}
.selection-title {
    display: block;
}

div#admin-panel {
    align-items : flex-start;
}

div#announcementcontainer{
	margin: 20px auto 0 auto;
}

}
</style>


 HTML
</div>

<style>
/* Disable suggestions on mention */
.suggestion-list {
    display: none;
}

 
.micropost .micropost-right ul.micropost-meta li.micropost-action-reply {
    display: none;
}

.globaltimeline .microBlogContainer .microblog-sidebar-container{
	background: #d5dbe6;
}

.editor{
	display: flex;
	flex-direction: row;
	justify-content: space-between;
}

.globaltimeline .microBlogContainer .microblog-content-container{
	background: white;
	padding: 20px!important;
	box-sizing: border-box;
}

.show-sidebar .microblog-header-container{
	padding: 0!important;
	display: none!important;
}

div#microBlogContainer > * {
    font-family: var(--main-font-family);
}

.aui-button.aui-button-primary, .aui-button.aui-button-primary:visited{
	background: var(--primary-color)!important;
}

.aui-button.aui-button-primary[disabled], .aui-button.aui-button-primary[disabled]:hover, .aui-button.aui-button-primary[disabled]:focus, .aui-button.aui-button-primary[disabled]:active, .aui-button.aui-button-primary[aria-disabled="true"], .aui-button.aui-button-primary[aria-disabled="true"]:hover, .aui-button.aui-button-primary[aria-disabled="true"]:focus, .aui-button.aui-button-primary[aria-disabled="true"]:active{
	color: white!important;
	background: gray!important;
}

</style>

<script>
var checkExist = setInterval(function() {
   if ($('.topic-select-group label').length) {  
$('.topic-select-group label')[0].innerHTML =`Topic:<sup data-v-62c157d1="" class="fullSite">*</sup>`
      clearInterval(checkExist);
   }
}, 100);

/*
window.onload = function(){
	$('.editor')[0].append($('.microblog-header-container')[0]);
};
*/

</script>
 HTML
<script>
$( ".announcementcard a" ).each(function( index ) {
  console.log( index + ": " + $( this ).attr("href") );
  if($( this ).attr("href").includes("//h")){
    $( this ).attr("href", $( this ).attr("href").replace("//http", "http"))
  }
});
</script>
 HTML
<script>
/*
window.onload = function(){
	var navListItems = AJS.$('ul.rw_category_items li');
    var htmlText = '';
    for (var i = 0; i < navListItems.length; i++) {
      var currNavListItem = navListItems[i];
      var linkHref = currNavListItem.children[0].href;
	  var linkText = currNavListItem.children[0].children[0].innerText;

      if (linkText !== 'Profile') {
        htmlText += "<li class='mobile-menu-item'><a class='mobile-menu-item-link' href='" + linkHref +
          "'><span class='mobile-menu-name'>" + linkText + "</span></a></li>"
      }
      console.log(linkHref, linkText);
    }
    document.getElementById('custom-mobile-menu').innerHTML = htmlText;

	var logoImgLink = AJS.$('#rw_logo_container')[0].children[0].href;
    console.log('logo', AJS.$('#rw_logo_container'))
    var logoImg = AJS.$('#rw_logo_container')[0].children[0].children[0].src;
    if (RW._siteId == "38") {
      logoImg = "/download/attachments/27859313/PassportForKSU.png?api=v2"
    }
    document.getElementById('mobile-menu-logo-container').innerHTML = "<a href='" + logoImgLink + "'><img src='" +
      logoImg + "'/></a>";
    document.getElementById('mobile-menu-logo-container').style.opacity = '1';
    document.getElementById('mobile-menu-logo-container').style.visibility = 'visible';

	document.getElementById('toggle-admin-table').href = "javascript:";
}
*/
</script>
 HTML
<style>
/* new stuff */
span.conf-macro.output-inline {
    width: 100%;
}
div.dates-container {
    width: 80% !important;
    margin-left: auto;
} </style>