Add external icon on static pages

This commit is contained in:
apapachristou 2020-09-11 18:35:32 +03:00
parent 239b91480b
commit 6eb797edfa
11 changed files with 136 additions and 84 deletions

View File

@ -17,7 +17,7 @@
</a>
<a class="nav-link nav-row" *ngIf="groupMenuRoute.path === '/co-branding'" href="/splash/resources/co-branding.html">
<i class="material-icons icon">{{ groupMenuRoute.icon }}</i>
<span>{{groupMenuRoute.title | translate}}</span>
<span>{{groupMenuRoute.title | translate}} <span class="material-icons icon-external">open_in_new</span></span>
</a>
<a class="nav-link nav-row" *ngIf="groupMenuRoute.path === '/contact-support' && this.isAuthenticated()" [routerLink]="[groupMenuRoute.path]">
<i class="material-icons icon">{{ groupMenuRoute.icon }}</i>
@ -25,11 +25,11 @@
</a>
<a class="nav-link nav-row" *ngIf="groupMenuRoute.path === '/contact-support' && !this.isAuthenticated()" href="/splash/contact.html">
<i class="material-icons icon">{{ groupMenuRoute.icon }}</i>
<span>{{groupMenuRoute.title | translate}}</span>
<span>{{groupMenuRoute.title | translate}} <span class="material-icons icon-external">open_in_new</span></span>
</a>
<a class="nav-link nav-row" *ngIf="groupMenuRoute.path === '/feedback'" (click)="openFeedback(groupMenuRoute)">
<i class="material-icons icon">{{ groupMenuRoute.icon }}</i>
<span>{{groupMenuRoute.title | translate}}</span>
<span>{{groupMenuRoute.title | translate}} <span class="material-icons icon-external">open_in_new</span></span>
</a>
</mat-list-item>
</div>

View File

