shecoded/display_ad.html at main · forem/shecoded · 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
<div>
  <style>
    .she-coded-ph1-sidebar-campaign__container {
      background: url(https://dev-to-uploads.s3.amazonaws.com/i/v266t6xk90yv7uyric8b.png);
      color: white;
    }

    .she-coded-ph1-sidebar-campaign__overlay-container {
      background: linear-gradient(131.88deg, #3140E7 0%, rgba(49, 64, 231, 0.59) 57.69%, rgba(49, 64, 231, 0.05) 98.71%);
      padding: 23px 18px;
    }

    .she-coded-ph1-sidebar-campaign__logo {
      width: 100%;
      height: 64px;
    }

    .she-coded-ph1-sidebar-campaign__text {
      font-size: 14px;
      line-height: 20px;
      letter-spacing: -0.02em;
      text-shadow: 0px 4px 4px rgba(0, 0, 0, 0.25);
      font-weight: 500;
    }

    .she-coded-ph1-sidebar-campaign__button-container {
      margin-top: 16px;
    }

    .she-coded-ph1-sidebar-campaign__button {
      height: 40px;
      border-radius: 3px;
      text-align: center;
      font-size: 16px;
      line-height: 40px;
      letter-spacing: -0.02em;
    }

    .she-coded-ph1-sidebar-campaign__button--share {
      background: white;
      color: #4755EB;
      font-weight: 500;
    }

    .she-coded-ph1-sidebar-campaign__container a {
      color: white;
    }
    .she-coded-ph1-sidebar-campaign__container a:hover {
      opacity: 1.0
    }
  </style>

  <div class="she-coded-ph1-sidebar-campaign__container">
    <div class="she-coded-ph1-sidebar-campaign__overlay-container">
      <div class="she-coded-ph1-sidebar-campaign__div she-coded-ph1-sidebar-campaign__div--left">
        <img class="she-coded-ph1-sidebar-campaign__logo" src="https://dev-to-uploads.s3.amazonaws.com/i/0j0cbs668sni2hclgx1o.png">
        <div class="she-coded-ph1-sidebar-campaign__text">
          <p>
            This year, we’re celebrating International Women’s Day from March 6-9, 2020 by highlighting stories of self-identifying women and non-binary members of our community.
          </p>
          <p>
            Get your posts in early to be highlighted on Friday.
          </p>
        </div>

        <div class="she-coded-ph1-sidebar-campaign__button-container">
          <a href="https://dev.to/shecoded"><div class="she-coded-ph1-sidebar-campaign__button she-coded-ph1-sidebar-campaign__button--share">Full Details</div></a>
        </div>
      </div>
    </div>
  </div>
</div>