Index|Projects|Planet

Banner

Please consider keeping the link-back intact, which will enable people to spread the message of supporting freedom in computing!

All source provided below is released under the terms of the CC0 1.0 Universal license. The Emacs Lisp example below depends on xmlgen which is currently not part of the official distribution.

CC0


.banner {
    display: flex;
    font-size: 1rem;
    font-weight: regular;
    margin-top: 1em;
    padding-top: 0.3em;
    padding-bottom: 0.3em;
    width: 100%;
    background-color: #e1e1e1;
    text-align: center;
    color: black;
}

.banner .item {
    flex: 25%;
    padding-left: 1em;
}

.banner > a {
    color: black;
}

.format-small {
    padding-top: 0.3rem;
    float: right;
    font-size: 0.5rem;
}

.format-small > a {
    color: #333;
}

@media only screen and (max-width: 600px) {
    .banner {
        flex-direction: column;
    }

    .banner .item {
        padding-left: 0em;
    }
}
<div class="banner">
  <p class="item">Support free software by donating!</p>
  <a class="item" href="https://my.fsf.org/donate" target="_blank">Free Software Foundation</a>
  <a class="item" href="https://softwarefreedom.org/donate/" target="_blank">Software Freedom Law Center</a>
  <a class="item" href="https://sfconservancy.org/donate/" target="_blank">Software Freedom Conservancy</a>
</div>
<div class="format-small">
  <a href="https://brettgilio.com/banner-source.html">embed?</a>
</div>
(div :class "banner"
     (p :class "item" "Support free software by donating!")
     (a :class "item"
        :href "https://my.fsf.org/donate" "Free Software Foundation"
        :target "_blank")
     (a :class "item"
        :href "https://softwarefreedom.org/donate/" "Software Freedom Law Center"
        :target "_blank")
     (a :class "item"
        :href "https://sfconservancy.org/donate/" "Software Freedom Conservancy"
        :target "_blank"))
(div :class "format-small"
     (a :href "https://brettgilio.com/banner-source.html" "embed?"))