uoa-repository-manager-ui/src/app/pages/compatibility/compatibility-validate.component.html

<div id="page_content">
  <div id="page_content_inner">
    <h2 class="heading_b uk-margin-bottom">Validate your datasource</h2>

    <!-- TOP HELP CONTENT -->
    <help-content #topHelperContent [position]="'top'"
                  [ngClass]="topHelperContent.isPresent()?'uk-margin-medium-top uk-margin-medium-bottom':'clear-style'">
    </help-content>

    <div class="uk-grid">

      <!-- LEFT HELP CONTENT -->
      <aside-help-content #leftHelperContent [position]="'left'"
                          [ngClass]="leftHelperContent.isPresent()?'tm-sidebar uk-width-1-4@m uk-first-column':'clear-style'">
      </aside-help-content>

      <!-- MIDDLE -->
      <div class=" uk-width-expand@m">

        <div class="uk-grid uk-grid-match uk-grid-medium repositoryTypeSelection uk-child-width-1-3@l uk-child-widht-1-3@m" data-uk-grid-margin="">

          <div class="uk-row-first">
            <div class="uk-text-center md-card md-card-default md-card-hover uk-scrollspy-inview uk-animation-slide-top-medium
            datasourceTypeCard uk-inline-clip uk-transition-toggle" uk-scrollspy-class="" tabindex="0">
              <a [routerLink]="['literature']" [queryParams]="{ step: 'baseUrl' }" class="el-link uk-position-cover uk-margin-remove-adjacent"></a>
              <div class="md-card-content large-padding uk-margin-medium-top uk-margin-bottom">
                <div class="">
                  <img class="el-image" src="../../../assets/imgs/datasourcetypes/Literature%20repository.svg" alt="" width="50">
                </div>
                <h3>Literature repository</h3>
                <div class="uk-transition-slide-bottom uk-position-bottom uk-overlay uk-overlay-primary">
                  <p class="uk-margin-remove">Run compatibility test against the OpenAIRE literature guidelines.</p>
                </div>
              </div>
            </div>
          </div>

          <div class="">
            <div class="uk-text-center md-card md-card-default md-card-hover uk-scrollspy-inview uk-animation-slide-top-medium
            datasourceTypeCard uk-inline-clip uk-transition-toggle" uk-scrollspy-class="" tabindex="0">
              <a [routerLink]="['data']" [queryParams]="{ step: 'baseUrl' }" class="el-link uk-position-cover uk-margin-remove-adjacent"></a>
              <div class="md-card-content large-padding uk-margin-medium-top uk-margin-bottom">
                <div class="">
                  <img class="el-image" src="../../../assets/imgs/datasourcetypes/Data%20repository.svg" alt="" width="50">
                </div>
                <h3>Data repository</h3>
                <div class="uk-transition-slide-bottom uk-position-bottom uk-overlay uk-overlay-primary">
                  <p class="uk-margin-remove">Run compatibility test against the OpenAIRE Guidelines for Data Archives.</p>
                </div>
              </div>
            </div>
          </div>

          <div class="">
            <div class="uk-text-center md-card md-card-default md-card-hover uk-scrollspy-inview uk-animation-slide-top-medium
            datasourceTypeCard uk-inline-clip uk-transition-toggle" uk-scrollspy-class="" tabindex="0">
              <a [routerLink]="['cris']" [queryParams]="{ step: 'baseUrl' }" class="el-link uk-position-cover uk-margin-remove-adjacent"></a>
              <div class="md-card-content large-padding uk-margin-medium-top uk-margin-bottom">
                <div class="">
                  <img class="el-image" src="../../../assets/imgs/datasourcetypes/Cris.svg" alt="" width="50">
                </div>
                <h3>CRIS systems</h3>
                <div class="uk-transition-slide-bottom uk-position-bottom uk-overlay uk-overlay-primary">
                  <p class="uk-margin-remove">Run compatibility test against the OpenAIRE Guidelines for CRIS Managers based on CERIF-XML.</p>
                </div>
              </div>
            </div>
          </div>

        </div>

        <div class="uk-grid uk-grid-match uk-grid-medium repositoryTypeSelection uk-child-width-1-3@l uk-child-widht-1-3@m" data-uk-grid-margin="">

          <div class="uk-row-first">
            <div class="uk-text-center md-card md-card-default md-card-hover uk-scrollspy-inview uk-animation-slide-top-medium
            datasourceTypeCard uk-inline-clip uk-transition-toggle" uk-scrollspy-class="" tabindex="0">
              <img alt="BETA" class="large-beta-indication" src="../../../assets/imgs/beta_flag.svg" width="100" style="position:absolute; left: 0;">
              <a [routerLink]="['fair']" [queryParams]="{ step: 'baseUrl' }" class="el-link uk-position-cover uk-margin-remove-adjacent"></a>
              <div class="md-card-content large-padding uk-margin-medium-top uk-margin-bottom">
                <div class="">
                  <img class="el-image" src="../../../assets/imgs/datasourcetypes/Fair.svg" alt="" width="50">
                </div>
                <h3>FAIR assessment</h3>
                <div class="uk-transition-slide-bottom uk-position-bottom uk-overlay uk-overlay-primary">
                  <p class="uk-margin-remove">Perform a fair assessment on your metadata.</p>
                </div>
              </div>
            </div>
          </div>

        </div>



      </div>

      <!-- RIGHT HELP CONTENT -->
      <aside-help-content #rightHelperContent [position]="'right'"
                          [ngClass]="rightHelperContent.isPresent()?'tm-sidebar uk-width-1-4@m uk-first-column':'clear-style'">
      </aside-help-content>

    </div>

    <!-- BOTTOM HELP CONTENT -->
    <help-content #bottomHelperContent [position]="'bottom'"
                  [ngClass]="bottomHelperContent.isPresent()?'uk-margin-medium-top uk-margin-medium-bottom':'clear-style'">
    </help-content>

  </div>
