Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Project header changes #1013

Merged
merged 12 commits into from
Feb 1, 2021
2 changes: 1 addition & 1 deletion funnel/assets/js/project.js
Original file line number Diff line number Diff line change
Expand Up @@ -84,7 +84,7 @@ const Ticketing = {
},

initTicketModal() {
$('.open-ticket-widget').click((event) => {
$('.js-open-ticket-widget').click((event) => {
event.preventDefault();
this.openTicketModal();
});
Expand Down
23 changes: 0 additions & 23 deletions funnel/assets/js/util.js
Original file line number Diff line number Diff line change
Expand Up @@ -425,29 +425,6 @@ export const ScrollActiveMenu = {
}
});
this.activeNavItem = '';

if (document.getElementById('ticket-wrapper')) {
const observer = new IntersectionObserver(
(entries) => {
entries.forEach((entry) => {
if (
!entry.isIntersecting &&
entry.intersectionRatio > 0.5 &&
entry.boundingClientRect.y < 0
) {
$('#ticket-btn').addClass('sub-navbar__item--fixed');
} else if (entry.isIntersecting && entry.intersectionRatio === 1) {
$('#ticket-btn').removeClass('sub-navbar__item--fixed');
}
});
},
{
rootMargin: '0px',
threshold: 1,
}
);
observer.observe(document.getElementById('ticket-wrapper'));
}
},

handleObserver(entries) {
Expand Down
161 changes: 106 additions & 55 deletions funnel/static/css/app.css
Original file line number Diff line number Diff line change
Expand Up @@ -938,8 +938,8 @@ a.loginbutton.hidden,
}

.mui-dropdown__menu--hg-link {
max-width: 105px;
min-width: 105px;
max-width: 125px;
min-width: 125px;
z-index: 1003;
overflow: hidden;
margin-top: 0;
Expand Down Expand Up @@ -1684,7 +1684,7 @@ a.loginbutton.hidden,
position: sticky;
top: 50px;
order: 1;
z-index: 2;
z-index: 6;
}

.sub-navbar {
Expand Down Expand Up @@ -3247,7 +3247,7 @@ a.loginbutton.hidden,
.card--upcoming .card__body .card__body__bookmark {
position: absolute;
right: 16px;
top: 18px;
top: 16px;
z-index: 4;
line-height: 1;
}
Expand Down Expand Up @@ -3469,8 +3469,97 @@ a.loginbutton.hidden,
border-bottom: 1px solid rgba(121, 129, 139, 0.48);
}

.project-header {
display: flex;
align-items: center;
margin: 0;
}
.project-header .project-links,
.project-header .hg-link-btn {
padding-right: 16px;
}
.project-header .settings {
padding-left: 16px;
}
.project-header .hg-link-btn.hide {
display: none;
}
.project-header .mui-btn--nostyle + .mui-btn--nostyle {
margin: 0;
}

.register-block {
display: flex;
align-items: center;
justify-content: space-between;
}
.register-block .register-block__txt {
margin: 0 16px 0 0;
}
.register-block .register-block__txt--small {
max-width: calc(100% - 140px);
}
.register-block .register-block__txt--smaller {
max-width: calc(100% - 170px);
}
.register-block .register-block__right {
text-align: right;
}
.register-block .register-block__right__menu {
margin-left: 8px;
}

.project-footer {
position: fixed;
width: calc(100% - 32px);
bottom: 0;
padding: 16px;
box-shadow: 0 0 4px 0 rgba(0, 0, 0, 0.1);
background-color: #ffffff;
z-index: 1000;
}
.project-footer .mui-dropdown__menu {
top: -66px !important;
border-radius: 16px 16px 0px;
}

@media (min-width: 768px) {
.project-footer {
display: none;
}
}
.sub-navbar-container__inner .desktop-navbar-items {
display: none;
}

