zydronium/neocities
1
0
Fork 0
mirror of https://github.com/neocities/neocities.git synced 2025-04-25 01:32:36 +02:00
Code Issues Projects Releases Packages Wiki Activity

Added cat images for plans.

Browse source
This commit is contained in:
Victoria Wang 2014-10-03 22:37:32 -07:00
parent b105d55316
commit c99d9f0fdf
5 changed files with 38 additions and 10 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

BIN
public/img/catbus.png Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 26 KiB

BIN
public/img/fatcat.png Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 20 KiB

BIN
public/img/plaincat.png Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 17 KiB

27
sass/_project-sass/_project-Main.scss
View file

@ -893,12 +893,13 @@ a.tag:hover {
display:table; display:table;
width: 100%; width: 100%;
} }
.plan-overview .body h3, .plan-chart h4 { .plan-overview h3, .plan-chart h3 {
color: black; color: black;
font-weight:bold; font-weight:bold;
font-size:1.2em; font-size:1.2em;
font-family: "Lucida Grande", verdana, "Helvetica Neue", Helvetica, Arial, sans-serif; font-family: "Lucida Grande", verdana, "Helvetica Neue", Helvetica, Arial, sans-serif;
margin-bottom: -2px; margin-bottom: -3px;
margin-top: 0;
} }
.plan-overview .price { .plan-overview .price {
font-size: 2em; font-size: 2em;
@ -927,6 +928,28 @@ a.tag:hover {
.plan-overview li { .plan-overview li {
margin: 0; margin: 0;
} }
.plan-overview .plan-image {
background-repeat: no-repeat;
background-position: center center;
height: 81px;
margin: 30px 0 5px 0;
}
.plan-overview .free .plan-image {
background-image: url(/img/plaincat.png);
background-size: 77px;
}
.plan-overview .supporter .plan-image {
background-image: url(/img/heartcat.png);
background-size: 77px;
}
.plan-overview .catbus .plan-image {
background-image: url(/img/catbus.png);
background-size: 95px;
}
.plan-overview .fatcat .plan-image {
background-image: url(/img/fatcat.png);
background-size: 70px;
}
.plan-chart { .plan-chart {
margin: 2em 0 4em 0; margin: 2em 0 4em 0;
width: 100%; width: 100%;

21
views/newindex_mockup.erb
View file

@ -278,7 +278,8 @@
</div> </div>
<div class="body"> <div class="body">
<div class="col col-25"> <div class="col col-25 free">
<div class="plan-image free"></div>
<h3>Free</h3> <h3>Free</h3>
<div class="price">$0</div> <div class="price">$0</div>
<div class="interval">per month</div> <div class="interval">per month</div>
@ -289,7 +290,8 @@
</ul> </ul>
</div> </div>
<div class="col col-25"> <div class="col col-25 supporter">
<div class="plan-image"></div>
<h3>Supporter</h3> <h3>Supporter</h3>
<div class="price">$5</div> <div class="price">$5</div>
<div class="interval">per month</div> <div class="interval">per month</div>
@ -305,7 +307,9 @@
</ul> </ul>
</div> </div>
<div class="col col-25"> <div class="col col-25 catbus">
<div class="plan-image"></div>
<h3>Cat Bus</h3> <h3>Cat Bus</h3>
<div class="price">$20</div> <div class="price">$20</div>
<div class="interval">per month</div> <div class="interval">per month</div>
@ -324,7 +328,8 @@
</ul> </ul>
</div> </div>
<div class="col col-25"> <div class="col col-25 fatcat">
<div class="plan-image"></div>
<h3>Fat Cat</h3> <h3>Fat Cat</h3>
<div class="price">$50</div> <div class="price">$50</div>
<div class="interval">per month</div> <div class="interval">per month</div>
@ -353,22 +358,22 @@
<tr> <tr>
<th class="feature-column"></th> <th class="feature-column"></th>
<th> <th>
<h4>Free</h4> <h3>Free</h3>
<p>$0/mo</p> <p>$0/mo</p>
<a href="/" class="btn-Action">Choose</a> <a href="/" class="btn-Action">Choose</a>
</th> </th>
<th> <th>
<h4>Supporter</h4> <h3>Supporter</h3>
<p>$5/mo</p> <p>$5/mo</p>
<a href="/" class="btn-Action">Choose</a> <a href="/" class="btn-Action">Choose</a>
</th> </th>
<th class="professional"> <th class="professional">
<h4>Cat Bus</h4> <h3>Cat Bus</h3>
<p>$20/mo</p> <p>$20/mo</p>
<a href="/" class="btn-Action">Choose</a> <a href="/" class="btn-Action">Choose</a>
</th> </th>
<th class="professional"> <th class="professional">
<h4>Fat Cat</h4> <h3>Fat Cat</h3>
<p>$50/mo</p> <p>$50/mo</p>
<a href="/" class="btn-Action">Choose</a> <a href="/" class="btn-Action">Choose</a>
</th> </th>