-<section class="hero is-light bsa">
- <script src="//m.servedby-buysellads.com/monetization.js" type="text/javascript"></script>
+<script src="//m.servedby-buysellads.com/monetization.js" type="text/javascript"></script>
+
+<section class="hero is-info bsa">
<div class="container">
- <div class="bsa-container">
- <div class="bsa-cpc"></div>
+ <div class="columns is-vcentered">
+ <div class="column is-4">
+ <p class="title">Bulma <strong>Partners</strong></p>
+ <p class="subtitle">Keeping the project alive!</p>
+ </div>
+
+ <div class="column is-8">
+ <div class="bsa-cpc"></div>
+ </div>
</div>
</div>
- <script>
- (function(){
- if(typeof _bsa !== 'undefined' && _bsa) {
- _bsa.init('default', 'CVAIKK3E', 'placement:bulmaio', {
- target: '.bsa-cpc',
- align: 'horizontal',
- disable_css: 'true'
- });
- }
- })();
- </script>
</section>
+
+<script>
+ (function(){
+ if(typeof _bsa !== 'undefined' && _bsa) {
+ _bsa.init('default', 'CVAIKK3E', 'placement:bulmaio', {
+ target: '.bsa-cpc',
+ align: 'horizontal',
+ disable_css: 'true'
+ });
+ }
+ })();
+</script>
<form action="https://www.paypal.com/cgi-bin/webscr" method="post" target="_top">
<input type="hidden" name="cmd" value="_s-xclick">
<input type="hidden" name="hosted_button_id" value="8WMKYSRFN6A78">
- <input type="image" src="https://www.paypalobjects.com/webstatic/en_US/i/btn/png/gold-rect-paypaldonate-60px.png" border="0" name="submit" alt="PayPal – The safer, easier way to pay online." height="30">
+ <input type="image" src="{{site.url}}/images/paypal-donate.png" border="0" name="submit" alt="PayPal – The safer, easier way to pay online." height="30">
<img alt="" border="0" src="https://www.paypalobjects.com/en_GB/i/scr/pixel.gif" width="1" height="1">
</form>
</div>
</div>
</footer>
-{% if page.route == 'index' %}
- <style type="text/css">
- .title.is-2 {
- position: relative;
- }
-
- .title.is-2 a {
- color: #242424;
- padding-left: 48px;
- position: relative;
- }
-
- .title.is-2 a:hover {
- color: #00d1b2;
- }
-
- .title.is-2 .icon.is-medium {
- left: 8px;
- position: absolute;
- top: 10px;
- }
-
- .hero .title.is-2 a {
- color: white;
- }
-
- .hero .title.is-2 a:hover {
- color: white;
- }
-
- .hero.is-primary a.column,
- .hero.is-primary a.column:hover {
- color: white;
- }
-
- .hero.is-primary a.column:hover .title strong {
- border-bottom: 1px solid;
- }
-
- @media screen and (max-width: 979px) {
- .title.is-2 a {
- padding-left: 0;
- }
-
- .title.is-2 .icon.is-medium {
- display: none;
- }
- }
- </style>
-{% endif %}
-
<script async defer id="twitter-wjs" src="https://platform.twitter.com/widgets.js"></script>
<script async defer type="text/javascript" src="https://s3.amazonaws.com/downloads.mailchimp.com/js/mc-validate.js"></script>
@import "./sass/specific"
@import "./sass/example"
@import "./sass/bsa"
+@import "./sass/route"
html
\::-moz-selection
@media screen and (min-width: 1000px) {
.container {
margin: 0 auto;
- max-width: 960px;
+ width: 960px;
}
.container.is-fluid {
margin: 0 20px;
max-width: none;
+ width: auto;
}
}
@media screen and (min-width: 1192px) {
.container {
- max-width: 1152px;
+ width: 1152px;
}
}
@media screen and (min-width: 1384px) {
.container {
- max-width: 1344px;
+ width: 1344px;
}
}
align-items: stretch;
display: flex;
min-height: 3.25rem;
- width: 100%;
}
.nav.has-shadow {
box-shadow: 0 2px 3px rgba(10, 10, 10, 0.1);
}
+@media screen and (max-width: 768px) {
+ .nav > .container {
+ width: 100%;
+ }
+}
+
.pagination {
font-size: 1rem;
}
padding: 2rem;
}
+.bsa-cpc {
+ min-height: 1px;
+}
+
#_default_ .default-ad {
- background-color: #00d1b2;
+ background-color: rgba(0, 0, 0, 0.3);
border-radius: 2px;
- color: #fff;
+ color: white;
display: inline-block;
- font-size: 12px;
+ font-size: 10px;
+ font-weight: bold;
padding: 0 4px;
text-transform: uppercase;
vertical-align: top;
background-color: white;
border-radius: 5px;
box-shadow: 0 2px 3px rgba(10, 10, 10, 0.1), 0 0 0 1px rgba(10, 10, 10, 0.1);
+ color: #4a4a4a;
display: block;
- line-height: 1.25;
+ line-height: 1.375;
margin-top: 15px;
padding: 15px;
padding-left: 70px;
}
@media screen and (min-width: 769px) {
+ .bsa .columns {
+ min-height: 120px;
+ }
#_default_ {
display: flex;
justify-content: center;
}
}
+html.route-index .title.is-2 {
+ position: relative;
+}
+
+html.route-index .title.is-2 a {
+ color: #242424;
+ padding-left: 48px;
+ position: relative;
+}
+
+html.route-index .title.is-2 a:hover {
+ color: #00d1b2;
+}
+
+html.route-index .title.is-2 .icon.is-medium {
+ left: 8px;
+ position: absolute;
+ top: 10px;
+}
+
+html.route-index .hero .title.is-2 a {
+ color: white;
+}
+
+html.route-index .hero .title.is-2 a:hover {
+ color: white;
+}
+
+html.route-index .hero.is-primary a.column,
+html.route-index .hero.is-primary a.column:hover {
+ color: white;
+}
+
+html.route-index .hero.is-primary a.column:hover .title strong {
+ border-bottom: 1px solid;
+}
+
+@media screen and (max-width: 979px) {
+ html.route-index .title.is-2 a {
+ padding-left: 0;
+ }
+ html.route-index .title.is-2 .icon.is-medium {
+ display: none;
+ }
+}
+
html ::-moz-selection {
background: #00d1b2;
color: #fff;
<div class="card">
<div class="card-content">
<p class="title">
- If Tetris has taught me anything it's that errors pile up and accomplishments disappear.
+ “There are two hard things in computer science: cache invalidation, naming things, and off-by-one errors.”
</p>
<p class="subtitle">
- Mark Twain
+ Jeff Atwood
</p>
</div>
<footer class="card-footer">
<p class="card-footer-item">
- <span>More quotes by <a href="#">Mark Twain</a></span>
+ <span>
+ View on <a href="https://twitter.com/codinghorror/status/506010907021828096">Twitter</a>
+ </span>
+ </p>
+ <p class="card-footer-item">
+ <span>
+ Share on <a href="#">Facebook</a>
+ </span>
</p>
</footer>
</div>
.bsa
padding: 2rem
+.bsa-cpc
+ min-height: 1px
+
#_default_
.default-ad
- background-color: $primary
+ background-color: rgba(black, 0.3)
border-radius: 2px
- color: $primary-invert
+ color: $white
display: inline-block
- font-size: 12px
+ font-size: 10px
+ font-weight: bold
padding: 0 4px
text-transform: uppercase
vertical-align: top
background-color: $white
border-radius: $radius-large
box-shadow: 0 2px 3px rgba($black, 0.1), 0 0 0 1px rgba($black, 0.1)
+ color: $text
display: block
- line-height: 1.25
+ line-height: 1.375
margin-top: 15px
padding: 15px
padding-left: 70px
font-weight: $weight-bold
+tablet
+ .bsa
+ .columns
+ min-height: 120px
#_default_
display: flex
justify-content: center
--- /dev/null
+html.route-index
+ .title.is-2
+ position: relative
+
+ .title.is-2 a
+ color: #242424
+ padding-left: 48px
+ position: relative
+
+ .title.is-2 a:hover
+ color: #00d1b2
+
+ .title.is-2 .icon.is-medium
+ left: 8px
+ position: absolute
+ top: 10px
+
+ .hero .title.is-2 a
+ color: white
+
+ .hero .title.is-2 a:hover
+ color: white
+
+ .hero.is-primary a.column,
+ .hero.is-primary a.column:hover
+ color: white
+
+ .hero.is-primary a.column:hover .title strong
+ border-bottom: 1px solid
+
+ @media screen and (max-width: 979px)
+ .title.is-2 a
+ padding-left: 0
+
+ .title.is-2 .icon.is-medium
+ display: none
align-items: stretch
display: flex
min-height: $nav-height
- width: 100%
// Modifiers
&.has-shadow
box-shadow: 0 2px 3px rgba($black, 0.1)
+ // Responsiveness
+ +mobile
+ & > .container
+ width: 100%
position: relative
+desktop
margin: 0 auto
- max-width: $desktop - 40px
+ width: $desktop - 40px
// Modifiers
&.is-fluid
margin: 0 20px
max-width: none
+ width: auto
+widescreen
- max-width: $widescreen - 40px
+ width: $widescreen - 40px
+fullhd
- max-width: $fullhd - 40px
+ width: $fullhd - 40px
.delete
+delete