MaDgIK
/
openaire-library
13
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

Add footer icons in icons-library. Make some UI fixes in footer and adjust mobile view

This commit is contained in:
Konstantinos Triantafyllou 2022-12-02 13:01:26 +02:00
parent de39d90199
commit 25e332a512
7 changed files with 387 additions and 514 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

524
sharedComponents/bottom.component.html
View File

@ -1,318 +1,278 @@
<ng-template #grant>
<div class="uk-margin-small-top">
<img style="max-width: 42px;" [src]="assetsPath + 'common/commission.jpg'" alt="flag black white low" width="50px" loading="lazy">
</div>
<div class="uk-margin-left">
<helper *ngIf="divContents && divContents['footer']?.length > 0"
[texts]="divContents['footer']"></helper>
<div *ngIf="properties.footerGrantText">
<span class="uk-text-xsmall" [innerHtml]="properties.footerGrantText"></span>
</div>
</div>
</ng-template>
<ng-container *ngIf="shortView;else longView">
<div *ngIf="properties.footerGrantText || (divContents && divContents['footer']?.length > 0)"
class="uk-padding uk-flex uk-flex-middle">
<div *ngIf="showCommision" class="uk-width-1-2 uk-margin-left">
<div class="uk-flex uk-flex-middle">
<div class="uk-flex uk-flex-middle@m uk-flex-top">
<div>
<img style="margin-right: 8px; float: left;"
<img style="max-width: 42px;"
[src]="assetsPath + 'common/commission.jpg'"
alt="flag black white low" width="50px" height="33px" loading="lazy">
alt="flag black white low" width="50px" loading="lazy">
</div>
<div class="uk-margin-left">
<helper *ngIf="divContents && divContents['footer']?.length > 0"
[texts]="divContents['footer']"></helper>
<div class="uk-visible@m">
<div *ngIf="properties.footerGrantText" class="">
<span style="font-size: 12px; line-height: 0.7!important;"
[innerHtml]="properties.footerGrantText"></span>
</div>
</div>
<div class="uk-text-center uk-hidden@m">
<div *ngIf="properties.footerGrantText" class="">
<span style="font-size: 12px; line-height: 0.7!important;"
[innerHtml]="properties.footerGrantText"></span>
</div>
</div>
</div>
<div class="uk-margin-left">
<helper *ngIf="divContents && divContents['footer']?.length > 0"
[texts]="divContents['footer']"></helper>
<div class="uk-visible@m">
<div *ngIf="properties.footerGrantText" class="">
<span style="font-size: 12px; line-height: 0.7!important;" [innerHtml]="properties.footerGrantText"></span>
</div>
</div>
<div class="uk-text-center uk-hidden@m">
<div *ngIf="properties.footerGrantText" class="">
<span style="font-size: 12px; line-height: 0.7!important;" [innerHtml]="properties.footerGrantText"></span>
</div>
</div>
</div>
</div>
</div>
<div *ngIf="showOpenaire" class="uk-text-right uk-width-1-2">
<!-- <img [src]="assetsPath + 'common/Logo_Horizontal_'+(darkBackground?'white':'dark')+'_small.png'" -->
<img [src]="assetsPath + 'common/Logo_Horizontal.png'"
<img [src]="assetsPath + 'common/Logo_Horizontal.png'"
width="140px"
height="50px" class="el-image" alt="OpenAIRE" loading="lazy">
</div>
</div>
</ng-container>
<ng-template #longView>
<div [class]="sectionClass + ' uk-section uk-padding-remove-bottom'">
<div [class]="'uk-container ' +(centered?'uk-container-small':'uk-container-expand') ">
<!-- <div class="uk-container uk-container-expand uk-margin-small">-->
<div [class]="(centered?'':'uk-grid uk-grid-collapse ') ">
<div id="footer#3"
[class]="'uk-first-column uk-flex uk-flex-middle ' +
(centered?'uk-grid uk-margin-remove-right':'uk-margin-large-right ' +
(properties.footerGrantText || (divContents && divContents['footer']?.length > 0) ? 'uk-width-1-3@m' : '')) +
(centered && showMenuItems ? '' : ' uk-flex-column')">
<ng-container *ngIf="properties.footerGrantText || (divContents && divContents['footer']?.length > 0)">
<div *ngIf="showOpenaire"
[class]="(centered?'uk-width-1-1 uk-width-1-4@m uk-text-center ':'') +
(centered && showMenuItems ? '' : 'uk-margin-bottom')">
<!-- <img [src]="assetsPath + 'common/Logo_Horizontal_'+(darkBackground?'white':'dark')+'_small.png'" -->
<img [src]="assetsPath + 'common/Logo_Horizontal.png'"
width="140px"
height="50px" class="el-image" alt="OpenAIRE" loading="lazy">
</div>
<div *ngIf="showCommision" id="footer#5"
[class]="'uk-text-left '+(centered?' uk-margin uk-width-expand':' uk-margin-left')">
<!-- [src]="assetsPath + 'common/commission'+(this.darkBackground?'.jpg':'-dark.png')"-->
<!-- <div *ngIf="!grantAdvance" class="uk-margin">-->
<!-- <img style="margin-right: 8px; float: left;"-->
<!-- [src]="assetsPath + 'common/commission'+(this.darkBackground?'.jpg':'-dark.png')"-->
<!-- alt="flag black white low" width="50" height="33">-->
<!-- <span style="font-size: 8pt; line-height: 0.7!important;" [innerHtml] = "grantConenctText"></span>-->
<!-- </div>-->
<!-- <div class="uk-margin">-->
<!-- <img style="margin-right: 8px; float: left;" [src]="assetsPath + 'common/commission'+(this.darkBackground?'.jpg':'-dark.png')" alt="flag black white low" width="50" height="33">-->
<!-- <span style="font-size: 8pt; line-height: 0.7!important;" [innerHtml] = "grantAdvanceText"></span>-->
<!-- </div>-->
<div class="uk-flex uk-flex-middle">
<div>
<img style="margin-right: 8px; float: left;"
[src]="assetsPath + 'common/commission.jpg'"
alt="flag black white low" width="50px" height="33px" loading="lazy">
</div>
<div class="uk-margin-left">
<helper *ngIf="divContents && divContents['footer']?.length > 0"
[texts]="divContents['footer']"></helper>
<div *ngIf="properties.footerGrantText" class="">
<span style="font-size: 12px; line-height: 0.7!important;" [innerHtml]="properties.footerGrantText"></span>
</div>
<div class="uk-visible@m">
<div [ngClass]="background">
<div class="uk-section uk-padding-remove-bottom">
<div class="uk-container" [class.uk-container-expand]="!centered" [class.uk-container-small]="centered">
<div class="uk-grid" [class.uk-flex-center]="centered" uk-grid>
<div *ngIf="properties.footerGrantText || (divContents && divContents['footer']?.length > 0)"
class="uk-width-1-1" [class.uk-width-1-3@m]="!centered"
[attr.uk-grid]="centered?'':null" [class.uk-grid]="centered">
<div *ngIf="showOpenaire" class="uk-text-center uk-margin-bottom uk-width-1-1"
[class.uk-width-1-4@m]="centered">
<img [src]="assetsPath + 'common/Logo_Horizontal.png'"
width="140px"
height="50px" class="el-image" alt="OpenAIRE" loading="lazy">
</div>
<div *ngIf="showCommision" class="uk-width-expand">
<div class="uk-flex uk-flex-top uk-flex-center">
<ng-container *ngTemplateOutlet="grant"></ng-container>
</div>
</div>
<!--img [src]="assetsPath + 'common/commission.jpg'" sizes="(min-width: 50px) 50px" data-width="427" data-height="285" class="el-image" alt="European Commission"-->
</div>
<!--<div *ngIf="showSocialButtons" id="footer#6" class="newsletter uk-margin uk-margin-remove-bottom uk-text-left@s uk-text-center uk-panel">
<a target="_blank" href="https://www.openaire.eu/newsletter/listing" class="el-link newsletter">
<h6 class="el-title uk-margin">
Newsletter
<span class="el-image uk-icon">
<svg width="20" height="20" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg">
<circle cx="3.12" cy="16.8" r="1.85"></circle>
<path fill="none" stroke="#000" stroke-width="1.1" d="M1.5,8.2 C1.78,8.18 2.06,8.16 2.35,8.16 C7.57,8.16 11.81,12.37 11.81,17.57 C11.81,17.89 11.79,18.19 11.76,18.5"></path>
<path fill="none" stroke="#000" stroke-width="1.1" d="M1.5,2.52 C1.78,2.51 2.06,2.5 2.35,2.5 C10.72,2.5 17.5,9.24 17.5,17.57 C17.5,17.89 17.49,18.19 17.47,18.5"></path>
</svg>
</span>
</h5>
</a>
</div>-->
</ng-container>
</div>
<div [class]="(!centered?'uk-grid uk-width-expand':'')">
<div *ngIf="showMenuItems" [class]="'uk-width-expand@m '+ (darkBackground?'uk-light':'')">
<div id="footer#7" class="uk-text-right@m uk-text-center">
<ul [class]="(centered?'uk-flex-center':'')
+' uk-subnav uk-margin-remove-bottom uk-subnav-divider'" uk-margin="">
<ng-container *ngFor="let submenu of menuItems">
<li class="el-item" *ngIf="isEnabled(submenu.routeRequired, showPage)">
<a *ngIf="submenu.route.length > 0" routerLink="{{submenu.route}}"
[queryParams]=submenu.params>{{submenu.title}}</a>
<a *ngIf="submenu.route.length == 0 && submenu.url.length > 0" href="{{submenu.url}}"
target="_blank">{{submenu.title}}</a>
</li>
</ng-container>
</ul>
<div [class.uk-hidden]="centered" class="uk-grid uk-width-expand" uk-grid>
<div *ngIf="showMenuItems" class="uk-width-expand">
<div class="uk-text-right uk-text-center">
<ul class="uk-nav uk-nav-default" uk-nav>
<ng-container *ngFor="let item of menuItems">
<li *ngIf="isEnabled(item.routeRequired, showPage)">
<a *ngIf="item.route.length > 0" routerLink="{{item.route}}"
[queryParams]=item.params>{{item.title}}</a>
<a *ngIf="item.route.length == 0 && item.url.length > 0" href="{{item.url}}"
target="_blank">{{item.title}}</a>
</li>
</ng-container>
</ul>
</div>
</div>
<ng-container *ngIf="!showMenuItems">
<div class="uk-width-1-3">
<div>
<h6>Dashboards</h6>
<ul class="uk-nav uk-nav-default" uk-nav>
<li><a
[href]="'https://'+(properties.environment =='beta' || properties.environment =='development'?'beta.':'')+'explore.openaire.eu'"
target="_blank">Explore</a></li>
<li><a
[href]="'https://'+(properties.environment =='beta' || properties.environment =='development'?'beta.':'')+'provide.openaire.eu'"
target="_blank">Provide</a></li>
<li><a
[href]="'https://'+(properties.environment =='beta' || properties.environment =='development'?'beta.':'')+'connect.openaire.eu'"
target="_blank">Connect</a></li>
<li><a
[href]="'https://'+(properties.environment =='beta' || properties.environment =='development'?'beta.':'')+'monitor.openaire.eu'"
target="_blank">Monitor</a></li>
<li><a href="https://graph.openaire.eu/develop/" target="_blank">Develop</a></li>
</ul>
</div>
</div>
<div class="uk-width-1-3">
<div>
<h6>Support</h6>
<ul class="uk-nav uk-nav-default" uk-nav>
<li><a target="_blank" href="https://www.openaire.eu/contact-noads">NOADs</a></li>
<li><a target="_blank" href="https://www.openaire.eu/guides">Guides</a></li>
<li><a target="_blank" href="https://www.openaire.eu/faqs">FAQs</a></li>
<li><a target="_blank" href="https://www.openaire.eu/frontpage/webinars">Webinars</a></li>
<li><a target="_blank" href="https://www.openaire.eu/support/helpdesk">Ask a question</a></li>
</ul>
</div>
</div>
<div class="uk-width-1-3">
<div class="">
<h6>Updates</h6>
<ul class="uk-nav uk-nav-default" uk-nav>
<li><a target="_blank" href="https://www.openaire.eu/news/">News</a></li>
<li><a target="_blank" href="https://www.openaire.eu/events">Events</a></li>
<li><a target="_blank" href="https://www.openaire.eu/blogs/magazine">Blogs</a></li>
<li><a target="_blank" href="https://www.openaire.eu/newsletters">Newsletter</a></li>
<li><a target="_blank" href="https://www.openaire.eu/public-documents">Documents</a></li>
</ul>
</div>
</div>
</ng-container>
</div>
</div>
<div *ngIf="!showMenuItems" id="footer#9" class="uk-width-expand@s uk-visible@m">
<div id="footer#10" class="uk-width-medium uk-text-left@s uk-text-center uk-panel">
<h6 class="el-title uk-h6">Dashboards</h6>
<ul class="uk-nav uk-nav-default uk-nav-parent-icon uk-nav-accordion" uk-nav="">
<li><a
[href]="'https://'+(properties.environment =='beta' || properties.environment =='development'?'beta.':'')+'explore.openaire.eu'"
target="_blank">Explore</a></li>
<li><a
[href]="'https://'+(properties.environment =='beta' || properties.environment =='development'?'beta.':'')+'provide.openaire.eu'"
target="_blank">Provide</a></li>
<li><a
[href]="'https://'+(properties.environment =='beta' || properties.environment =='development'?'beta.':'')+'connect.openaire.eu'"
target="_blank">Connect</a></li>
<li><a
[href]="'https://'+(properties.environment =='beta' || properties.environment =='development'?'beta.':'')+'monitor.openaire.eu'"
target="_blank">Monitor</a></li>
<li><a href="https://graph.openaire.eu/develop/" target="_blank">Develop</a></li>
</ul>
</div>
</div>
<div *ngIf="!showMenuItems" id="footer#11" class="uk-width-expand@s uk-visible@m">
<div id="footer#12" class="uk-width-medium uk-text-left@s uk-text-center uk-panel">
<h6>Support</h6>
<ul class="uk-nav uk-nav-default uk-nav-parent-icon uk-nav-accordion" uk-nav="">
<li><a target="_blank" href="https://www.openaire.eu/contact-noads">NOADs</a></li>
<li><a target="_blank" href="https://www.openaire.eu/guides">Guides</a></li>
<li><a target="_blank" href="https://www.openaire.eu/faqs">FAQs</a></li>
<li><a target="_blank" href="https://www.openaire.eu/frontpage/webinars">Webinars</a></li>
<li><a target="_blank" href="https://www.openaire.eu/support/helpdesk">Ask a question</a></li>
</ul>
</div>
</div>
<div *ngIf="!showMenuItems" id="footer#13" class="uk-width-expand@s uk-visible@m">
<div id="footer#14" class="uk-width-medium uk-text-left@s uk-text-center uk-panel">
<h6>Updates</h6>
<ul class="uk-nav uk-nav-default uk-nav-parent-icon uk-nav-accordion" uk-nav="">
<li><a target="_blank" href="https://www.openaire.eu/news/">News</a></li>
<li><a target="_blank" href="https://www.openaire.eu/events">Events</a></li>
<li><a target="_blank" href="https://www.openaire.eu/blogs/magazine">Blogs</a></li>
<li><a target="_blank" href="https://www.openaire.eu/newsletters">Newsletter</a></li>
<li><a target="_blank" href="https://www.openaire.eu/public-documents">Documents</a></li>
</ul>
<div *ngIf="showSocialButtons" class="uk-margin-medium-top uk-margin-medium-bottom uk-width-1-1">
<div class="uk-flex uk-flex-middle uk-flex-wrap" [class.uk-flex-center]="centered">
<div class="uk-grid uk-grid-small uk-width-auto@m uk-child-width-auto" uk-grid>
<div>
<a href="https://www.twitter.com/OpenAIRE_eu" target="_blank"
class="uk-icon-button uk-icon uk-icon-button-small twitter">
<icon name="twitter" [flex]="true" visuallyHidden="twitter"></icon>
</a>
</div>
<div>
<a href="https://www.facebook.com/groups/openaire/" target="_blank"
class="uk-icon-button uk-icon-button-small facebook">
<icon name="facebook" [flex]="true" visuallyHidden="facebook"></icon>
</a>
</div>
<div>
<a href="https://www.linkedin.com/groups/3893548/" target="_blank"
class="uk-icon-button uk-icon-button-small linkedin">
<icon name="linkedin" [flex]="true" visuallyHidden="linkedin"></icon>
</a>
</div>
<div>
<a href="https://www.slideshare.net/OpenAIRE_eu" target="_blank"
class="uk-icon-button uk-icon-button-small slideshare">
<icon name="slideshare" [flex]="true" visuallyHidden="slideshare"></icon>
</a>
</div>
<div>
<a href="https://www.youtube.com/channel/UChFYqizc-S6asNjQSoWuwjw" target="_blank"
class="uk-icon-button uk-icon-button-small youtube">
<icon name="youtube" [flex]="true" visuallyHidden="youtube"></icon>
</a>
</div>
</div>
<div class="uk-margin-large-left uk-width-auto">
<a target="_blank" class="uk-flex uk-flex-middle uk-link-text" href="https://www.openaire.eu/newsletters">
<span class="uk-text-large uk-text-bold">Newsletter</span>
<icon name="newsletter" class="uk-margin-small-left" [flex]="true"></icon>
</a>
</div>
</div>
</div>
</div>
</div>
<div *ngIf="showSocialButtons" class="uk-margin-medium uk-text-center uk-width-1-1">
<div [class]="(centered?'uk-flex-center':'uk-flex-left ') +
' uk-flex-middle uk-child-width-auto uk-grid-small uk-grid'" uk-grid>
<div>
<a href="https://www.twitter.com/OpenAIRE_eu" target="_blank"
class="uk-icon-button" style="background-color: #55ACEE;">
<svg width="20" height="20" fill="#fff" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg">
<path
d="M19,4.74 C18.339,5.029 17.626,5.229 16.881,5.32 C17.644,4.86 18.227,4.139 18.503,3.28 C17.79,3.7 17.001,4.009 16.159,4.17 C15.485,3.45 14.526,3 13.464,3 C11.423,3 9.771,4.66 9.771,6.7 C9.771,6.99 9.804,7.269 9.868,7.539 C6.795,7.38 4.076,5.919 2.254,3.679 C1.936,4.219 1.754,4.86 1.754,5.539 C1.754,6.82 2.405,7.95 3.397,8.61 C2.79,8.589 2.22,8.429 1.723,8.149 L1.723,8.189 C1.723,9.978 2.997,11.478 4.686,11.82 C4.376,11.899 4.049,11.939 3.713,11.939 C3.475,11.939 3.245,11.919 3.018,11.88 C3.49,13.349 4.852,14.419 6.469,14.449 C5.205,15.429 3.612,16.019 1.882,16.019 C1.583,16.019 1.29,16.009 1,15.969 C2.635,17.019 4.576,17.629 6.662,17.629 C13.454,17.629 17.17,12 17.17,7.129 C17.17,6.969 17.166,6.809 17.157,6.649 C17.879,6.129 18.504,5.478 19,4.74"></path>
</svg>
<span class="visually-hidden">twitter</span>
</a>
</div>
<div>
<a href="https://www.facebook.com/groups/openaire/" target="_blank"
class="uk-icon-button" style="background-color: #3A5998;">
<svg width="20" height="20" fill="#fff" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg">
<path
d="M11,10h2.6l0.4-3H11V5.3c0-0.9,0.2-1.5,1.5-1.5H14V1.1c-0.3,0-1-0.1-2.1-0.1C9.6,1,8,2.4,8,5v2H5.5v3H8v8h3V10z"></path>
</svg>
<span class="visually-hidden">facebook</span>
</a>
</div>
<div>
<a href="https://www.linkedin.com/groups/3893548/" target="_blank"
class="uk-icon-button" style="background-color: #1F88BE;">
<svg width="20" height="20" fill="#fff" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg">
<path
d="M5.77,17.89 L5.77,7.17 L2.21,7.17 L2.21,17.89 L5.77,17.89 L5.77,17.89 Z M3.99,5.71 C5.23,5.71 6.01,4.89 6.01,3.86 C5.99,2.8 5.24,2 4.02,2 C2.8,2 2,2.8 2,3.85 C2,4.88 2.77,5.7 3.97,5.7 L3.99,5.7 L3.99,5.71 L3.99,5.71 Z"></path>
<path
d="M7.75,17.89 L11.31,17.89 L11.31,11.9 C11.31,11.58 11.33,11.26 11.43,11.03 C11.69,10.39 12.27,9.73 13.26,9.73 C14.55,9.73 15.06,10.71 15.06,12.15 L15.06,17.89 L18.62,17.89 L18.62,11.74 C18.62,8.45 16.86,6.92 14.52,6.92 C12.6,6.92 11.75,7.99 11.28,8.73 L11.3,8.73 L11.3,7.17 L7.75,7.17 C7.79,8.17 7.75,17.89 7.75,17.89 L7.75,17.89 L7.75,17.89 Z"></path>
</svg>
<span class="visually-hidden">linkedin</span>
</a>
</div>
<div>
<a href="https://www.slideshare.net/OpenAIRE_eu" target="_blank"
class="uk-icon-button" style="background-color: #002E3C;">
<svg width="20" height="20" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg">
<line fill="#fff" stroke="#fff" stroke-width="1.1" x1="13.4" y1="14" x2="6.3" y2="10.7"></line>
<line fill="#fff" stroke="#fff" stroke-width="1.1" x1="13.5" y1="5.5" x2="6.5" y2="8.8"></line>
<circle fill="#fff" stroke="#fff" stroke-width="1.1" cx="15.5" cy="4.6" r="2.3"></circle>
<circle fill="#fff" stroke="#fff" stroke-width="1.1" cx="15.5" cy="14.8" r="2.3"></circle>
<circle fill="#fff" stroke="#fff" stroke-width="1.1" cx="4.5" cy="9.8" r="2.3"></circle>
</svg>
<span class="visually-hidden">slideshare</span>
</a>
</div>
<div>
<a href="https://www.youtube.com/channel/UChFYqizc-S6asNjQSoWuwjw" target="_blank"
class="uk-icon-button" style="background-color: #FF0312;">
<svg width="20" height="20" fill="#fff" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg">
<path
d="M15,4.1c1,0.1,2.3,0,3,0.8c0.8,0.8,0.9,2.1,0.9,3.1C19,9.2,19,10.9,19,12c-0.1,1.1,0,2.4-0.5,3.4c-0.5,1.1-1.4,1.5-2.5,1.6 c-1.2,0.1-8.6,0.1-11,0c-1.1-0.1-2.4-0.1-3.2-1c-0.7-0.8-0.7-2-0.8-3C1,11.8,1,10.1,1,8.9c0-1.1,0-2.4,0.5-3.4C2,4.5,3,4.3,4.1,4.2 C5.3,4.1,12.6,4,15,4.1z M8,7.5v6l5.5-3L8,7.5z"></path>
</svg>
<span class="visually-hidden">youtube</span>
</a>
</div>
<div class="uk-margin-large-left">
<a target="_blank" href="https://www.openaire.eu/newsletters">
<span class="uk-flex uk-flex-middle">
<span class="uk-text-large uk-text-bold">Newsletter</span>
<span class="uk-icon uk-margin-small-left">
<svg width="20" height="20" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg">
<circle cx="3.12" cy="16.8" r="1.85"></circle>
<path fill="none" stroke="#000" stroke-width="3"
d="M1.5,8.2 C1.78,8.18 2.06,8.16 2.35,8.16 C7.57,8.16 11.81,12.37 11.81,17.57 C11.81,17.89 11.79,18.19 11.76,18.5"></path>
<path fill="none" stroke="#000" stroke-width="3"
d="M1.5,2.52 C1.78,2.51 2.06,2.5 2.35,2.5 C10.72,2.5 17.5,9.24 17.5,17.57 C17.5,17.89 17.49,18.19 17.47,18.5"></path>
</svg>
</span>
</span>
</a>
</div>
</div>
<div class="uk-section uk-section-xsmall uk-container uk-container-large uk-position-relative">
<div class="uk-grid uk-flex-center uk-text-xsmall uk-text-emphasis" uk-grid>
<div class=" uk-flex uk-flex-top">
<a href="https://creativecommons.org/licenses/by/4.0/" rel="license" class="uk-link-reset">
<icon name="cc" [preserveColor]="true" visuallyHidden="Creative-Commons"></icon>
<icon name="by" [preserveColor]="true" visuallyHidden="Licence" class="uk-margin-xsmall-left"></icon>
</a>
<span class="uk-margin-small-left uk-width-expand">Unless otherwise indicated, all materials created by OpenAIRE are licenced under</span>
<a class="uk-link-text uk-margin-medium-left" href="http://creativecommons.org/licenses/by/4.0/" rel="license"><u>CC ATTRIBUTION 4.0 INTERNATIONALLICENSE</u></a>
</div>
</div>
<!-- </div>-->
<div class="uk-position-bottom-right uk-margin-bottom uk-margin-large-right">
<a href="#" class="uk-totop uk-display-block" uk-scroll>
<icon name="expand_less" ratio="1.5" [flex]="true" visuallyHidden="toTop"></icon>
</a>
</div>
</div>
</div>
</div>
<div [class]="sectionClass + ' uk-section uk-section-xsmall'">
<div class="uk-container uk-container-expand">
<div class="uk-grid-margin uk-grid" uk-grid="">
<div class="uk-width-small@m uk-first-column">
</div>
<div class="uk-width-expand@m">
<div id="footer#22" class=" uk-text-small uk-margin uk-margin-remove-bottom uk-text-center@m uk-text-center ">
<a href="http://creativecommons.org/licenses/by/4.0/" rel="license" class="license">
<svg *ngIf="darkBackground" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" width="24"
height="24" class=" uk-svg">
<title></title>
<g data-name="Creative Commons" id="Creative_Commons">
<circle cx="12" cy="12" r="11.5"
style="fill:none;stroke:#ffffff;stroke-linecap:round;stroke-linejoin:round"></circle>
<path d="M10.87,10a3.5,3.5,0,1,0,0,4"
style="fill:none;stroke:#ffffff;stroke-linecap:round;stroke-linejoin:round"></path>
<path d="M18.87,10a3.5,3.5,0,1,0,0,4"
style="fill:none;stroke:#ffffff;stroke-linecap:round;stroke-linejoin:round"></path>
</g>
</svg>
&nbsp;<svg *ngIf="!darkBackground" xmlns="http://www.w3.org/2000/svg" width="24" height="24"
viewBox="0 0 24 24">
<path id="creative-commons"
d="M9.7,14.675a1.311,1.311,0,0,1-1.15-.557,2.511,2.511,0,0,1-.391-1.477q0-2.032,1.541-2.034a1.36,1.36,0,0,1,.666.205,1.569,1.569,0,0,1,.605.718l1.541-.8A3.222,3.222,0,0,0,9.457,9.067a3.249,3.249,0,0,0-2.412.964,3.548,3.548,0,0,0-.957,2.61,3.562,3.562,0,0,0,.945,2.63,3.362,3.362,0,0,0,2.485.942,3.367,3.367,0,0,0,1.766-.481,3.408,3.408,0,0,0,1.254-1.326l-1.419-.718a1.44,1.44,0,0,1-1.416.987Zm6.634,0a1.312,1.312,0,0,1-1.15-.557,2.511,2.511,0,0,1-.391-1.477q0-2.032,1.541-2.034a1.389,1.389,0,0,1,.686.205,1.577,1.577,0,0,1,.608.718l1.519-.8a3.181,3.181,0,0,0-3.04-1.663,3.253,3.253,0,0,0-2.412.964,3.546,3.546,0,0,0-.955,2.61,3.576,3.576,0,0,0,.934,2.63,3.349,3.349,0,0,0,2.5.942,3.328,3.328,0,0,0,1.745-.481,3.54,3.54,0,0,0,1.274-1.326l-1.438-.718a1.441,1.441,0,0,1-1.416.987ZM21.156,4.12A11.61,11.61,0,0,0,12.624.64a11.436,11.436,0,0,0-8.44,3.48A11.738,11.738,0,0,0,.641,12.64,11.537,11.537,0,0,0,4.185,21.1a11.532,11.532,0,0,0,8.44,3.541,11.856,11.856,0,0,0,8.592-3.57,11.389,11.389,0,0,0,3.424-8.431,11.583,11.583,0,0,0-3.484-8.52Zm-1.5,15.391a9.631,9.631,0,0,1-7,2.94,9.479,9.479,0,0,1-6.938-2.911A9.422,9.422,0,0,1,2.8,12.64,9.57,9.57,0,0,1,5.747,5.68,9.3,9.3,0,0,1,12.655,2.8a9.4,9.4,0,0,1,6.94,2.88,9.411,9.411,0,0,1,2.884,6.96,9.157,9.157,0,0,1-2.823,6.87Z"
transform="translate(-0.641 -0.64)"/>
</svg>
{{' '}}
<svg *ngIf="darkBackground" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" width="24"
height="24" class=" uk-svg">
<title></title>
<g id="Attribution">
<g data-name="<Group>" id="_Group_">
<circle cx="12" cy="5" data-name="<Path>" id="_Path_" r="1.5"
style="fill:none;stroke:#ffffff;stroke-linecap:round;stroke-linejoin:round"></circle>
<path
d="M12,8a5,5,0,0,0-3.07.71,1,1,0,0,0-.43.83V15H10v5.5h4V15h1.5V9.54a1,1,0,0,0-.43-.83A5,5,0,0,0,12,8Z"
data-name="<Path>" id="_Path_2"
style="fill:none;stroke:#ffffff;stroke-linecap:round;stroke-linejoin:round"></path>
</g>
<circle cx="12" cy="12" r="11.5"
style="fill:none;stroke:#ffffff;stroke-linecap:round;stroke-linejoin:round"></circle>
</g>
</svg>
<svg *ngIf="!darkBackground" xmlns="http://www.w3.org/2000/svg" width="24" height="24"
viewBox="0 0 24 24">
<g id="Group_756" data-name="Group 756" transform="translate(0)">
<path id="Path_2324" data-name="Path 2324"
d="M18.325,11.98a.775.775,0,0,0-.775-.775H12.641a.775.775,0,0,0-.775.775v4.909h1.369V22.7h3.719V16.889h1.37V11.98Z"
transform="translate(-3.095 -2.951)"/>
<path id="Path_2325" data-name="Path 2325"
d="M17.209,7.759A1.679,1.679,0,1,1,15.53,6.08,1.679,1.679,0,0,1,17.209,7.759Z"
transform="translate(-3.529 -1.83)"/>
<path id="Path_2326" data-name="Path 2326"
d="M12.624.64A11.439,11.439,0,0,0,4.183,4.12,11.736,11.736,0,0,0,.639,12.64,11.537,11.537,0,0,0,4.183,21.1a11.531,11.531,0,0,0,8.441,3.54,11.851,11.851,0,0,0,8.591-3.57,11.383,11.383,0,0,0,3.424-8.43,11.582,11.582,0,0,0-3.484-8.52,11.612,11.612,0,0,0-8.53-3.48Zm.03,2.159a9.4,9.4,0,0,1,6.939,2.88,9.414,9.414,0,0,1,2.883,6.96,9.156,9.156,0,0,1-2.823,6.87,9.63,9.63,0,0,1-7,2.94,9.48,9.48,0,0,1-6.939-2.91A9.425,9.425,0,0,1,2.8,12.64,9.573,9.573,0,0,1,5.746,5.68,9.3,9.3,0,0,1,12.654,2.8Z"
transform="translate(-0.639 -0.64)"/>
</g>
</svg>
<span class="visually-hidden">license</span>
</a>
&nbsp;Unless otherwise indicated, all materials created by OpenAIRE are licenced under&nbsp;<a
href="http://creativecommons.org/licenses/by/4.0/" rel="license">CC ATTRIBUTION 4.0 INTERNATIONAL
LICENSE</a>.
<div class="uk-hidden@m">
<div [ngClass]="background">
<div class="uk-section uk-padding-remove-bottom">
<div class="uk-container" [class.uk-container-expand]="!centered" [class.uk-container-small]="centered">
<div class="uk-grid" [class.uk-flex-center]="centered" uk-grid>
<div *ngIf="properties.footerGrantText || (divContents && divContents['footer']?.length > 0)"
class="uk-width-1-1" [attr.uk-grid]="centered?'':null" [class.uk-grid]="centered">
<div *ngIf="showOpenaire" class="uk-text-center uk-margin-bottom uk-width-1-1">
<img [src]="assetsPath + 'common/Logo_Horizontal.png'"
width="140px"
height="50px" class="el-image" alt="OpenAIRE" loading="lazy">
</div>
<div *ngIf="showCommision" class="uk-width-expand">
<div class="uk-flex uk-flex-top uk-flex-center">
<ng-container *ngTemplateOutlet="grant"></ng-container>
</div>
</div>
</div>
<div *ngIf="showSocialButtons" class="uk-margin-medium-top uk-margin-medium-bottom uk-width-1-1">
<div class="uk-flex uk-flex-middle uk-flex-center uk-flex-wrap">
<div class="uk-grid uk-grid-small uk-flex-center uk-width-1-1 uk-child-width-auto" uk-grid>
<div>
<a href="https://www.twitter.com/OpenAIRE_eu" target="_blank"
class="uk-icon-button uk-icon uk-icon-button-small twitter">
<icon name="twitter" [flex]="true" visuallyHidden="twitter"></icon>
</a>
</div>
<div>
<a href="https://www.facebook.com/groups/openaire/" target="_blank"
class="uk-icon-button uk-icon-button-small facebook">
<icon name="facebook" [flex]="true" visuallyHidden="facebook"></icon>
</a>
</div>
<div>
<a href="https://www.linkedin.com/groups/3893548/" target="_blank"
class="uk-icon-button uk-icon-button-small linkedin">
<icon name="linkedin" [flex]="true" visuallyHidden="linkedin"></icon>
</a>
</div>
<div>
<a href="https://www.slideshare.net/OpenAIRE_eu" target="_blank"
class="uk-icon-button uk-icon-button-small slideshare">
<icon name="slideshare" [flex]="true" visuallyHidden="slideshare"></icon>
</a>
</div>
<div>
<a href="https://www.youtube.com/channel/UChFYqizc-S6asNjQSoWuwjw" target="_blank"
class="uk-icon-button uk-icon-button-small youtube">
<icon name="youtube" [flex]="true" visuallyHidden="youtube"></icon>
</a>
</div>
</div>
<div class="uk-margin-medium-top uk-width-auto">
<a target="_blank" class="uk-flex uk-flex-middle uk-link-text" href="https://www.openaire.eu/newsletters">
<span class="uk-text-large uk-text-bold">Newsletter</span>
<icon name="newsletter" class="uk-margin-small-left" [flex]="true"></icon>
</a>
</div>
</div>
</div>
</div>
</div>
<div class="uk-width-small@m">
<div class="uk-margin uk-margin-remove-top uk-margin-remove-bottom uk-text-right@m uk-text-center">
<a href="#" uk-totop="" uk-scroll="" class="uk-totop uk-icon">
<span class="visually-hidden">To top</span>
</div>
<div class="uk-section uk-section-xsmall uk-container uk-container-large uk-position-relative">
<div class="uk-grid uk-flex-center uk-text-xsmall uk-text-emphasis" uk-grid>
<div class=" uk-flex uk-flex-top">
<a href="https://creativecommons.org/licenses/by/4.0/" rel="license" class="uk-link-reset">
<icon name="cc" [preserveColor]="true" visuallyHidden="Creative-Commons"></icon>
<icon name="by" [preserveColor]="true" visuallyHidden="Licence" class="uk-margin-xsmall-left"></icon>
</a>
<span class="uk-margin-small-left uk-width-expand">Unless otherwise indicated, all materials created by OpenAIRE are licenced under</span>
</div>
<div class="uk-width-1-1 uk-text-center">
<a class="uk-link-text" href="http://creativecommons.org/licenses/by/4.0/" rel="license"><u>CC ATTRIBUTION 4.0 INTERNATIONALLICENSE</u></a>
</div>
</div>
<div class="uk-margin-top uk-flex uk-flex-center">
<a href="#" class="uk-totop" uk-scroll>
<icon name="expand_less" ratio="1.5" [flex]="true" visuallyHidden="toTop"></icon>
</a>
</div>
</div>
</div>