</div>


<!--<div class="uk-grid-margin uk-grid uk-grid-stack" uk-grid="">-->
  <!--<div class="uk-width-1-1@m uk-first-column">-->

    <!--<h1 class="uk-h2">Validate your datasource</h1>-->

    <!--&lt;!&ndash; TOP HELP CONTENT &ndash;&gt;-->
    <!--<help-content #topHelperContent [position]="'top'"-->
                  <!--[ngClass]="topHelperContent.isPresent()?'uk-margin-medium-top uk-margin-medium-bottom':'clear-style'">-->
    <!--</help-content>-->

    <!--<div class="uk-container uk-container-large uk-margin-medium-top uk-margin-medium-bottom">-->
      <!--<div class="uk-grid">-->

        <!--&lt;!&ndash; LEFT HELP CONTENT &ndash;&gt;-->
        <!--<aside-help-content #leftHelperContent [position]="'left'"-->
                            <!--[ngClass]="leftHelperContent.isPresent()?'tm-sidebar uk-width-1-4@m uk-first-column':'clear-style'">-->
        <!--</aside-help-content>-->

        <!--&lt;!&ndash; MIDDLE &ndash;&gt;-->
        <!--<div class=" uk-width-expand@m">-->

          <!--<div>-->
            <!--<div class="uk-margin uk-grid repositoryTypeSelection">-->
              <!--<div class="uk-width-expand@m uk-width-1-3@s uk-grid-item-match uk-first-column">-->
                <!--<div class="uk-text-center uk-card uk-card-default uk-card-hover uk-scrollspy-inview uk-animation-slide-top-medium" uk-scrollspy-class="" data-id="" style="">-->
                  <!--<a class="uk-position-cover uk-margin-remove-adjacent" [routerLink]="['literature']" [queryParams]="{ step: 'baseUrl' }"></a>-->
                  <!--<div class="uk-card-media-top">-->
                    <!--<img src="../../../assets/imgs/Literature_repos_wide.png" alt="" style="width:100%;">-->
                  <!--</div>-->
                  <!--<div class="uk-card-body">-->
                    <!--<h3 class="el-title uk-margin uk-card-title uk-margin-remove-adjacent uk-margin-small-bottom">-->
                      <!--Run compatibility test against the OpenAIRE literature guidelines.-->
                    <!--</h3>-->
                  <!--</div>-->
                <!--</div>-->
              <!--</div>-->
              <!--<div class="uk-width-expand@m uk-width-1-3@s uk-grid-item-match uk-first-column">-->
                <!--<div class="uk-text-center uk-card uk-card-default uk-card-hover uk-scrollspy-inview uk-animation-slide-top-medium" uk-scrollspy-class="" data-id="" style="">-->
                  <!--<a class="el-link uk-position-cover uk-margin-remove-adjacent" [routerLink]="['data']" [queryParams]="{ step: 'baseUrl' }"></a>-->
                  <!--<div class="uk-card-media-top">-->
                    <!--<img class="el-image" src="../../../assets/imgs/Data_repos_wide.png" alt="" style="width:100%;">-->
                  <!--</div>-->
                  <!--<div class="uk-card-body">-->
                    <!--<h3 class="el-title uk-margin uk-card-title uk-margin-remove-adjacent uk-margin-small-bottom">-->
                      <!--Run compatibility test against the OpenAIRE Guidelines for Data Archives.-->
                    <!--</h3>-->
                  <!--</div>-->
                <!--</div>-->
              <!--</div>-->
              <!--<div class="uk-width-expand@m uk-width-1-3@s uk-grid-item-match uk-first-column">-->
                <!--<div class="uk-text-center uk-card uk-card-default uk-card-hover uk-scrollspy-inview uk-animation-slide-top-medium" uk-scrollspy-class="" data-id="" style="">-->
                  <!--<a class="el-link uk-position-cover uk-margin-remove-adjacent" [routerLink]="['cris']" [queryParams]="{ step: 'baseUrl' }"></a>-->
                  <!--<div class="uk-card-media-top">-->
                    <!--<img class="el-image" src="../../../assets/imgs/CRIS_wide.png" alt="" style="width:100%;">-->
                  <!--</div>-->
                  <!--<div class="uk-card-body">-->
                    <!--<h3 class="el-title uk-margin uk-card-title uk-margin-remove-adjacent uk-margin-small-bottom">-->
                      <!--Run compatibility test against the OpenAIRE Guidelines for CRIS Managers based on CERIF-XML.-->
                    <!--</h3>-->
                  <!--</div>-->
                <!--</div>-->
              <!--</div>-->
            <!--</div>-->
          <!--</div>-->

        <!--</div>-->

        <!--&lt;!&ndash; RIGHT HELP CONTENT &ndash;&gt;-->
        <!--<aside-help-content #rightHelperContent [position]="'right'"-->
                            <!--[ngClass]="rightHelperContent.isPresent()?'tm-sidebar uk-width-1-4@m uk-first-column':'clear-style'">-->
        <!--</aside-help-content>-->

      <!--</div>-->
    <!--</div>-->


    <!--&lt;!&ndash; BOTTOM HELP CONTENT &ndash;&gt;-->
    <!--<help-content #bottomHelperContent [position]="'bottom'"-->
                  <!--[ngClass]="bottomHelperContent.isPresent()?'uk-margin-medium-top uk-margin-medium-bottom':'clear-style'">-->
    <!--</help-content>-->


  <!--</div>-->
<!--</div>-->