@ -9,7 +9,7 @@ $mat-card-header-size: 30px !default;
}
.nav-list-item {
// margin-top: 20px;
// margin-top: 20px;
}
.login {
@ -21,36 +21,42 @@ $mat-card-header-size: 30px !default;
}
.firstSubtitle {
margin-top: 20px;
margin-top: 20px;
}
.icon-mask {
color: #6b6b6b;
transform: translate(-8px, 8px);
color: #6b6b6b;
transform: translate(-8px, 8px);
}
.active a{
font-weight: 700;
.active a {
font-weight: 700;
}
.active a i{
color: #23BCBA;
.active a i {
color: #23bcba;
}
.inner-line {
margin-left: 12px;
margin-right: 10px;
width: 20px;
height: 13px;
border-left: 1px solid #CCCCCC;
border-bottom: 1px solid #CCCCCC;
margin-left: 12px;
margin-right: 10px;
width: 20px;
height: 13px;
border-left: 1px solid #cccccc;
border-bottom: 1px solid #cccccc;
}
.icon-external {
font-size: 1rem;
padding-left: 0.4rem !important;
color: #6b6b6b;
}
mat-list-item {
display: flex !important;
height: auto !important;
display: flex !important;
height: auto !important;
}
::ng-deep .mat-list-item-content {
width: 100% !important;
width: 100% !important;
}

View File

@ -33,7 +33,10 @@
<div class="dropdown-top"></div>
<div class="dropdown-options">
<a href="how-it-works.html">How it works</a>
<a href="https://trello.com/b/x49lylnK/argos" target="_blank">Roadmap</a>
<a href="https://trello.com/b/x49lylnK/argos" target="_blank">
Roadmap
<i class="fas fa-external-link-alt ext-link-icon"></i>
</a>
<a href="faqs.html">faqs</a>
<a href="contributors.html">Contributors</a>
</div>
@ -132,7 +135,10 @@
<div class="col-auto pl-0"><img src="../assets/img/univ-access.png" width="24" height="24"></div>
<div class="licence">Unless otherwise indicated, all materials created by OpenAIRE are licenced under
</div>&nbsp;
<div><u><a class="licence" href="https://creativecommons.org/licenses/by/4.0/">ATTRIBUTION 4.0 INTERNATIONAL LICENSE.</a></u></div>
<div><u><a class="licence" href="https://creativecommons.org/licenses/by/4.0/">
ATTRIBUTION 4.0 INTERNATIONAL LICENSE.
<i class="fas fa-external-link-alt ext-link-icon"></i>
</a></u></div>
</div>
</div>
</footer>

View File

@ -34,7 +34,10 @@
<div class="dropdown-top"></div>
<div class="dropdown-options">
<a href="how-it-works.html">How it works</a>
<a href="https://trello.com/b/x49lylnK/argos" target="_blank">Roadmap</a>
<a href="https://trello.com/b/x49lylnK/argos" target="_blank">
Roadmap
<i class="fas fa-external-link-alt ext-link-icon"></i>
</a>
<a href="faqs.html">faqs</a>
<a href="contributors.html">Contributors</a>
</div>
@ -198,7 +201,10 @@
<div class="col-auto pl-0"><img src="../assets/img/univ-access.png" width="24" height="24"></div>
<div class="licence">Unless otherwise indicated, all materials created by OpenAIRE are licenced under
</div>&nbsp;
<div><u><a class="licence" href="https://creativecommons.org/licenses/by/4.0/">ATTRIBUTION 4.0 INTERNATIONAL LICENSE.</a></u></div>
<div><u><a class="licence" href="https://creativecommons.org/licenses/by/4.0/">
ATTRIBUTION 4.0 INTERNATIONAL LICENSE.
<i class="fas fa-external-link-alt ext-link-icon"></i>
</a></u></div>
</div>
</div>
</footer>

View File

@ -33,7 +33,10 @@
<div class="dropdown-top"></div>
<div class="dropdown-options">
<a href="how-it-works.html">How it works</a>
<a href="https://trello.com/b/x49lylnK/argos" target="_blank">Roadmap</a>
<a href="https://trello.com/b/x49lylnK/argos" target="_blank">
Roadmap
<i class="fas fa-external-link-alt ext-link-icon"></i>
</a>
<a href="faqs.html">faqs</a>
<a href="contributors.html">Contributors</a>
</div>
@ -152,7 +155,10 @@
<div class="col-auto pl-0"><img src="../assets/img/univ-access.png" width="24" height="24"></div>
<div class="licence">Unless otherwise indicated, all materials created by OpenAIRE are licenced under
</div>&nbsp;
<div><u><a class="licence" href="https://creativecommons.org/licenses/by/4.0/">ATTRIBUTION 4.0 INTERNATIONAL LICENSE.</a></u></div>
<div><u><a class="licence" href="https://creativecommons.org/licenses/by/4.0/">
ATTRIBUTION 4.0 INTERNATIONAL LICENSE.
<i class="fas fa-external-link-alt ext-link-icon"></i>
</a></u></div>
</div>
</div>
</footer>
@ -164,4 +170,4 @@
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.5.0/js/bootstrap.min.js" integrity="sha384-OgVRvuATP1z7JjHLkuOU7Xw704+h835Lr+6QL9UvYjZE3Ipu6Tp75j7Bh/kR0JKI" crossorigin="anonymous"></script>
</body>
</html>
</html>

View File

@ -34,7 +34,10 @@
<div class="dropdown-top"></div>
<div class="dropdown-options">
<a href="about/how-it-works.html">How it works</a>
<a href="https://trello.com/b/x49lylnK/argos" target="_blank">Roadmap</a>
<a href="https://trello.com/b/x49lylnK/argos" target="_blank">
Roadmap
<i class="fas fa-external-link-alt ext-link-icon"></i>
</a>
<a href="about/faqs.html">faqs</a>
<a href="about/contributors.html">Contributors</a>
</div>
@ -134,7 +137,10 @@
<div class="col-auto pl-0"><img src="assets/img/univ-access.png" width="24" height="24"></div>
<div class="licence">Unless otherwise indicated, all materials created by OpenAIRE are licenced under
</div>&nbsp;
<div><u><a class="licence" href="https://creativecommons.org/licenses/by/4.0/">ATTRIBUTION 4.0 INTERNATIONAL LICENSE.</a></u></div>
<div><u><a class="licence" href="https://creativecommons.org/licenses/by/4.0/">
ATTRIBUTION 4.0 INTERNATIONAL LICENSE.
<i class="fas fa-external-link-alt ext-link-icon"></i>
</a></u></div>
</div>
</div>
</footer>

View File

@ -361,3 +361,7 @@ hr {
padding-left: 0px !important;
transform: scale(0.45);
}
.ext-link-icon {
margin-left: .2rem;
}

View File

@ -34,7 +34,10 @@
<div class="dropdown-top"></div>
<div class="dropdown-options">
<a href="about/how-it-works.html">How it works</a>
<a href="https://trello.com/b/x49lylnK/argos" target="_blank">Roadmap</a>
<a href="https://trello.com/b/x49lylnK/argos" target="_blank">
Roadmap
<i class="fas fa-external-link-alt ext-link-icon"></i>
</a>
<a href="about/faqs.html">faqs</a>
<a href="about/contributors.html">Contributors</a>
</div>
@ -268,8 +271,12 @@
<div class="row benefit-ic">
<img src="assets/img/ic_check_circle_24px.svg" width="20" height="20">
<span class="benefit-card-subtitle">Link argos to your</span>&nbsp;
<span class="benefit-card-sub-color"><a href="https://monitor.openaire.eu/">Monitoring
Dashboard</a></span>
<span class="benefit-card-sub-color">
<a href="https://monitor.openaire.eu/">
Monitoring Dashboard
<i class="fas fa-external-link-alt fa-sm ext-link-icon"></i>
</a>
</span>
</div>
</div>
</div>
@ -396,7 +403,10 @@
<div class="col-auto pl-0"><img src="assets/img/univ-access.png" width="24" height="24"></div>
<div class="licence">Unless otherwise indicated, all materials created by OpenAIRE are licenced under
</div>&nbsp;
<div><u><a class="licence" href="https://creativecommons.org/licenses/by/4.0/">CC ATTRIBUTION 4.0 INTERNATIONAL LICENSE.</a></u></div>
<div><u><a class="licence" href="https://creativecommons.org/licenses/by/4.0/">
CC ATTRIBUTION 4.0 INTERNATIONAL LICENSE.
<i class="fas fa-external-link-alt ext-link-icon"></i>
</a></u></div>
</div>
</div>
</footer>

View File

@ -38,7 +38,10 @@
<div class="dropdown-top"></div>
<div class="dropdown-options">
<a href="../about/how-it-works.html">How it works</a>
<a href="https://trello.com/b/x49lylnK/argos" target="_blank">Roadmap</a>
<a href="https://trello.com/b/x49lylnK/argos" target="_blank">
Roadmap
<i class="fas fa-external-link-alt ext-link-icon"></i>
</a>
<a href="../about/faqs.html">faqs</a>
<a href="../about/contributors.html">Contributors</a>
</div>
@ -75,7 +78,10 @@
<div class="col">
<p>Open to all to suggest new features and to actively contribute to Argos development via pull
requests of code in
<a href="https://gitlab.eudat.eu/dmp/OpenAIRE-EUDAT-DMP-service-pilot">GitLab</a>!
<a href="https://gitlab.eudat.eu/dmp/OpenAIRE-EUDAT-DMP-service-pilot" target="_blank">
GitLab
<i class="fas fa-external-link-alt ext-link-icon fa-sm"></i>
</a>!
<br>Note that this page is under development.
</p>
</div>
@ -130,8 +136,10 @@
<div class="col-auto pl-0"><img src="../assets/img/univ-access.png" width="24" height="24"></div>
<div class="licence">Unless otherwise indicated, all materials created by OpenAIRE are licenced under
</div>&nbsp;
<div><u><a class="licence" href="https://creativecommons.org/licenses/by/4.0/">ATTRIBUTION 4.0
INTERNATIONAL LICENSE.</a></u></div>
<div><u><a class="licence" href="https://creativecommons.org/licenses/by/4.0/">
ATTRIBUTION 4.0 INTERNATIONAL LICENSE.
<i class="fas fa-external-link-alt ext-link-icon"></i>
</a></u></div>
</div>
</div>
</footer>
@ -149,4 +157,4 @@
crossorigin="anonymous"></script>
</body>
</html>
</html>

View File

@ -9,17 +9,14 @@
<!-- Font Awesome icons (free version)-->
<script src="https://use.fontawesome.com/releases/v5.12.1/js/all.js" crossorigin="anonymous"></script>
<!-- Google fonts-->
<link
href="https://fonts.googleapis.com/css2?family=Roboto:ital,wght@0,100;0,300;0,400;0,500;0,700;0,900;1,100;1,300;1,400;1,500;1,700;1,900&display=swap"
rel="stylesheet">
<link href="https://fonts.googleapis.com/css2?family=Roboto:ital,wght@0,100;0,300;0,400;0,500;0,700;0,900;1,100;1,300;1,400;1,500;1,700;1,900&display=swap" rel="stylesheet">
<!-- Core theme CSS -->
<link href="../css/styles.css" rel="stylesheet">
<link href="../css/navbar.css" rel="stylesheet">
<link href="../css/footer.css" rel="stylesheet">
<link href="../css/section.css" rel="stylesheet">
<!-- Bootstrap -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css"
integrity="sha384-Gn5384xqQ1aoWXA+058RXPxPg6fy4IWvTNh0E263XmFcJlSAwiGgFAW/dAiS6JXm" crossorigin="anonymous">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css" integrity="sha384-Gn5384xqQ1aoWXA+058RXPxPg6fy4IWvTNh0E263XmFcJlSAwiGgFAW/dAiS6JXm" crossorigin="anonymous">
</head>
<body id="page-top" class="bootstrap-overrides">
@ -27,9 +24,7 @@
<nav class="navbar navbar-expand-lg" id="nav">
<div class="container">
<a class="navbar-brand" href="../index.html"><img src="../assets/img/argos-logo.svg"></a>
<button class="collapse navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarResponsive"
aria-controls="navbarResponsive" aria-expanded="false" aria-label="Toggle navigation"><i
class="fas fa-bars ml-1"></i></button>
<button class="collapse navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarResponsive" aria-controls="navbarResponsive" aria-expanded="false" aria-label="Toggle navigation"><i class="fas fa-bars ml-1"></i></button>
<div class="navbar-collapse" id="navbarResponsive">
<ul class="navbar-nav text-uppercase ml-auto">
<li class="nav-item">
@ -38,7 +33,10 @@
<div class="dropdown-top"></div>
<div class="dropdown-options">
<a href="../about/how-it-works.html">How it works</a>
<a href="https://trello.com/b/x49lylnK/argos" target="_blank">Roadmap</a>
<a href="https://trello.com/b/x49lylnK/argos" target="_blank">
Roadmap
<i class="fas fa-external-link-alt ext-link-icon"></i>
</a>
<a href="../about/faqs.html">faqs</a>
<a href="../about/contributors.html">Contributors</a>
</div>
@ -92,11 +90,15 @@
way.
</li>
<li>
<a href="../assets/media-kit/Factsheet.pdf">Factsheet</a> containing the basics of Argos and
explaining its key features in an adequate level of
<a href="../assets/media-kit/Factsheet.pdf">
Factsheet
<i class="fas fa-external-link-alt ext-link-icon fa-xs"></i>
</a> containing the basics of Argos and explaining its key features in an adequate level of
</li>
<li>
<a href="https://www.openaire.eu/argos/">Useful Resources,</a> a collection of resources either
<a href="https://www.openaire.eu/argos/">Useful Resources
<i class="fas fa-external-link-alt ext-link-icon fa-xs"></i>
,</a> a collection of resources either
directly for Argos or indirectly for Research Data Management issues which to some extent relate
to Argos.
</li>
@ -167,10 +169,8 @@
</div>
</div>
<div class="row d-flex justify-content-center">
<div class="col-auto pt-4"><a href="../assets/media-kit/moo-card-svg.zip"><i
class="fas fa-lg fa-download"></i>SVG</a></div>
<div class="col-auto pt-4"><a href="../assets/media-kit/moo-card-png.zip"><i
class="fas fa-lg fa-download"></i>PNG</a></div>
<div class="col-auto pt-4"><a href="../assets/media-kit/moo-card-svg.zip"><i class="fas fa-lg fa-download"></i>SVG</a></div>
<div class="col-auto pt-4"><a href="../assets/media-kit/moo-card-png.zip"><i class="fas fa-lg fa-download"></i>PNG</a></div>
</div>
</div>
</section>
@ -193,19 +193,13 @@
</div>
<div class="row justify-content-center pt-5">
<div class="col d-flex justify-content-end">
<a class="btn rounded-circle btn-social mx-1" href="https://www.facebook.com/groups/openaire/"><i
class="fab fa-lg fa-facebook-f"></i></a>
<a class="btn rounded-circle btn-social twitter mx-1" href="https://twitter.com/OpenAIRE_eu"><i
class="fab fa-lg fa-twitter"></i></a>
<a class="btn rounded-circle btn-social linkedin mx-1"
href="https://www.linkedin.com/groups/3893548/"><i class="fab fa-lg fa-linkedin-in"></i></a>
<a class="btn rounded-circle btn-social youtube mx-1"
href="https://www.youtube.com/channel/UChFYqizc-S6asNjQSoWuwjw"><i
class="fab fa-lg fa-youtube"></i></a>
<a class="btn rounded-circle btn-social mx-1" href="https://www.facebook.com/groups/openaire/"><i class="fab fa-lg fa-facebook-f"></i></a>
<a class="btn rounded-circle btn-social twitter mx-1" href="https://twitter.com/OpenAIRE_eu"><i class="fab fa-lg fa-twitter"></i></a>
<a class="btn rounded-circle btn-social linkedin mx-1" href="https://www.linkedin.com/groups/3893548/"><i class="fab fa-lg fa-linkedin-in"></i></a>
<a class="btn rounded-circle btn-social youtube mx-1" href="https://www.youtube.com/channel/UChFYqizc-S6asNjQSoWuwjw"><i class="fab fa-lg fa-youtube"></i></a>
</div>
<div class="col">
<a class="btn mx-1" href="https://www.openaire.eu/newsletter/listing"><span
class="newsletter">Newsletter</span><i class="fas fa-lg fa-wifi wifi-rotate"></i></i></a>
<a class="btn mx-1" href="https://www.openaire.eu/newsletter/listing"><span class="newsletter">Newsletter</span><i class="fas fa-lg fa-wifi wifi-rotate"></i></i></a>
</div>
</div>
<div class="row justify-content-center pt-5">
@ -218,23 +212,19 @@
<div class="col-auto pl-0"><img src="../assets/img/univ-access.png" width="24" height="24"></div>
<div class="licence">Unless otherwise indicated, all materials created by OpenAIRE are licenced under
</div>&nbsp;
<div><u><a class="licence" href="https://creativecommons.org/licenses/by/4.0/">ATTRIBUTION 4.0
INTERNATIONAL LICENSE.</a></u></div>
<div><u><a class="licence" href="https://creativecommons.org/licenses/by/4.0/">
ATTRIBUTION 4.0 INTERNATIONAL LICENSE.
<i class="fas fa-external-link-alt ext-link-icon"></i>
</a></u></div>
</div>
</div>
</footer>
<!-- Core theme JS-->
<script src="../js/scripts.js"></script>
<!-- Bootstrap -->
<script src="https://code.jquery.com/jquery-3.5.1.slim.min.js"
integrity="sha384-DfXdz2htPH0lsSSs5nCTpuj/zy4C+OGpamoFVy38MVBnE+IbbVYUew+OrCXaRkfj"
crossorigin="anonymous"></script>
<script src="https://cdn.jsdelivr.net/npm/popper.js@1.16.0/dist/umd/popper.min.js"
integrity="sha384-Q6E9RHvbIyZFJoft+2mJbHaEWldlvI9IOYy5n3zV9zzTtmI3UksdQRVvoxMfooAo"
crossorigin="anonymous"></script>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.5.0/js/bootstrap.min.js"
integrity="sha384-OgVRvuATP1z7JjHLkuOU7Xw704+h835Lr+6QL9UvYjZE3Ipu6Tp75j7Bh/kR0JKI"
crossorigin="anonymous"></script>
<script src="https://code.jquery.com/jquery-3.5.1.slim.min.js" integrity="sha384-DfXdz2htPH0lsSSs5nCTpuj/zy4C+OGpamoFVy38MVBnE+IbbVYUew+OrCXaRkfj" crossorigin="anonymous"></script>
<script src="https://cdn.jsdelivr.net/npm/popper.js@1.16.0/dist/umd/popper.min.js" integrity="sha384-Q6E9RHvbIyZFJoft+2mJbHaEWldlvI9IOYy5n3zV9zzTtmI3UksdQRVvoxMfooAo" crossorigin="anonymous"></script>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.5.0/js/bootstrap.min.js" integrity="sha384-OgVRvuATP1z7JjHLkuOU7Xw704+h835Lr+6QL9UvYjZE3Ipu6Tp75j7Bh/kR0JKI" crossorigin="anonymous"></script>
</body>
</html>
</html>

View File

@ -38,7 +38,10 @@
<div class="dropdown-top"></div>
<div class="dropdown-options">
<a href="../about/how-it-works.html">How it works</a>
<a href="https://trello.com/b/x49lylnK/argos" target="_blank">Roadmap</a>
<a href="https://trello.com/b/x49lylnK/argos" target="_blank">
Roadmap
<i class="fas fa-external-link-alt ext-link-icon"></i>
</a>
<a href="../about/faqs.html">faqs</a>
<a href="../about/contributors.html">Contributors</a>
</div>
@ -79,9 +82,14 @@
</p>
<ul class="list mb-5">
<li><a href="/user-guide">User Guide</a></li>
<li><a href="../assets/presentations/argos.pdf">Presentations</a></li>
<li><a href="https://docs.google.com/forms/d/1KNhgjQyGrA6lYjOOUUL5cqU2BVquS0qdfwzOGxokgAw">Feedback
Form</a></li>
<li><a href="../assets/presentations/argos.pdf">
Presentations
<i class="fas fa-external-link-alt ext-link-icon fa-xs"></i>
</a></li>
<li><a href="https://docs.google.com/forms/d/1KNhgjQyGrA6lYjOOUUL5cqU2BVquS0qdfwzOGxokgAw">
Feedback Form
<i class="fas fa-external-link-alt ext-link-icon fa-xs"></i>
</a></li>
</ul>
</div>
<div class="col d-flex justify-content-center mb-5 pb-5">
@ -132,8 +140,10 @@
<div class="col-auto pl-0"><img src="../assets/img/univ-access.png" width="24" height="24"></div>
<div class="licence">Unless otherwise indicated, all materials created by OpenAIRE are licenced under
</div>&nbsp;
<div><u><a class="licence" href="https://creativecommons.org/licenses/by/4.0/">CC ATTRIBUTION 4.0
INTERNATIONAL LICENSE.</a></u></div>
<div><u><a class="licence" href="https://creativecommons.org/licenses/by/4.0/">
CC ATTRIBUTION 4.0 INTERNATIONAL LICENSE.
<i class="fas fa-external-link-alt ext-link-icon"></i>
</a></u></div>
</div>
</div>
</footer>
@ -151,4 +161,4 @@
crossorigin="anonymous"></script>
</body>
</html>
</html>