angular-osf/src/app/shared/components/data-resources/data-resources.component.html at 856f91e471f6a5987eead694ae5b21dd1e77cd0a · nsemets/angular-osf · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
<div class="flex" [class]="vertical() ? 'flex-column row-gap-2 min-w-max' : 'column-gap-5 row-gap-3 flex-wrap'">
  <a
    class="icon-container"
    [href]="resourceUrl()"
    target="_blank"
    rel="noopener noreferrer"
    data-test-data-resources-data-link
  >
    <osf-icon
      [iconClass]="hasData() ? 'custom-icon-data icon-resource-size' : 'custom-icon-data-dark icon-resource-size'"
    ></osf-icon>
    <p>{{ 'resourceCard.resources.data' | translate }}</p>
  </a>

  <a
    class="icon-container"
    [href]="resourceUrl()"
    target="_blank"
    rel="noopener noreferrer"
    data-test-data-resources-analytic-code-link
  >
    <osf-icon
      [iconClass]="
        hasAnalyticCode() ? 'custom-icon-code icon-resource-size' : 'custom-icon-code-dark icon-resource-size'
      "
    />
    <p>{{ 'resourceCard.resources.analyticCode' | translate }}</p>
  </a>

  <a
    class="icon-container"
    [href]="resourceUrl()"
    target="_blank"
    rel="noopener noreferrer"
    data-test-data-resources-materials-link
  >
    <osf-icon
      [iconClass]="
        hasMaterials() ? 'custom-icon-materials icon-resource-size' : 'custom-icon-materials-dark icon-resource-size'
      "
    />
    <p>{{ 'resourceCard.resources.materials' | translate }}</p>
  </a>

  <a
    class="icon-container"
    [href]="resourceUrl()"
    target="_blank"
    rel="noopener noreferrer"
    data-test-data-resources-papers-link
  >
    <osf-icon
      [iconClass]="hasPapers() ? 'custom-icon-papers icon-resource-size' : 'custom-icon-papers-dark icon-resource-size'"
    />
    <p>{{ 'resourceCard.resources.papers' | translate }}</p>
  </a>

  <a
    class="icon-container"
    [href]="resourceUrl()"
    target="_blank"
    rel="noopener noreferrer"
    data-test-data-resources-supplements-link
  >
    <osf-icon
      [iconClass]="
        hasSupplements()
          ? 'custom-icon-supplements icon-resource-size'
          : 'custom-icon-supplements-dark icon-resource-size'
      "
    />
    <p>{{ 'resourceCard.resources.supplements' | translate }}</p>
  </a>
</div>