116
sharedComponents/bottom.component.ts
View File

@ -1,8 +1,8 @@
import { Component, Input } from '@angular/core';
import {Component, Input} from '@angular/core';
import {ActivatedRoute} from '@angular/router';
import 'rxjs';
import{MenuItem} from './menu';
import { ConfigurationService } from '../utils/configuration/configuration.service';
import {MenuItem} from './menu';
import {ConfigurationService} from '../utils/configuration/configuration.service';
import {EnvProperties} from "../utils/properties/env-properties";
import {Subscription} from "rxjs";
import {properties} from '../../../environments/environment';
@ -13,81 +13,71 @@ import {HelperService} from "../utils/helper/helper.service";
templateUrl: 'bottom.component.html'
})
export class BottomComponent {
@Input() showSocialButtons:boolean = true;
@Input() showOpenaire:boolean = true;
@Input() showMenuItems:boolean = false;
@Input() showCommision:boolean = true;
@Input() assetsPath:string ='assets/common-assets/';
@Input() menuItems:MenuItem [];
@Input() communityId;
// @Input() environment:string = "beta";
showPage ={};
@Input() grantAdvance:boolean = true;
// grantAdvanceText = "OpenAIRE-Advance receives funding from the European Union's Horizon 2020 Research and Innovation programme under Grant Agreement No. 777541.";
// grantConenctText = "OpenAIRE-Connect receives funding from the European Union's Horizon 2020 Research and Innovation programme under grant agreement No. 731011 and No. 777541.";
@Input() properties:EnvProperties = properties;
@Input() darkBackground:boolean=true;
@Input() centered:boolean=false;
@Input() shortView: boolean = false;
sectionClass= "uk-tile-default";
subs: Subscription[] = [];
public divContents = null;
constructor(private config: ConfigurationService, private route: ActivatedRoute,
private helper: HelperService) {
}
@Input() showSocialButtons: boolean = true;
@Input() showOpenaire: boolean = true;
@Input() showMenuItems: boolean = false;
@Input() showCommision: boolean = true;
@Input() assetsPath: string = 'assets/common-assets/';
@Input() menuItems: MenuItem [];
@Input() communityId;
showPage = {};
@Input() grantAdvance: boolean = true;
@Input() properties: EnvProperties = properties;
@Input() centered: boolean = false;
@Input() shortView: boolean = false;
@Input() background: string = "uk-tile-default";
subs: Subscription[] = [];
public divContents = null;
constructor(private config: ConfigurationService, private route: ActivatedRoute,
private helper: HelperService) {
}
ngOnInit() {
if(!properties.footerGrantText) {
this.getDivContents();
}
if(!this.darkBackground){
this.sectionClass= " footer-light-background";
}
this.subs.push(this.route.queryParams.subscribe(params => {
if(this.showMenuItems){
if( this.properties.adminToolsAPIURL && this.communityId ){
//this.subs.push(this.config.getCommunityInformation(this.properties, this.communityId ).subscribe(data => {
this.subs.push(this.config.communityInformationState.subscribe(data => {
if(data) {
for (var i = 0; i < data['pages'].length; i++) {
this.showPage[data['pages'][i]["route"]] = data['pages'][i]["isEnabled"];
}
// console.log(this.showPage)
}
}));
}
if (!properties.footerGrantText) {
this.getDivContents();
}
}));
this.subs.push(this.route.queryParams.subscribe(params => {
if (this.showMenuItems) {
if (this.properties.adminToolsAPIURL && this.communityId) {
//this.subs.push(this.config.getCommunityInformation(this.properties, this.communityId ).subscribe(data => {
this.subs.push(this.config.communityInformationState.subscribe(data => {
if (data) {
for (var i = 0; i < data['pages'].length; i++) {
this.showPage[data['pages'][i]["route"]] = data['pages'][i]["isEnabled"];
}
// console.log(this.showPage)
}
}));
}
}
}));
}
public ngOnDestroy() {
for (let sub of this.subs) {
sub.unsubscribe();
}
}
isEnabled(required, enabled){
if(!required ){
isEnabled(required, enabled) {
if (!required) {
return true;
}
for(let requiredEntity of required){
for (let requiredEntity of required) {
// console.log("R "+requiredEntity +" E " + enabled[requiredEntity])
if(typeof enabled[requiredEntity] === "undefined" || enabled[requiredEntity] == false){
return false;
}
if (typeof enabled[requiredEntity] === "undefined" || enabled[requiredEntity] == false) {
return false;
}
}
return true;
}
private getDivContents() {
let communityId = this.communityId;
if(!communityId) {
let communityId = this.communityId;
if (!communityId) {
communityId = properties.adminToolsCommunity;
}
this.subs.push(this.helper.getDivHelpContents(this.properties, communityId, "/").subscribe(contents => {

25
sharedComponents/bottom.module.ts
View File

@ -1,22 +1,25 @@
import { NgModule } from '@angular/core';
import { CommonModule } from '@angular/common';
import { FormsModule } from '@angular/forms';
import { RouterModule } from "@angular/router";
import {NgModule} from '@angular/core';
import {CommonModule} from '@angular/common';
import {FormsModule} from '@angular/forms';
import {RouterModule} from "@angular/router";
import {BottomComponent} from './bottom.component';
import {HelperModule} from "../utils/helper/helper.module";
import {IconsModule} from "../utils/icons/icons.module";
import {IconsService} from "../utils/icons/icons.service";
import {by, cc, facebook, linkedin, newsletter, slideshare, twitter, youtube} from "../utils/icons/icons";
@NgModule({
imports: [
CommonModule, FormsModule, RouterModule, HelperModule
CommonModule, FormsModule, RouterModule, HelperModule, IconsModule
],
declarations: [
BottomComponent
],
exports: [
BottomComponent
]
exports: [BottomComponent]
})
export class BottomModule{ }
export class BottomModule{
constructor(private iconsService: IconsService) {
this.iconsService.registerIcons([by, cc, twitter, facebook, linkedin, slideshare, youtube, newsletter]);
}
}

32
utils/icons/icons-preview/icons-preview.component.ts
View File

@ -54,6 +54,38 @@ import {Component} from "@angular/core";
<icon name="mining"></icon>
<div class="uk-text-bold uk-margin-small-top">mining</div>
</div>
<div class="uk-text-center">
<icon name="by"></icon>
<div class="uk-text-bold uk-margin-small-top">by</div>
</div>
<div class="uk-text-center">
<icon name="cc"></icon>
<div class="uk-text-bold uk-margin-small-top">cc</div>
</div>
<div class="uk-text-center">
<icon name="twitter"></icon>
<div class="uk-text-bold uk-margin-small-top">twitter</div>
</div>
<div class="uk-text-center">
<icon name="facebook"></icon>
<div class="uk-text-bold uk-margin-small-top">facebook</div>
</div>
<div class="uk-text-center">
<icon name="linkedin"></icon>
<div class="uk-text-bold uk-margin-small-top">linkedin</div>
</div>
<div class="uk-text-center">
<icon name="slideshare"></icon>
<div class="uk-text-bold uk-margin-small-top">slideshare</div>
</div>
<div class="uk-text-center">
<icon name="youtube"></icon>
<div class="uk-text-bold uk-margin-small-top">youtube</div>
</div>
<div class="uk-text-center">
<icon name="newsletter"></icon>
<div class="uk-text-bold uk-margin-small-top">newsletter</div>
</div>
</div>
<div class="uk-margin-medium-top">
<h4 class="uk-text-bold">Usage</h4>

6
utils/icons/icons-preview/icons-preview.module.ts
View File

@ -15,7 +15,9 @@ import {
orcid_add,
orcid_bin,
quotes,
restricted
restricted,
by,
cc, twitter, facebook, linkedin, slideshare, youtube, newsletter
} from "../icons";
@NgModule({
@ -27,6 +29,6 @@ import {
})
export class IconsPreviewModule {
constructor(private iconsService: IconsService) {
this.iconsService.registerIcons([book, database, cog, earth, incognito, restricted, graph, filters, orcid_add, orcid_bin, link, quotes, mining])
this.iconsService.registerIcons([book, database, cog, earth, incognito, restricted, graph, filters, orcid_add, orcid_bin, link, quotes, mining, by, cc, twitter, facebook, linkedin, slideshare, youtube, newsletter])
}
}

4
utils/icons/icons.component.ts
View File

@ -46,7 +46,7 @@ export interface StopRule {
@Component({
selector: 'icon',
template: `
<span #icon *ngIf="svg" class="uk-icon" [class.uk-preserve]="gradient" [class.uk-flex]="flex" [ngClass]="customClass" [ngStyle]="style" [innerHTML]="svg | safeHtml"></span>
<span #icon *ngIf="svg" class="uk-icon" [class.uk-preserve]="gradient || preserveColor" [class.uk-flex]="flex" [ngClass]="customClass" [ngStyle]="style" [innerHTML]="svg | safeHtml"></span>
<span *ngIf="!svg && iconName" [class.uk-flex]="flex" [ngClass]="customClass" [class.uk-display-inline-block]="!flex">
<span class="material-icons" [ngClass]="type" [ngStyle]="style">{{iconName}}</span>
</span>
@ -125,6 +125,8 @@ export class IconsComponent implements AfterViewInit, OnChanges {
public stopRules: StopRule[]= [{class: 'start', offset: 0}, {class: 'end', offset: 100}];
@ViewChild("icon")
public icon: ElementRef;
@Input()
public preserveColor: boolean = false;
constructor(private iconsService: IconsService,
private cdr: ChangeDetectorRef) {}

194
utils/icons/icons.ts
View File

@ -3,30 +3,6 @@ export interface Icon {
data: string
}
/** @deprecated */
export const arrow_left: Icon = {
name: 'arrow_left',
data: '<svg xmlns="http://www.w3.org/2000/svg" height="20" viewBox="0 0 24 24" width="20"><path d="M20 11H6.83l2.88-2.88c.39-.39.39-1.02 0-1.41-.39-.39-1.02-.39-1.41 0L3.71 11.3c-.39.39-.39 1.02 0 1.41L8.3 17.3c.39.39 1.02.39 1.41 0 .39-.39.39-1.02 0-1.41L6.83 13H20c.55 0 1-.45 1-1s-.45-1-1-1z"/></svg>'
}
/** @deprecated */
export const arrow_right: Icon = {
name: 'arrow_right',
data: '<svg height="20" viewBox="0 0 16 16" width="20" xmlns="http://www.w3.org/2000/svg"><path d="M12.578,4.244,5.667,11.155V8.167A.833.833,0,1,0,4,8.167v5A.832.832,0,0,0,4.833,14h5a.833.833,0,0,0,0-1.667H6.845l6.911-6.911a.833.833,0,1,0-1.178-1.178h0Z" transform="translate(7.071 19.799) rotate(-135)"></path></svg>'
};
/** @deprecated */
export const arrow_up: Icon = {
name: 'arrow_up',
data: '<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 17.155 17.155"><g transform="translate(0)"><path d="M10.405,11.834,2.022,3.451V7.076A1.011,1.011,0,0,1,0,7.076V1.011A1.009,1.009,0,0,1,1.011,0H7.076a1.011,1.011,0,1,1,0,2.022H3.451l8.383,8.383a1.011,1.011,0,1,1-1.429,1.429h0Z" transform="translate(8.578 0) rotate(45)"/></g></svg>'
}
/** @deprecated */
export const arrow_down: Icon = {
name: 'arrow_down',
data: '<svg height="20" viewBox="0 0 17.155 17.155" width="20" xmlns="http://www.w3.org/2000/svg"><g transform="translate(-1221 -675)"><path d="M14.405,4.3,6.022,12.68V9.055A1.011,1.011,0,0,0,4,9.055V15.12a1.009,1.009,0,0,0,1.011,1.01h6.065a1.011,1.011,0,1,0,0-2.022H7.451l8.383-8.383A1.011,1.011,0,0,0,14.405,4.3h0Z" transform="translate(1215.343 683.578) rotate(-45)"></path></g></svg>'
}
export const book: Icon = {
name: 'book',
data: '<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 22.106 30"><path id="book" d="M26.9,9.405V25.749c0,.824-.713,1.218-1.579,1.832a1.034,1.034,0,0,1-1.579-.927V10.685a.877.877,0,0,0-.5-.845c-.379-.194-12.218-6.418-12.218-6.418A2.239,2.239,0,0,0,8.9,3.4,4.487,4.487,0,0,0,7.119,4.808l12.916,7.077a.917.917,0,0,1,.555.815V29.755a1.057,1.057,0,0,1-.582.924,1.209,1.209,0,0,1-1.136-.042c-.339-.207-12.274-7.526-13.063-8-.379-.227-.823-.693-.832-1.039L4.8,5.355a2.612,2.612,0,0,1,.456-1.629c1.1-1.711,4.94-3.658,6.884-2.65L26.348,8.268A1.151,1.151,0,0,1,26.9,9.405Z" transform="translate(-4.799 -0.8)"/></svg>'
@ -47,137 +23,6 @@ export const earth: Icon = {
data: '<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 30 30"><path id="earth" d="M15,0A15,15,0,1,0,30,15,15,15,0,0,0,15,0Zm0,28.125a13.086,13.086,0,0,1-5.192-1.068l6.831-7.685a.935.935,0,0,0,.237-.622V15.938A.938.938,0,0,0,15.938,15c-3.31,0-6.8-3.442-6.837-3.475a.937.937,0,0,0-.663-.275H4.688a.938.938,0,0,0-.937.937v5.625a.936.936,0,0,0,.518.838L7.5,20.267v5.5A13.132,13.132,0,0,1,3.14,9.375H6.563A.935.935,0,0,0,7.226,9.1l3.75-3.75a.937.937,0,0,0,.275-.663V2.42a13.164,13.164,0,0,1,9.5.779c-.122.1-.24.21-.353.323a5.626,5.626,0,0,0,3.974,9.6c.093,0,.186,0,.278-.007A22.007,22.007,0,0,1,24.4,24.027a.878.878,0,0,0-.024.153A13.084,13.084,0,0,1,15,28.125Z"/></svg>'
}
/** @deprecated */
export const edit: Icon = {
name: 'edit',
data: '<svg xmlns="http://www.w3.org/2000/svg" height="20" viewBox="0 0 24 24" width="20"><path d="M0 0h24v24H0V0z" fill="none"/><path d="M3 17.46v3.04c0 .28.22.5.5.5h3.04c.13 0 .26-.05.35-.15L17.81 9.94l-3.75-3.75L3.15 17.1c-.1.1-.15.22-.15.36zM20.71 7.04c.39-.39.39-1.02 0-1.41l-2.34-2.34c-.39-.39-1.02-.39-1.41 0l-1.83 1.83 3.75 3.75 1.83-1.83z"/></svg>'
}
/** @deprecated
*
* Use delete
* */
export const remove: Icon = {
name: 'remove',
data: '<svg xmlns="http://www.w3.org/2000/svg" height="20" width="20" viewBox="0 0 9.91 11.01"><g id="Layer_2" data-name="Layer 2"><g id="Layer_1-2" data-name="Layer 1"><path d="M8.83,1.85V9.41A1.58,1.58,0,0,1,7.26,11H2.62a1.6,1.6,0,0,1-1.57-1.6V1.85H.28A.26.26,0,0,1,0,1.57.27.27,0,0,1,.28,1.3H2.59v-1A.26.26,0,0,1,2.87,0H7a.28.28,0,0,1,.27.28v1H9.63a.28.28,0,0,1,.28.27.3.3,0,0,1-.28.28Zm-7.23,0V9.41a1,1,0,0,0,1,1.05H7.26a1,1,0,0,0,1-1.05V1.85ZM6.76,1.3V.55H3.15V1.3Z"/><path class="cls-1" d="M3.06,3.73a.28.28,0,0,1,.28-.28.29.29,0,0,1,.27.28V8.58a.29.29,0,0,1-.27.28.28.28,0,0,1-.28-.28Z"/><path class="cls-1" d="M6.29,3.73a.28.28,0,0,1,.28-.28.29.29,0,0,1,.27.28V8.58a.29.29,0,0,1-.27.28.28.28,0,0,1-.28-.28Z"/><path class="cls-1" d="M4.66,3.73a.3.3,0,0,1,.28-.28.29.29,0,0,1,.28.28V8.58a.29.29,0,0,1-.28.28.3.3,0,0,1-.28-.28Z"/></g></g></svg>'
}
/** @deprecated
* Use visibility
* */
export const preview: Icon = {
name: 'preview',
data: '<svg xmlns="http://www.w3.org/2000/svg" height="24" viewBox="0 0 24 24" width="24"><path d="M0 0h24v24H0z" fill="none"/><path d="M12 4.5C7 4.5 2.73 7.61 1 12c1.73 4.39 6 7.5 11 7.5s9.27-3.11 11-7.5c-1.73-4.39-6-7.5-11-7.5zM12 17c-2.76 0-5-2.24-5-5s2.24-5 5-5 5 2.24 5 5-2.24 5-5 5zm0-8c-1.66 0-3 1.34-3 3s1.34 3 3 3 3-1.34 3-3-1.34-3-3-3z"/></svg>'
}
/** @deprecated */
export const bullet: Icon = {
name: 'bullet',
data: '<svg xmlns="http://www.w3.org/2000/svg" height="20" viewBox="0 0 24 24" width="20"><path d="M0 0h24v24H0z" fill="none"/><circle cx="12" cy="12" r="10"/></svg>'
}
/** @deprecated */
export const remove_circle = {
name: 'remove_circle',
data: '<svg xmlns="http://www.w3.org/2000/svg" enable-background="new 0 0 24 24" height="20" viewBox="0 0 24 24" width="20"><g><path d="M0,0h24v24H0V0z" fill="none"/></g><g><path d="M12,2C6.47,2,2,6.47,2,12c0,5.53,4.47,10,10,10s10-4.47,10-10C22,6.47,17.53,2,12,2z M16.29,14.89 c0.39,0.39,0.39,1.02,0,1.41c-0.39,0.39-1.02,0.39-1.41,0L12,13.41l-2.89,2.89c-0.39,0.39-1.02,0.39-1.41,0 c-0.39-0.39-0.39-1.02,0-1.41L10.59,12L7.71,9.11c-0.39-0.39-0.39-1.02,0-1.41c0.39-0.39,1.02-0.39,1.41,0L12,10.59l2.89-2.89 c0.39-0.39,1.02-0.39,1.41,0c0.39,0.39,0.39,1.02,0,1.41L13.41,12L16.29,14.89z"/></g></svg>'
}
/** @deprecated */
export const remove_circle_outline = {
name: 'remove_circle_outline',
data: '<svg xmlns="http://www.w3.org/2000/svg" height="20" viewBox="0 0 24 24" width="20"><path d="M0 0h24v24H0V0z" fill="none" opacity=".87"/><path d="M12 2C6.47 2 2 6.47 2 12s4.47 10 10 10 10-4.47 10-10S17.53 2 12 2zm0 18c-4.41 0-8-3.59-8-8s3.59-8 8-8 8 3.59 8 8-3.59 8-8 8zm3.59-13L12 10.59 8.41 7 7 8.41 10.59 12 7 15.59 8.41 17 12 13.41 15.59 17 17 15.59 13.41 12 17 8.41z"/></svg>'
}
/** @deprecated */
export const person_add = {
name: 'person_add',
data: '<svg xmlns="http://www.w3.org/2000/svg" height="20" viewBox="0 0 24 24" width="20"><path d="M0 0h24v24H0z" fill="none"/><path d="M15 12c2.21 0 4-1.79 4-4s-1.79-4-4-4-4 1.79-4 4 1.79 4 4 4zm-9-2V7H4v3H1v2h3v3h2v-3h3v-2H6zm9 4c-2.67 0-8 1.34-8 4v2h16v-2c0-2.66-5.33-4-8-4z"/></svg>'
}
/** @deprecated */
export const cloud_upload = {
name: 'cloud_upload',
data: '<svg xmlns="http://www.w3.org/2000/svg" height="20" viewBox="0 0 24 24" width="20"><path d="M0 0h24v24H0V0z" fill="none"/><path d="M19.35 10.04C18.67 6.59 15.64 4 12 4 9.11 4 6.6 5.64 5.35 8.04 2.34 8.36 0 10.91 0 14c0 3.31 2.69 6 6 6h13c2.76 0 5-2.24 5-5 0-2.64-2.05-4.78-4.65-4.96zM14 13v4h-4v-4H7l4.65-4.65c.2-.2.51-.2.71 0L17 13h-3z"/></svg>'
}
/** @deprecated */
export const add = {
name: 'add',
data: '<svg xmlns="http://www.w3.org/2000/svg" height="20" viewBox="0 0 24 24" width="20"><path d="M0 0h24v24H0V0z" fill="none"/><path d="M18 13h-5v5c0 .55-.45 1-1 1s-1-.45-1-1v-5H6c-.55 0-1-.45-1-1s.45-1 1-1h5V6c0-.55.45-1 1-1s1 .45 1 1v5h5c.55 0 1 .45 1 1s-.45 1-1 1z"/></svg>'
}
/** @deprecated */
export const group = {
name: 'group',
data: '<svg xmlns="http://www.w3.org/2000/svg" height="20" viewBox="0 0 24 24" width="20"><path d="M0 0h24v24H0V0z" fill="none"/><path d="M16 11c1.66 0 2.99-1.34 2.99-3S17.66 5 16 5s-3 1.34-3 3 1.34 3 3 3zm-8 0c1.66 0 2.99-1.34 2.99-3S9.66 5 8 5 5 6.34 5 8s1.34 3 3 3zm0 2c-2.33 0-7 1.17-7 3.5V18c0 .55.45 1 1 1h12c.55 0 1-.45 1-1v-1.5c0-2.33-4.67-3.5-7-3.5zm8 0c-.29 0-.62.02-.97.05.02.01.03.03.04.04 1.14.83 1.93 1.94 1.93 3.41V18c0 .35-.07.69-.18 1H22c.55 0 1-.45 1-1v-1.5c0-2.33-4.67-3.5-7-3.5z"/></svg>'
}
/** @deprecated */
export const lock = {
name: 'lock',
data: '<svg xmlns="http://www.w3.org/2000/svg" height="20" viewBox="0 0 24 24" width="20"><g fill="none"><path d="M0 0h24v24H0V0z"/><path d="M0 0h24v24H0V0z" opacity=".87"/></g><path d="M18 8h-1V6c0-2.76-2.24-5-5-5S7 3.24 7 6v2H6c-1.1 0-2 .9-2 2v10c0 1.1.9 2 2 2h12c1.1 0 2-.9 2-2V10c0-1.1-.9-2-2-2zm-6 9c-1.1 0-2-.9-2-2s.9-2 2-2 2 .9 2 2-.9 2-2 2zM9 8V6c0-1.66 1.34-3 3-3s3 1.34 3 3v2H9z"/></svg>'
}
/** @deprecated */
export const search = {
name: 'search',
data: '<svg xmlns="http://www.w3.org/2000/svg" height="20" viewBox="0 0 24 24" width="20"><path d="M0 0h24v24H0V0z" fill="none"/><path d="M15.5 14h-.79l-.28-.27c1.2-1.4 1.82-3.31 1.48-5.34-.47-2.78-2.79-5-5.59-5.34-4.23-.52-7.79 3.04-7.27 7.27.34 2.8 2.56 5.12 5.34 5.59 2.03.34 3.94-.28 5.34-1.48l.27.28v.79l4.25 4.25c.41.41 1.08.41 1.49 0 .41-.41.41-1.08 0-1.49L15.5 14zm-6 0C7.01 14 5 11.99 5 9.5S7.01 5 9.5 5 14 7.01 14 9.5 11.99 14 9.5 14z"/></svg>'
}
/** @deprecated */
export const refresh = {
name: 'refresh',
data: '<svg xmlns="http://www.w3.org/2000/svg" height="20" viewBox="0 0 24 24" width="20"><path d="M0 0h24v24H0z" fill="none"/><path d="M17.65 6.35C16.2 4.9 14.21 4 12 4c-4.42 0-7.99 3.58-7.99 8s3.57 8 7.99 8c3.73 0 6.84-2.55 7.73-6h-2.08c-.82 2.33-3.04 4-5.65 4-3.31 0-6-2.69-6-6s2.69-6 6-6c1.66 0 3.14.69 4.22 1.78L13 11h7V4l-2.35 2.35z"/></svg>'
}
/** @deprecated */
export const close = {
name: 'close',
data: '<svg xmlns="http://www.w3.org/2000/svg" height="20" viewBox="0 0 24 24" width="20"><path d="M0 0h24v24H0V0z" fill="none"/><path d="M18.3 5.71c-.39-.39-1.02-.39-1.41 0L12 10.59 7.11 5.7c-.39-.39-1.02-.39-1.41 0-.39.39-.39 1.02 0 1.41L10.59 12 5.7 16.89c-.39.39-.39 1.02 0 1.41.39.39 1.02.39 1.41 0L12 13.41l4.89 4.89c.39.39 1.02.39 1.41 0 .39-.39.39-1.02 0-1.41L13.41 12l4.89-4.89c.38-.38.38-1.02 0-1.4z"/></svg>'
}
/** @deprecated */
export const done = {
name: 'done',
data: '<svg xmlns="http://www.w3.org/2000/svg" height="20" viewBox="0 0 24 24" width="20"><path d="M0 0h24v24H0z" fill="none"/><path d="M9 16.2L4.8 12l-1.4 1.4L9 19 21 7l-1.4-1.4L9 16.2z"/></svg>'
}
/** @deprecated */
export const mail = {
name: 'mail',
data: '<svg xmlns="http://www.w3.org/2000/svg" height="20" viewBox="0 0 24 24" width="20"><path d="M0 0h24v24H0z" fill="none"/><path d="M20 4H4c-1.1 0-1.99.9-1.99 2L2 18c0 1.1.9 2 2 2h16c1.1 0 2-.9 2-2V6c0-1.1-.9-2-2-2zm0 4l-8 5-8-5V6l8 5 8-5v2z"/></svg>'
}
/** @deprecated */
export const photo = {
name: 'photo',
data: '<svg xmlns="http://www.w3.org/2000/svg" height="20" viewBox="0 0 24 24" width="20"><path d="M0 0h24v24H0z" fill="none"/><circle cx="12" cy="12" r="3.2"/><path d="M9 2L7.17 4H4c-1.1 0-2 .9-2 2v12c0 1.1.9 2 2 2h16c1.1 0 2-.9 2-2V6c0-1.1-.9-2-2-2h-3.17L15 2H9zm3 15c-2.76 0-5-2.24-5-5s2.24-5 5-5 5 2.24 5 5-2.24 5-5 5z"/></svg>'
}
/** @deprecated */
export const check_circle_outlined = {
name: 'check_circle_outlined',
data: '<svg xmlns="http://www.w3.org/2000/svg" height="20" viewBox="0 0 24 24" width="20"><path d="M0 0h24v24H0V0zm0 0h24v24H0V0z" fill="none"/><path d="M16.59 7.58L10 14.17l-3.59-3.58L5 12l5 5 8-8zM12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm0 18c-4.42 0-8-3.58-8-8s3.58-8 8-8 8 3.58 8 8-3.58 8-8 8z"/></svg>'
}
/** @deprecated */
export const reset = {
name: 'reset',
data: '<svg width="20" height="20" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg"><polyline fill="#000" points="1 2 2 2 2 6 6 6 6 7 1 7 1 2"></polyline><path fill="none" stroke="#000" stroke-width="1.1" d="M2.1,6.548 C3.391,3.29 6.746,1 10.5,1 C15.5,1 19.5,5 19.5,10 C19.5,15 15.5,19 10.5,19 C5.5,19 1.5,15 1.5,10"></path></svg>'
}
/** @deprecated */
export const send = {
name: 'send',
data: '<svg xmlns="http://www.w3.org/2000/svg" height="20" viewBox="0 0 24 24" width="20" fill="#000000"><path d="M0 0h24v24H0z" fill="none"/><path d="M2.01 21L23 12 2.01 3 2 10l15 2-15 2z"/></svg>'
}
/** @deprecated */
export const print = {
name: 'print',
data: '<svg xmlns="http://www.w3.org/2000/svg" height="20" viewBox="0 0 24 24" width="240" fill="#000000"><path d="M0 0h24v24H0z" fill="none"/><path d="M19 8H5c-1.66 0-3 1.34-3 3v6h4v4h12v-4h4v-6c0-1.66-1.34-3-3-3zm-3 11H8v-5h8v5zm3-7c-.55 0-1-.45-1-1s.45-1 1-1 1 .45 1 1-.45 1-1 1zm-1-9H6v4h12V3z"/></svg>'
}
export const incognito = {
name: 'incognito',
data: '<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 24.51 19.525"><g id="Group_13376" data-name="Group 13376" transform="translate(-428.81 -3863.018)"><path id="Path_104500" data-name="Path 104500" d="M44.68,105.185H43.024a23.507,23.507,0,0,0-9.194-.158V106a3.909,3.909,0,0,1,1.264,1.668c.455,1.119.2,3.05,4.148,3.289s4-4.041,4.034-4.438.577-.372.577-.372.541-.021.579.372.09,4.673,4.034,4.438,3.693-2.17,4.146-3.289A3.9,3.9,0,0,1,53.879,106v-.969A23.686,23.686,0,0,0,44.68,105.185Z" transform="translate(397.218 3771.582)" fill="#2c2c2c"/><path id="Path_104501" data-name="Path 104501" d="M41.867,35.784H40.326s-1.95-6.217-2.207-6.735a2.8,2.8,0,0,0-2.591-2.061c-1.92-.266-2.138,1.225-3.544,1.268-1.406-.049-1.617-1.546-3.542-1.268a2.817,2.817,0,0,0-2.592,2.061c-.246.518-2.205,6.735-2.205,6.735H22.1a2.31,2.31,0,0,0-2.371,2.245H44.24A2.311,2.311,0,0,0,41.867,35.784Z" transform="translate(409.08 3836.064)" fill="#2c2c2c"/></g></svg>'
@ -223,4 +68,43 @@ export const mining = {
data: '<svg width="20" height="20" viewBox="0 0 600 500" xmlns="http://www.w3.org/2000/svg"><g><path d="m449.68 334.84-90.93-52.5c-5.4258-3.1133-12.074-3.1133-17.5 0l-90.93 52.5c-5.4258 3.1328-8.75 8.9062-8.75 15.156v105c0 6.2461 3.3242 12.039 8.75 15.156l90.93 52.5c2.7109 1.5547 5.7227 2.3438 8.75 2.3438s6.0391-0.78906 8.75-2.3438l90.93-52.5c5.4258-3.1328 8.75-8.9062 8.75-15.156v-105c0-6.2461-3.3242-12.023-8.75-15.156zm-99.68 120.16c-28.945 0-52.5-23.555-52.5-52.5s23.555-52.5 52.5-52.5 52.5 23.555 52.5 52.5-23.555 52.5-52.5 52.5z"/><path d="m545.93 35h-391.86c-27.055 0-49.07 22.016-49.07 49.07v20.93h490v-20.93c0-27.055-22.016-49.07-49.07-49.07z"/><path d="m105 370.93c0 27.055 22.016 49.07 49.07 49.07h70v-70c0-12.477 6.7031-24.078 17.5-30.309l90.93-52.5c5.3359-3.0625 11.375-4.6914 17.5-4.6914s12.164 1.6289 17.465 4.6719l90.965 52.516c10.797 6.2305 17.5 17.852 17.5 30.309v70h70c27.055 0.003906 49.07-22.012 49.07-49.066v-230.93h-490zm57.629-138.3 52.5-52.5c6.8438-6.8438 17.902-6.8438 24.746 0l42.84 42.84 75.793-45.484c6.8945-4.1289 15.715-3.0469 21.387 2.625l58.922 58.922 75.266-60.219c7.543-6.0391 18.551-4.8125 24.586 2.7305 6.0391 7.543 4.8125 18.566-2.7305 24.605l-87.5 70c-3.2188 2.5898-7.0859 3.8516-10.938 3.8516-4.4961 0-8.9961-1.7344-12.391-5.1289l-60.34-60.34-75.793 45.484c-6.8789 4.1289-15.68 3.0625-21.387-2.625l-40.09-40.145-40.129 40.129c-6.8438 6.8438-17.902 6.8438-24.746 0-6.8398-6.8438-6.8398-17.906 0.003906-24.746z"/></g></svg>'
}
export const by = {
name: 'by',
data: '<svg id="Layer_1" xmlns="http://www.w3.org/2000/svg" x="0px" y="0px" width="24px" height="24px" viewBox="5.5 -3.5 64 64"><g><circle fill="#FFFFFF" cx="37.637" cy="28.806" r="28.276"/><g><path d="M37.443-3.5c8.988,0,16.57,3.085,22.742,9.257C66.393,11.967,69.5,19.548,69.5,28.5c0,8.991-3.049,16.476-9.145,22.456 C53.879,57.319,46.242,60.5,37.443,60.5c-8.649,0-16.153-3.144-22.514-9.43C8.644,44.784,5.5,37.262,5.5,28.5 c0-8.761,3.144-16.342,9.429-22.742C21.101-0.415,28.604-3.5,37.443-3.5z M37.557,2.272c-7.276,0-13.428,2.553-18.457,7.657 c-5.22,5.334-7.829,11.525-7.829,18.572c0,7.086,2.59,13.22,7.77,18.398c5.181,5.182,11.352,7.771,18.514,7.771 c7.123,0,13.334-2.607,18.629-7.828c5.029-4.838,7.543-10.952,7.543-18.343c0-7.276-2.553-13.465-7.656-18.571 C50.967,4.824,44.795,2.272,37.557,2.272z M46.129,20.557v13.085h-3.656v15.542h-9.944V33.643h-3.656V20.557 c0-0.572,0.2-1.057,0.599-1.457c0.401-0.399,0.887-0.6,1.457-0.6h13.144c0.533,0,1.01,0.2,1.428,0.6 C45.918,19.5,46.129,19.986,46.129,20.557z M33.042,12.329c0-3.008,1.485-4.514,4.458-4.514s4.457,1.504,4.457,4.514 c0,2.971-1.486,4.457-4.457,4.457S33.042,15.3,33.042,12.329z"/></g></g></svg>'
}
export const cc = {
name: 'cc',
data: '<svg id="Layer_1" xmlns="http://www.w3.org/2000/svg" x="0px" y="0px" width="24px" height="24px" viewBox="5.5 -3.5 64 64"><g><circle fill="#FFFFFF" cx="37.785" cy="28.501" r="28.836"/><path d="M37.441-3.5c8.951,0,16.572,3.125,22.857,9.372c3.008,3.009,5.295,6.448,6.857,10.314 c1.561,3.867,2.344,7.971,2.344,12.314c0,4.381-0.773,8.486-2.314,12.313c-1.543,3.828-3.82,7.21-6.828,10.143 c-3.123,3.085-6.666,5.448-10.629,7.086c-3.961,1.638-8.057,2.457-12.285,2.457s-8.276-0.808-12.143-2.429 c-3.866-1.618-7.333-3.961-10.4-7.027c-3.067-3.066-5.4-6.524-7-10.372S5.5,32.767,5.5,28.5c0-4.229,0.809-8.295,2.428-12.2 c1.619-3.905,3.972-7.4,7.057-10.486C21.08-0.394,28.565-3.5,37.441-3.5z M37.557,2.272c-7.314,0-13.467,2.553-18.458,7.657 c-2.515,2.553-4.448,5.419-5.8,8.6c-1.354,3.181-2.029,6.505-2.029,9.972c0,3.429,0.675,6.734,2.029,9.913 c1.353,3.183,3.285,6.021,5.8,8.516c2.514,2.496,5.351,4.399,8.515,5.715c3.161,1.314,6.476,1.971,9.943,1.971 c3.428,0,6.75-0.665,9.973-1.999c3.219-1.335,6.121-3.257,8.713-5.771c4.99-4.876,7.484-10.99,7.484-18.344 c0-3.543-0.648-6.895-1.943-10.057c-1.293-3.162-3.18-5.98-5.654-8.458C50.984,4.844,44.795,2.272,37.557,2.272z M37.156,23.187 l-4.287,2.229c-0.458-0.951-1.019-1.619-1.685-2c-0.667-0.38-1.286-0.571-1.858-0.571c-2.856,0-4.286,1.885-4.286,5.657 c0,1.714,0.362,3.084,1.085,4.113c0.724,1.029,1.791,1.544,3.201,1.544c1.867,0,3.181-0.915,3.944-2.743l3.942,2 c-0.838,1.563-2,2.791-3.486,3.686c-1.484,0.896-3.123,1.343-4.914,1.343c-2.857,0-5.163-0.875-6.915-2.629 c-1.752-1.752-2.628-4.19-2.628-7.313c0-3.048,0.886-5.466,2.657-7.257c1.771-1.79,4.009-2.686,6.715-2.686 C32.604,18.558,35.441,20.101,37.156,23.187z M55.613,23.187l-4.229,2.229c-0.457-0.951-1.02-1.619-1.686-2 c-0.668-0.38-1.307-0.571-1.914-0.571c-2.857,0-4.287,1.885-4.287,5.657c0,1.714,0.363,3.084,1.086,4.113 c0.723,1.029,1.789,1.544,3.201,1.544c1.865,0,3.18-0.915,3.941-2.743l4,2c-0.875,1.563-2.057,2.791-3.541,3.686 c-1.486,0.896-3.105,1.343-4.857,1.343c-2.896,0-5.209-0.875-6.941-2.629c-1.736-1.752-2.602-4.19-2.602-7.313 c0-3.048,0.885-5.466,2.658-7.257c1.77-1.79,4.008-2.686,6.713-2.686C51.117,18.558,53.938,20.101,55.613,23.187z"/></g></svg>'
}
export const twitter = {
name: 'twitter',
data: '<svg width="20" height="20" fill="#fff" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg"><path d="M19,4.74 C18.339,5.029 17.626,5.229 16.881,5.32 C17.644,4.86 18.227,4.139 18.503,3.28 C17.79,3.7 17.001,4.009 16.159,4.17 C15.485,3.45 14.526,3 13.464,3 C11.423,3 9.771,4.66 9.771,6.7 C9.771,6.99 9.804,7.269 9.868,7.539 C6.795,7.38 4.076,5.919 2.254,3.679 C1.936,4.219 1.754,4.86 1.754,5.539 C1.754,6.82 2.405,7.95 3.397,8.61 C2.79,8.589 2.22,8.429 1.723,8.149 L1.723,8.189 C1.723,9.978 2.997,11.478 4.686,11.82 C4.376,11.899 4.049,11.939 3.713,11.939 C3.475,11.939 3.245,11.919 3.018,11.88 C3.49,13.349 4.852,14.419 6.469,14.449 C5.205,15.429 3.612,16.019 1.882,16.019 C1.583,16.019 1.29,16.009 1,15.969 C2.635,17.019 4.576,17.629 6.662,17.629 C13.454,17.629 17.17,12 17.17,7.129 C17.17,6.969 17.166,6.809 17.157,6.649 C17.879,6.129 18.504,5.478 19,4.74"></path></svg>'
}
export const facebook = {
name: 'facebook',
data: '<svg width="20" height="20" fill="#fff" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg"><path d="M11,10h2.6l0.4-3H11V5.3c0-0.9,0.2-1.5,1.5-1.5H14V1.1c-0.3,0-1-0.1-2.1-0.1C9.6,1,8,2.4,8,5v2H5.5v3H8v8h3V10z"></path></svg>'
}
export const linkedin = {
name: 'linkedin',
data: '<svg width="20" height="20" fill="#fff" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg"><path d="M5.77,17.89 L5.77,7.17 L2.21,7.17 L2.21,17.89 L5.77,17.89 L5.77,17.89 Z M3.99,5.71 C5.23,5.71 6.01,4.89 6.01,3.86 C5.99,2.8 5.24,2 4.02,2 C2.8,2 2,2.8 2,3.85 C2,4.88 2.77,5.7 3.97,5.7 L3.99,5.7 L3.99,5.71 L3.99,5.71 Z"></path><path d="M7.75,17.89 L11.31,17.89 L11.31,11.9 C11.31,11.58 11.33,11.26 11.43,11.03 C11.69,10.39 12.27,9.73 13.26,9.73 C14.55,9.73 15.06,10.71 15.06,12.15 L15.06,17.89 L18.62,17.89 L18.62,11.74 C18.62,8.45 16.86,6.92 14.52,6.92 C12.6,6.92 11.75,7.99 11.28,8.73 L11.3,8.73 L11.3,7.17 L7.75,7.17 C7.79,8.17 7.75,17.89 7.75,17.89 L7.75,17.89 L7.75,17.89 Z"></path></svg>'
}
export const slideshare = {
name: 'slideshare',
data: '<svg width="20" height="20" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg"><line fill="#fff" stroke="#fff" stroke-width="1.1" x1="13.4" y1="14" x2="6.3" y2="10.7"></line><line fill="#fff" stroke="#fff" stroke-width="1.1" x1="13.5" y1="5.5" x2="6.5" y2="8.8"></line><circle fill="#fff" stroke="#fff" stroke-width="1.1" cx="15.5" cy="4.6" r="2.3"></circle><circle fill="#fff" stroke="#fff" stroke-width="1.1" cx="15.5" cy="14.8" r="2.3"></circle><circle fill="#fff" stroke="#fff" stroke-width="1.1" cx="4.5" cy="9.8" r="2.3"></circle></svg>'
}
export const youtube = {
name: 'youtube',
data: '<svg width="20" height="20" fill="#fff" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg"><path d="M15,4.1c1,0.1,2.3,0,3,0.8c0.8,0.8,0.9,2.1,0.9,3.1C19,9.2,19,10.9,19,12c-0.1,1.1,0,2.4-0.5,3.4c-0.5,1.1-1.4,1.5-2.5,1.6 c-1.2,0.1-8.6,0.1-11,0c-1.1-0.1-2.4-0.1-3.2-1c-0.7-0.8-0.7-2-0.8-3C1,11.8,1,10.1,1,8.9c0-1.1,0-2.4,0.5-3.4C2,4.5,3,4.3,4.1,4.2 C5.3,4.1,12.6,4,15,4.1z M8,7.5v6l5.5-3L8,7.5z"></path></svg>'
}
export const newsletter = {
name: 'newsletter',
data: '<svg width="20" height="20" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg"><circle cx="3.12" cy="16.8" r="1.85"></circle><path fill="none" stroke="#000" stroke-width="3" d="M1.5,8.2 C1.78,8.18 2.06,8.16 2.35,8.16 C7.57,8.16 11.81,12.37 11.81,17.57 C11.81,17.89 11.79,18.19 11.76,18.5"></path><path fill="none" stroke="#000" stroke-width="3" d="M1.5,2.52 C1.78,2.51 2.06,2.5 2.35,2.5 C10.72,2.5 17.5,9.24 17.5,17.57 C17.5,17.89 17.49,18.19 17.47,18.5"></path></svg>'
}
/** Add new icon under this line to be sure that it will be added on preview */