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.

Sign up for GitHub

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

SAV/First UI customization - header, footer, icons #771

Merged
merged 4 commits into from
Jan 14, 2025
Merged

SAV/First UI customization - header, footer, icons #771

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
4 commits
Select commit Hold shift + click to select a range
b545b9f
First ui customization - header, footer, icons
milanmajchrak Jan 14, 2025
4dd45a8
Fixed linting
milanmajchrak Jan 14, 2025
05177bf
Updated login test following the updated login
milanmajchrak Jan 14, 2025
6ba0041
Do not try to close discojuice in the integration tests when it is no…
milanmajchrak Jan 14, 2025
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
4 changes: 2 additions & 2 deletions cypress/e2e/tombstone.cy.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -62,8 +62,8 @@ describe('Admin Tombstone Page', () => {
beforeEach(() => {
cy.visit('/login');
// Cancel discojuice login - only if it is popped up
cy.wait(500);
cy.get('.discojuice_close').should('exist').click();
// cy.wait(500);
// cy.get('.discojuice_close').should('exist').click();
// Login as admin
cy.loginViaForm(TEST_ADMIN_USER, TEST_ADMIN_PASSWORD);
cy.visit('/');
Expand Down
4 changes: 2 additions & 2 deletions cypress/support/commands.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -118,8 +118,8 @@ Cypress.Commands.add('login', login);
* @param password password to login as
*/
function loginViaForm(email: string, password: string): void {
cy.wait(500);
cy.get('.discojuice_close').should('exist').click();
// cy.wait(500);
// cy.get('.discojuice_close').should('exist').click();
// Enter email
cy.get('ds-log-in [data-test="email"]').type(email);
// Enter password
Expand Down
2 changes: 1 addition & 1 deletion src/app/admin/admin-sidebar/admin-sidebar.component.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -14,7 +14,7 @@
<div class="sidebar-section">
<div href="javascript:void(0);" class="nav-item d-flex flex-row flex-nowrap py-0">
<div class="shortcut-icon navbar-brand logo-wrapper">
<img class="admin-logo" src="assets/images/dspace-logo-mini.svg"
<img class="admin-logo" src="assets/images/sav-navbar-logo.png"
[alt]="('menu.header.image.logo') | translate">
</div>
<div class="sidebar-collapsible navbar-brand">
Expand Down
179 changes: 81 additions & 98 deletions src/app/footer/footer.component.html
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,103 +1,86 @@
<footer class="text-lg-start">
<div class="lindat-common2 lindat-common-footer">
<footer data-version="3.0.5" data-build="05eff1186f12528f221a63b021c7b7dc81301429">
<div id="about-lindat">
<h4><a href="https://lindat.cz/sites/default/files/2021-01/lindat_clariah_flyer.pdf">LINDAT/CLARIAH-CZ</a></h4>
<ul>
<li><a href="https://lindat.cz/files/mission-en.pdf">Mission Statement</a></li>
<li><a href="https://lindat.cz/ab">Advisory Board</a></li>
<li><a href="https://lindat.cz/events">Events</a></li>
<li><a href="https://www.clarin.eu/">CLARIN Participation</a></li>
<li><a href="https://www.dariah.eu/">DARIAH Participation</a></li>
<br/>
<li><a href="https://lindat.cz/faq-repository">FAQ</a></li>
<li><a href="mailto:[email protected]">Helpdesk</a></li>
<li><a href="https://lindat.cz/user_feedback">User Feedback Form</a></li>
<br/>
<li><a href="https://ufal.mff.cuni.cz/grants/lindatclariah-cz/en">Hosting Institution</a></li>
<li><a href="https://lindat.cz/acknowledgement">Acknowledge LINDAT/CLARIAH-CZ</a></li>
</ul>
</div>
<div id="about-partners">
<h4><a href="https://lindat.cz/partners">Partners</a></h4>
<ul>
<li>Charles University
<ul>
<li><a href="https://lindat.cz/partners/mff-uk">Faculty <i>of</i> Mathematics <i>and</i> Physics</a></li>
<li><a href="https://lindat.cz/partners/ff-uk">Faculty <i>of</i> Arts</a></li>
</ul>
</li>
<li>Masaryk University
<ul>
<li><a href="https://lindat.cz/partners/ff-mu">Faculty <i>of</i> Arts</a></li>
<li><a href="https://lindat.cz/partners/fi-mu">Faculty <i>of</i> Informatics</a></li>
</ul>
</li>
<li>University of West Bohemia
<ul>
<li><a href="https://lindat.cz/partners/zcu">Faculty <i>of</i> Applied Sciences</a></li>
</ul>
</li>
<li>Terezín
<ul>
<li><a href="https://lindat.cz/partners/iti">Terezín Initiative Institute</a></li>
<li><a href="https://lindat.cz/partners/pt">Terezín Memorial</a></li>
</ul>
</li>
<li>Czech Academy of Sciences
<ul>
<li><a href="https://lindat.cz/partners/ujc">Czech Language Institute</a></li>
<li><a href="https://lindat.cz/partners/knav">Library <i>of</i> Academy</a></li>
<li><a href="https://lindat.cz/partners/hu">Institute <i>of</i> History</a></li>
<li><a href="https://lindat.cz/partners/flu">Institute <i>of</i> Philosophy</a></li>
<li><a href="https://lindat.cz/partners/mua">Masaryk Institute <i>and</i> Archives</a></li>
</ul>
</li>
<li>Archives, Libraries and Galleries
<ul>
<li><a href="https://lindat.cz/partners/nk">National Library <i>of the Czech Republic</i></a></li>
<li><a href="https://lindat.cz/partners/mzk">Moravian Library <i>in Brno</i></a></li>
<li><a href="https://lindat.cz/partners/ng">National Gallery Prague</a></li>
<li><a href="https://lindat.cz/partners/nfa">National Film Archive</a></li>
<li><a href="https://lindat.cz/partners/na">National Archives</a></li>
</ul>
</li>
</ul>
</div>
<div id="about-website">
<h4><a href="https://lindat.cz/services">Services</a></h4>
<ul>
<li><a href="https://lindat.mff.cuni.cz/en/monitoring">Service Status</a></li>
<li><a href="https://lindat.mff.cuni.cz/repository/static/about">About and Policies</a></li>
<li><a href="https://lindat.mff.cuni.cz/en/terms-of-use">Terms of Use</a></li>
</ul>
</div>
<div id="badges-a">
<a href="https://www.clarin.eu/content/certified-centres"><img src="./assets/images/footer/b-centre.png" alt="CLARIN CENTRE B" /></a>
<a href="https://www.clarin.eu/content/knowledge-centres"><img src="./assets/images/footer/k-centre.png" alt="CLARIN CENTRE K" style="filter:brightness(0.88)" /></a>
<a href="https://www.coretrustseal.org/wp-content/uploads/2019/08/LINDAT-CLARIN.pdf"><img src="./assets/images/footer/core-trust-seal-mono.png" alt="CoreTrustSeal Certification" /></a>
</div>
<div id="badges-b">
<a href="https://twitter.com/lindatclariahcz">Follow us on Twitter <img src="./assets/images/footer/twitter-circular.svg" alt="Link to Profile" /></a>
<a href="https://lindat.cz/user/login"><img src="./assets/images/footer/LINDAT-CLARIAH-cz-gray_0.svg" alt="Home Page" /></a>
</div>
<div id="ack-msmt">
THE LINDAT/CLARIAH-CZ PROJECT (LM2018101; formerly LM2010013, LM2015071) IS FULLY SUPPORTED BY THE MINISTRY OF EDUCATION, SPORTS AND YOUTH OF THE CZECH REPUBLIC UNDER THE&#160;PROGRAMME LM OF "LARGE INFRASTRUCTURES"
<div *ngIf="showTopFooter" class="top-footer">
<!-- Grid container -->
<div class=" container p-4">
<!--Grid row-->
<div class="row">

<!--Grid column-->
<div class="col-lg-4 col-md-6 mb-4 mb-lg-0">
<h5 class="text-uppercase">Footer Content</h5>

<ul class="list-unstyled mb-0">
<li>
<a routerLink="./" class="">Lorem ipsum</a>
</li>
<li>
<a routerLink="./" class="">Ut facilisis</a>
</li>
<li>
<a routerLink="./" class="">Aenean sit</a>
</li>
</ul>
</div>
<!--Grid column-->

<!--Grid column-->
<div class="col-lg-4 col-md-6 mb-4 mb-lg-0">
<h5 class="text-uppercase">Footer Content</h5>

<ul class="list-unstyled mb-0">
<li>
<a routerLink="./" class="">Suspendisse potenti</a>
</li>
</ul>
</div>
<!--Grid column-->

<!--Grid column-->
<div class="col-lg-4 col-md-12 mb-4 mb-md-0">
<h5 class="text-uppercase">Footer Content</h5>

<p>
Lorem ipsum dolor sit amet consectetur, adipisicing elit. Iste atque ea quis
molestias. Fugiat pariatur maxime quis culpa corporis vitae repudiandae aliquam
voluptatem veniam, est atque cumque eum delectus sint!
</p>
</div>
<!--Grid column-->
</div>
<div id="ack-freepik">Icons © Smashicons and Freepik from flaticon.com licensed by <a href="https://creativecommons.org/licenses/by/3.0/">CC 3.0 BY</a></div>
<div id="ack-ufal">website © 2024 by <a href="https://ufal.mff.cuni.cz/">ÚFAL</a></div>
<script type="text/javascript">
//<![CDATA[
(function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
(i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
})(window,document,'script','//www.google-analytics.com/analytics.js','ga');
<!--Grid row-->
</div>
</div>
<!-- Grid container -->

// main LINDAT/CLARIAH-CZ tracker
ga('create', 'UA-27008245-2', 'cuni.cz');
ga('send', 'pageview');
//]]>
</script>
</footer>
<!-- Copyright -->
<div class="bottom-footer p-1 d-flex justify-content-center align-items-center text-white">
<div class="content-container">
<p class="m-0">
<a class="text-white"
href="http://www.dspace.org/">{{ 'footer.link.dspace' | translate}}</a>
{{ 'footer.copyright' | translate:{year: dateObj | date:'y'} }}
<a class="text-white"
href="https://www.lyrasis.org/">{{ 'footer.link.lyrasis' | translate}}</a>
</p>
<ul class="footer-info list-unstyled small d-flex justify-content-center mb-0">
<li>
<a class="text-white" href="javascript:void(0);"
(click)="showCookieSettings()">{{ 'footer.link.cookies' | translate}}</a>
</li>
<li *ngIf="showPrivacyPolicy">
<a class="text-white"
routerLink="info/privacy">{{ 'footer.link.privacy-policy' | translate}}</a>
</li>
<li *ngIf="showEndUserAgreement">
<a class="text-white"
routerLink="info/end-user-agreement">{{ 'footer.link.end-user-agreement' | translate}}</a>
</li>
<li *ngIf="showSendFeedback$ | async">
<a class="text-white"
routerLink="info/feedback">{{ 'footer.link.feedback' | translate}}</a>
</li>
</ul>
</div>
</div>
<!-- Copyright -->
</footer>
85 changes: 26 additions & 59 deletions src/app/home-page/home-page.component.html
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,68 +1,35 @@
<div class="container clarin-shadow remove-padding clarin-home-page-borders clarin-fix-to-navbar clarin-cut-bottom">
<div class="container bg-white">
<div class="row d-none d-md-flex">
<div class="col-md-8 justify-content-center align-self-center pl-3">
<ngb-carousel>
<ng-template ngbSlide *ngFor="let slide of slides">
<div class="wrapper">
<div *ngIf="slide.short === 'LData'">
<img src="assets/images/home-page-glass.png" class="glass-image">
<h3 class="carousel-ldata-info">{{'home-page.carousel.ldata.info' | translate}}</h3>
<h5 class="carousel-ldata-find">{{'home-page.carousel.ldata.find' | translate}}</h5>
<h5 class="carousel-ldata-citation-support">{{'home-page.carousel.ldata.citation-support' | translate}}</h5>
</div>
<div *ngIf="slide.short === 'Free Deposit'">
<h3 class="h5-font carousel-deposit-header">{{'home-page.carousel.deposit.header' | translate}}</h3>
<h5 class="h5-font carousel-deposit-info">{{'home-page.carousel.deposit.info' | translate}}</h5>
<h5 class="h5-font carousel-deposit-find">{{'home-page.carousel.deposit.find' | translate}}</h5>
<h5 class="h5-font carousel-deposit-cite">{{'home-page.carousel.deposit.cite' | translate}}</h5>
</div>
<div *ngIf="slide.short === 'Citation'">
<div class="carousel-deposit-citation">
<blockquote class="h5-font">
<strong>
<i class="fa fa-quote-left fa-2x pull-left">&nbsp;</i>{{'home-page.carousel.deposit.citation' | translate}}</strong>
<small>{{'home-page.carousel.deposit.small' | translate}}</small>
</blockquote>
</div>
</div>
</div>
</ng-template>
</ngb-carousel>
</div>
<div class="col-md-4 d-none d-lg-block">
<div class="row">
<a routerLink="home" class="col-md-7" style="height: 160px; position: relative;">
<img alt="LINDAT/CLARIAH-CZ logo" class="logo" style="position: absolute; height: 50%; top: 0px; bottom: 0px; margin: auto;" src="assets/images/lindat-logo-new-sm.png">
</a>
<a class="col-md-5" style="height: 160px; position: relative;" href="http://www.clarin.eu/">
<img alt="LINDAT/CLARIAH-CZ logo" class="logo" style="position: absolute; height: 50%; top: 0px; bottom: 0px; margin: auto;" src="assets/images/clarin-logo.png">
</a>
</div>
</div>
</div>
</div>
<div class="background-image-container mt-ncs">
<div class="container">
<div class="row hidden-xs lindat-color-line"><img class="w-100" src="assets/images/lindat_color_line.png"></div>
<div class="d-flex flex-wrap">
<!-- <div>-->
<!-- <img alt="" class="img-fluid" [src]="'assets/images/hl1_cs.png'"/>-->
<!-- </div>-->
</div>
</div>
<div class="container clarin-home-page-color pt-4 pb-5">
</div>
<div class="container clarin-shadow remove-padding clarin-home-page-borders clarin-cut-bottom">
<div class="container clarin-home-page-color remove-padding pt-5 pb-5">
<div class="justify-content-between">
<h1 class="library-name">{{ 'home-page.library.name' | translate }}</h1>
<!-- <div>{{ 'home-page.library.description' | translate }}</div>-->
</div>
<div class="row justify-content-center pt-4">
<div class="col-6 d-flex justify-content-center">
<span class="flex-fill input-group-addon">
<i style="color: #7479B8;" class="fas fa-search fa-lg"></i>
</span>
<ds-themed-search-form id="search-form"
class="flex-fill"
[currentUrl]="searchLink"
[inPlaceSearch]="false"
[searchPlaceholder]="'home-page.search' | translate">
</ds-themed-search-form>
</div>
<div class="col-6 d-flex justify-content-center">
<span class="flex-fill input-group-addon">
<i style="color: #7479B8;" class="fas fa-search fa-lg"></i>
</span>
<ds-themed-search-form id="search-form"
class="flex-fill"
[currentUrl]="searchLink"
[inPlaceSearch]="false"
[searchPlaceholder]="'home-page.search' | translate">
</ds-themed-search-form>
</div>
<div class="row justify-content-center pt-3">
</div>
<div class="row justify-content-center pt-3">
<a href="javascript:void(0);" (click)="redirectToSearch('')">{{'home-page.advanced-search' | translate}}</a>
</div>
<div class="row justify-content-center pt-5">
<div class="row justify-content-center pt-5">
<div class="col-md-9 responsive-padding">
<div class="row offset-md-1">
<div class="col-md-4 border-bottom">
Expand Down
4 changes: 4 additions & 0 deletions src/app/home-page/home-page.component.scss
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -183,6 +183,10 @@
}
}

.library-name {
text-align: center;
}

@media (max-width: 768px) {
.responsive-padding {
padding-left: 50px !important;
Expand Down
6 changes: 3 additions & 3 deletions src/app/login-page/login-page.component.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -2,9 +2,9 @@
<div class="text-center mt-5 row justify-content-center">
<div>
<img class="mb-4 login-logo" src="assets/images/dspace-logo.png" alt="{{'repository.image.logo' | translate}}">
<a href="https://www.clarin.eu/">
<img class="clarin-logo" src="assets/images/clarin-logo.svg" alt="Clarin logo" >
</a>
<!-- <a href="https://www.clarin.eu/">-->
<!-- <img class="clarin-logo" src="assets/images/clarin-logo.svg" alt="Clarin logo" >-->
<!-- </a>-->
<h1 class="h3 mb-0 font-weight-normal">{{"login.form.header" | translate}}</h1>
<ds-themed-log-in
[isStandalonePage]="true"></ds-themed-log-in>
Expand Down
6 changes: 3 additions & 3 deletions src/app/logout-page/logout-page.component.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -2,9 +2,9 @@
<div class="text-center mt-5 row justify-content-md-center">
<div class="mx-auto">
<img class="mb-4 login-logo" src="assets/images/dspace-logo.png">
<a href="https://www.clarin.eu/">
<img class="clarin-logo" src="assets/images/clarin-logo.svg" alt="Clarin logo" >
</a>
<!-- <a href="https://www.clarin.eu/">-->
<!-- <img class="clarin-logo" src="assets/images/clarin-logo.svg" alt="Clarin logo" >-->
<!-- </a>-->
<h1 class="h3 mb-0 font-weight-normal">{{"logout.form.header" | translate}}</h1>
<ds-log-out></ds-log-out>
</div>
Expand Down
7 changes: 5 additions & 2 deletions src/app/search-navbar/search-navbar.component.scss
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -14,9 +14,12 @@ input[type="text"] {
top: 0;
border: 0 !important;

color: var(--ds-header-icon-color);
color: white;
&:hover, &:focus {
color: var(--ds-header-icon-color-hover);
background-color: white;
color: var(--lt-zcu-pub-blue);
border-radius: 2px;
transition: background-color 0.2s ease-out;
}
}

Expand Down
9 changes: 6 additions & 3 deletions src/app/shared/auth-nav-menu/auth-nav-menu.component.scss
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -12,10 +12,13 @@
background-color: transparent !important;
}

.loginLink, .dropdownLogin, .logoutLink, .dropdownLogout, dropdown-toggle {
color: var(--ds-header-icon-color);
.loginLink, .dropdownLogin, .logoutLink, .dropdownLogout {
color: white;

&:hover, &:focus {
color: var(--ds-header-icon-color-hover);
background-color: white;
color: var(--lt-zcu-pub-blue);
border-radius: 2px;
transition: background-color 0.2s ease-out;
}
}
7 changes: 5 additions & 2 deletions src/app/shared/lang-switch/lang-switch.component.scss
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -3,10 +3,13 @@
}

.dropdown-toggle {
color: var(--ds-header-icon-color);
color: white;

&:hover, &:focus {
color: var(--ds-header-icon-color-hover);
background-color: white;
color: var(--lt-zcu-pub-blue);
border-radius: 2px;
transition: background-color 0.2s ease-out;
}
}

Expand Down
Loading
Loading