superuserlabs.github.io/_includes/templates/mixins.pug at 1ff10d6159e8e971e02ea56fc8f4e6c11bb70178 · SuperuserLabs/superuserlabs.github.io · 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
mixin section(padding="2em 0em")
  div&attributes(attributes)
    div.container.mx-auto(style=`padding: ${padding}`)
      .grid
        block

mixin fa(name, group='fas', color='black')
  i(class=`${group} fa-${name} fa-8x text-${color}`)

mixin cell(cols)
  div(class=`col-span-${cols}`)&attributes(attributes)
    block

mixin footer
  div.border-t.border-slate-800.text-slate-500.w-full.py-8.text-center.text-sm
    div.max-w-6xl.mx-auto.px-6.flex.flex-col.items-center.gap-4(class="sm:flex-row sm:justify-between")
      span Made with #[i.fas.fa-heart(style="color: #ef4444")] by Superuser Labs
      div.flex.items-center.gap-5
        a.text-slate-600(href='https://github.com/SuperuserLabs' target="_blank", class="hover:text-slate-300 transition-colors")
          i.fab.fa-github
        a.text-slate-600(href='https://twitter.com/SuperusrLabs' target="_blank", class="hover:text-slate-300 transition-colors")
          i.fab.fa-twitter
        a.text-slate-600(href='https://www.linkedin.com/company/superuser-labs' target="_blank", class="hover:text-slate-300 transition-colors")
          i.fab.fa-linkedin

mixin teammember(name, imagename, role, github, linkedin, twitter, website, image_style)
  div.group.rounded-2xl.bg-slate-900.border.border-slate-800.overflow-hidden(class="hover:border-slate-700 transition-all")
    div
      div.aspect-square(style=`background: url('/media/${imagename}') center / cover; ${image_style || ''}`)
    div.flex.items-center.p-4
      div.flex-grow
        div.font-medium.text-white #{name}
        div.text-sm.text-slate-400 #{role}
      div.flex.items-center.gap-2
        if github
          a(href=`${github}` target="_blank", class="text-slate-600 hover:text-white transition-colors")
            i.fab.fa-github.text-lg
        if linkedin
          a(href=`${linkedin}` target="_blank", class="text-slate-600 hover:text-blue-400 transition-colors")
            i.fab.fa-linkedin.text-lg
        if twitter
          a(href=`${twitter}` target="_blank", class="text-slate-600 hover:text-sky-400 transition-colors")
            i.fab.fa-twitter.text-lg
        if website
          a(href=`${website}` target="_blank", class="text-slate-600 hover:text-green-400 transition-colors")
            i.fas.fa-globe.text-lg

mixin analytics-superuserlabs(ua_id, ga_id)
  |<!-- Global site tag (gtag.js) - Google Analytics -->
  |<script async src="https://www.googletagmanager.com/gtag/js?id=G-2MVEP1H2F6"></script>
  |<script>
  | window.dataLayer = window.dataLayer || [];
  | function gtag(){dataLayer.push(arguments);}
  | gtag('js', new Date());
  |
  | gtag('config', 'G-2MVEP1H2F6');
  |</script>

mixin analytics-thankful
  |<!-- Global site tag (gtag.js) - Google Analytics -->
  |<script async src="https://www.googletagmanager.com/gtag/js?id=UA-121109725-1"></script>
  |<script>
  | window.dataLayer = window.dataLayer || [];
  | function gtag(){dataLayer.push(arguments);}
  | gtag('js', new Date());
  |
  | gtag('config', 'UA-121109725-1');
  |</script>