@media (min-width: 768px) {
.sub-navbar-container__inner {
display: flex;
justify-content: space-between;
align-items: center;
}
.sub-navbar-container__inner .sub-navbar {
max-width: calc(100% - 480px);
margin-left: 0;
}
.sub-navbar-container__inner .desktop-navbar-items {
display: flex;
min-width: 450px;
justify-content: flex-end;
align-items: center;
padding: 0 16px;
}
.sub-navbar-container__inner .desktop-navbar-items .project-header {
margin: 0 16px 0 0;
}
}
@media (min-width: 768px) {
.sub-navbar-container__inner .desktop-navbar-items {
justify-content: flex-end;
}
}
.project-banner {
margin-top: 16px;
padding-top: 80px;
}
.project-banner .project-banner__profile-details {
display: flex;
Expand Down Expand Up @@ -3542,40 +3631,15 @@ a.loginbutton.hidden,
margin: 0;
display: block;
}
.project-banner .project-banner__footer {
display: flex;
align-items: baseline;
margin: 16px 0 0;
padding: 0 16px;
}
.project-banner .project-banner__footer .bookmark {
padding-right: 8px;
}
.project-banner .project-banner__footer .bookmark a {
text-decoration: none !important;
}
.project-banner .project-banner__footer .hg-link-btn.hide {
display: none;
}
.project-banner .project-banner__footer .bookmark .txt,
.project-banner .project-banner__footer .bookmark .login-txt {
position: relative;
top: -2px;
}
.project-banner .project-banner__footer .bookmark .animate-btn {
height: 20px;
}
.project-banner .project-banner__footer .bookmark .animate-btn--animate {
-webkit-animation: none;
animation: none;
}
.project-banner .project-banner__footer .mui-btn--nostyle + .mui-btn--nostyle {
margin: 0;
}
.project-banner .project-details__box {
margin-top: 16px;
position: relative;
}
.project-banner .project-details__box .bookmark {
position: absolute;
right: 14px;
z-index: 3;
}
.project-banner .project-details__box .card__calendar {
padding: 0 16px 10px;
margin: 0 0 25px;
Expand Down Expand Up @@ -3639,14 +3703,15 @@ a.loginbutton.hidden,
.project-banner .project-details__box .propose .propose-btn--strike:hover {
text-decoration: line-through;
}
.project-banner .project-details__box--ticketbox {
.project-banner .project-details__box__content {
min-height: 22px;
margin-bottom: 16px;
}
.project-banner .project-details__box--ticketbox .check-icon {
margin-right: 8px;
}

@media (min-width: 768px) {
.project-banner {
padding-top: 35px;
}
.project-banner .project-banner__box {
padding: 0 16px;
}
Expand All @@ -3656,15 +3721,6 @@ a.loginbutton.hidden,
.project-banner .project-banner__box .project-banner__box__add-btn--second {
right: 60px;
}
.project-banner .project-banner__footer {
padding: 0;
justify-content: unset;
}
.project-banner .project-banner__footer .bookmark,
.project-banner .project-banner__footer .project-links,
.project-banner .project-banner__footer .hg-link-btn {
padding-right: 24px !important;
}
.project-banner .project-details__box .propose .propose__txt {
font-size: 14px;
}
Expand Down Expand Up @@ -3718,7 +3774,7 @@ a.loginbutton.hidden,
.project-banner .project-details__box--topmargin {
margin-top: 42px;
}
.project-banner .project-details__box--ticketbox {
.project-banner .project-details__box__content {
margin-bottom: 0;
}
}
Expand Down Expand Up @@ -3782,7 +3838,7 @@ a.loginbutton.hidden,
@media (min-width: 768px) {
.pinned {
position: sticky;
top: 56px;
top: 128px;
display: block;
}
}
Expand Down Expand Up @@ -5451,11 +5507,6 @@ body > .proposal-box.ui-draggable {
}
}
@media (min-width: 768px) {
.pinned {
top: 110px;
margin-bottom: -10px;
}

.update {
padding: 32px 16px;
margin-bottom: 16px;
Expand Down
2 changes: 1 addition & 1 deletion funnel/static/sass/_card.scss
Original file line number Diff line number Diff line change
Expand Up @@ -473,7 +473,7 @@
.card__body__bookmark {
position: absolute;
right: $mui-grid-padding;
top: 18px;
top: $mui-grid-padding;
z-index: 4;
line-height: 1;
}
Expand Down
2 changes: 1 addition & 1 deletion funnel/static/sass/_header.scss
Original file line number Diff line number Diff line change
Expand Up @@ -519,7 +519,7 @@
position: sticky;
top: 50px;
order: 1;
z-index: 2;
z-index: 6;
}

.sub-navbar {
Expand Down
4 changes: 2 additions & 2 deletions funnel/static/sass/_layout.scss
Original file line number Diff line number Diff line change
Expand Up @@ -1016,8 +1016,8 @@ a.loginbutton.hidden,
}

.mui-dropdown__menu--hg-link {
max-width: 105px;
min-width: 105px;
max-width: 125px;
min-width: 125px;
z-index: 1003;
overflow: hidden;
margin-top: 0;
Expand Down
Loading