archive/healthchecks_healthchecks
0
0
Fork 0
mirror of https://github.com/healthchecks/healthchecks.git synced 2025-04-07 14:15:34 +00:00
Code Issues Projects Releases Wiki Activity

Eliminate bootstrap's list-group

Browse source
This commit is contained in:
Pēteris Caune 2022-02-01 09:06:35 +02:00
parent c2d6799969
commit ca93e95632
No known key found for this signature in database
GPG key ID: E28D7679E9A9EDE2
4 changed files with 46 additions and 249 deletions
static/css
bootstrap.csspricing.css
stuff/bootstrap
bootstrap.less
templates/payments
pricing.html

206
static/css/bootstrap.css vendored
View file

@ -3913,212 +3913,6 @@ a.badge:focus {
.alert-danger .alert-link { .alert-danger .alert-link {
color: #843534; color: #843534;
} }
.list-group {
padding-left: 0;
margin-bottom: 20px;
}
.list-group-item {
position: relative;
display: block;
padding: 10px 15px;
margin-bottom: -1px;
background-color: transparent;
border: 1px solid var(--border-color);
}
.list-group-item:first-child {
border-top-left-radius: 2px;
border-top-right-radius: 2px;
}
.list-group-item:last-child {
margin-bottom: 0;
border-bottom-right-radius: 2px;
border-bottom-left-radius: 2px;
}
.list-group-item.disabled,
.list-group-item.disabled:hover,
.list-group-item.disabled:focus {
color: #777777;
cursor: not-allowed;
background-color: #eeeeee;
}
.list-group-item.disabled .list-group-item-heading,
.list-group-item.disabled:hover .list-group-item-heading,
.list-group-item.disabled:focus .list-group-item-heading {
color: inherit;
}
.list-group-item.disabled .list-group-item-text,
.list-group-item.disabled:hover .list-group-item-text,
.list-group-item.disabled:focus .list-group-item-text {
color: #777777;
}
.list-group-item.active,
.list-group-item.active:hover,
.list-group-item.active:focus {
z-index: 2;
color: #fff;
background-color: #22bc66;
border-color: #22bc66;
}
.list-group-item.active .list-group-item-heading,
.list-group-item.active:hover .list-group-item-heading,
.list-group-item.active:focus .list-group-item-heading,
.list-group-item.active .list-group-item-heading > small,
.list-group-item.active:hover .list-group-item-heading > small,
.list-group-item.active:focus .list-group-item-heading > small,
.list-group-item.active .list-group-item-heading > .small,
.list-group-item.active:hover .list-group-item-heading > .small,
.list-group-item.active:focus .list-group-item-heading > .small {
color: inherit;
}
.list-group-item.active .list-group-item-text,
.list-group-item.active:hover .list-group-item-text,
.list-group-item.active:focus .list-group-item-text {
color: #b8f2d2;
}
a.list-group-item,
button.list-group-item {
color: #555;
}
a.list-group-item .list-group-item-heading,
button.list-group-item .list-group-item-heading {
color: #333;
}
a.list-group-item:hover,
button.list-group-item:hover,
a.list-group-item:focus,
button.list-group-item:focus {
color: #555;
text-decoration: none;
background-color: #f5f5f5;
}
button.list-group-item {
width: 100%;
text-align: left;
}
.list-group-item-success {
color: #3c763d;
background-color: #dff0d8;
}
a.list-group-item-success,
button.list-group-item-success {
color: #3c763d;
}
a.list-group-item-success .list-group-item-heading,
button.list-group-item-success .list-group-item-heading {
color: inherit;
}
a.list-group-item-success:hover,
button.list-group-item-success:hover,
a.list-group-item-success:focus,
button.list-group-item-success:focus {
color: #3c763d;
background-color: #d0e9c6;
}
a.list-group-item-success.active,
button.list-group-item-success.active,
a.list-group-item-success.active:hover,
button.list-group-item-success.active:hover,
a.list-group-item-success.active:focus,
button.list-group-item-success.active:focus {
color: #fff;
background-color: #3c763d;
border-color: #3c763d;
}
.list-group-item-info {
color: #31708f;
background-color: #d9edf7;
}
a.list-group-item-info,
button.list-group-item-info {
color: #31708f;
}
a.list-group-item-info .list-group-item-heading,
button.list-group-item-info .list-group-item-heading {
color: inherit;
}
a.list-group-item-info:hover,
button.list-group-item-info:hover,
a.list-group-item-info:focus,
button.list-group-item-info:focus {
color: #31708f;
background-color: #c4e3f3;
}
a.list-group-item-info.active,
button.list-group-item-info.active,
a.list-group-item-info.active:hover,
button.list-group-item-info.active:hover,
a.list-group-item-info.active:focus,
button.list-group-item-info.active:focus {
color: #fff;
background-color: #31708f;
border-color: #31708f;
}
.list-group-item-warning {
color: #8a6d3b;
background-color: #fcf8e3;
}
a.list-group-item-warning,
button.list-group-item-warning {
color: #8a6d3b;
}
a.list-group-item-warning .list-group-item-heading,
button.list-group-item-warning .list-group-item-heading {
color: inherit;
}
a.list-group-item-warning:hover,
button.list-group-item-warning:hover,
a.list-group-item-warning:focus,
button.list-group-item-warning:focus {
color: #8a6d3b;
background-color: #faf2cc;
}
a.list-group-item-warning.active,
button.list-group-item-warning.active,
a.list-group-item-warning.active:hover,
button.list-group-item-warning.active:hover,
a.list-group-item-warning.active:focus,
button.list-group-item-warning.active:focus {
color: #fff;
background-color: #8a6d3b;
border-color: #8a6d3b;
}
.list-group-item-danger {
color: #a94442;
background-color: #f2dede;
}
a.list-group-item-danger,
button.list-group-item-danger {
color: #a94442;
}
a.list-group-item-danger .list-group-item-heading,
button.list-group-item-danger .list-group-item-heading {
color: inherit;
}
a.list-group-item-danger:hover,
button.list-group-item-danger:hover,
a.list-group-item-danger:focus,
button.list-group-item-danger:focus {
color: #a94442;
background-color: #ebcccc;
}
a.list-group-item-danger.active,
button.list-group-item-danger.active,
a.list-group-item-danger.active:hover,
button.list-group-item-danger.active:hover,
a.list-group-item-danger.active:focus,
button.list-group-item-danger.active:focus {
color: #fff;
background-color: #a94442;
border-color: #a94442;
}
.list-group-item-heading {
margin-top: 0;
margin-bottom: 5px;
}
.list-group-item-text {
margin-bottom: 0;
line-height: 1.3;
}
.panel { .panel {
margin-bottom: 20px; margin-bottom: 20px;
background-color: var(--panel-bg); background-color: var(--panel-bg);

23
static/css/pricing.css
View file

@ -13,6 +13,17 @@
text-shadow: 0px 1px var(--panel-bg), -1px 1px var(--panel-bg), 1px 1px var(--panel-bg), -1px 0px var(--panel-bg); text-shadow: 0px 1px var(--panel-bg), -1px 1px var(--panel-bg), 1px 1px var(--panel-bg), -1px 0px var(--panel-bg);
} }
.panel.plan ul {
margin: 0;
padding: 0;
list-style: none;
}
.panel.plan li {
border-top: 1px solid var(--border-color);
padding: 10px 8px;
}
.hobbyist h1 { .hobbyist h1 {
color: var(--plan-hobbyist-color); color: var(--plan-hobbyist-color);
border-bottom: 3px solid var(--plan-hobbyist-border); border-bottom: 3px solid var(--plan-hobbyist-border);
@ -54,15 +65,6 @@
border-color: #22bc66; border-color: #22bc66;
} }
.plan .list-group-item {
padding: 10px 8px;
}
.plan .list-group-item:last-child {
border-bottom: 0;
}
.error-message { .error-message {
font-family: monospace; font-family: monospace;
} }
@ -88,11 +90,12 @@
#plans .panel-footer { #plans .panel-footer {
background: transparent; background: transparent;
border-top: 0;
} }
#annual-note { #annual-note {
margin: 10px 0; margin: 10px 0;
color: #AAA; color: var(--text-muted);
} }
.page-pricing span[data-help] { .page-pricing span[data-help] {

2
stuff/bootstrap/bootstrap.less vendored
View file

@ -39,7 +39,7 @@
@import "alerts.less"; @import "alerts.less";
// @import "progress-bars.less"; // @import "progress-bars.less";
// @import "media.less"; // @import "media.less";
@import "list-group.less"; // @import "list-group.less";
@import "panels.less"; @import "panels.less";
// @import "responsive-embed.less"; // @import "responsive-embed.less";
// @import "wells.less"; // @import "wells.less";

64
templates/payments/pricing.html
View file

@ -77,20 +77,20 @@
<h1>Hobbyist</h1> <h1>Hobbyist</h1>
<h2>$0 <span class="mo">/ month</span></h2> <h2>$0 <span class="mo">/ month</span></h2>
</div> </div>
<ul class="list-group text-center"> <ul class="text-center">
<li class="list-group-item"><i class="fa fa-check"></i> 20 checks</li> <li><i class="fa fa-check"></i> 20 checks</li>
<li class="list-group-item"> <li>
<span data-help="team-size-help">3 team members</span> <span data-help="team-size-help">3 team members</span>
</li> </li>
<li class="list-group-item"> <li>
<span data-help="log-limit-help">100 log entries per check</span> <span data-help="log-limit-help">100 log entries per check</span>
</li> </li>
<li class="list-group-item">API access</li> <li>API access</li>
<li class="list-group-item"> <li>
<span data-help="sms-help">5 SMS &amp; WhatsApp credits</span> <span data-help="sms-help">5 SMS &amp; WhatsApp credits</span>
</li> </li>
<li class="list-group-item">&nbsp;</li> <li>&nbsp;</li>
<li class="list-group-item">&nbsp;</li> <li>&nbsp;</li>
</ul> </ul>
{% if not request.user.is_authenticated %} {% if not request.user.is_authenticated %}
@ -111,22 +111,22 @@
<span class="mo">/ month</span> <span class="mo">/ month</span>
</h2> </h2>
</div> </div>
<ul class="list-group text-center"> <ul class="text-center">
<li class="list-group-item"><i class="fa fa-check"></i> 20 checks</li> <li><i class="fa fa-check"></i> 20 checks</li>
<li class="list-group-item"> <li>
<span data-help="team-size-help">3 team members</span> <span data-help="team-size-help">3 team members</span>
</li> </li>
<li class="list-group-item"> <li>
<span data-help="log-limit-help">1000 log entries per check</span> <span data-help="log-limit-help">1000 log entries per check</span>
</li> </li>
<li class="list-group-item">API access</li> <li>API access</li>
<li class="list-group-item"> <li>
<span data-help="sms-help">5 SMS &amp; WhatsApp credits</span> <span data-help="sms-help">5 SMS &amp; WhatsApp credits</span>
</li> </li>
<li class="list-group-item"> <li>
<span data-help="phone-call-help">5 phone call credits</span> <span data-help="phone-call-help">5 phone call credits</span>
</li> </li>
<li class="list-group-item">Email support</li> <li>Email support</li>
</ul> </ul>
{% if not request.user.is_authenticated %} {% if not request.user.is_authenticated %}
@ -150,22 +150,22 @@
</h2> </h2>
</div> </div>
<ul class="list-group text-center"> <ul class="text-center">
<li class="list-group-item">100 checks</li> <li>100 checks</li>
<li class="list-group-item"> <li>
<span data-help="team-size-help">10 team members</span> <span data-help="team-size-help">10 team members</span>
</li> </li>
<li class="list-group-item"> <li>
<span data-help="log-limit-help">1000 log entries per check</span> <span data-help="log-limit-help">1000 log entries per check</span>
</li> </li>
<li class="list-group-item">API access</li> <li>API access</li>
<li class="list-group-item"> <li>
<span data-help="sms-help">50 SMS &amp; WhatsApp credits</span> <span data-help="sms-help">50 SMS &amp; WhatsApp credits</span>
</li> </li>
<li class="list-group-item"> <li>
<span data-help="phone-call-help">20 phone call credits</span> <span data-help="phone-call-help">20 phone call credits</span>
</li> </li>
<li class="list-group-item">Email support</li> <li>Email support</li>
</ul> </ul>
{% if not request.user.is_authenticated %} {% if not request.user.is_authenticated %}
@ -189,22 +189,22 @@
</h2> </h2>
</div> </div>
<ul class="list-group text-center"> <ul class="text-center">
<li class="list-group-item">1000 checks</li> <li>1000 checks</li>
<li class="list-group-item"> <li>
<span data-help="team-size-help">Unlimited team members</span> <span data-help="team-size-help">Unlimited team members</span>
</li> </li>
<li class="list-group-item"> <li>
<span data-help="log-limit-help">1000 log entries per check</span> <span data-help="log-limit-help">1000 log entries per check</span>
</li> </li>
<li class="list-group-item">API access</li> <li>API access</li>
<li class="list-group-item"> <li>
<span data-help="sms-help">500 SMS &amp; WhatsApp credits</span> <span data-help="sms-help">500 SMS &amp; WhatsApp credits</span>
</li> </li>
<li class="list-group-item"> <li>
<span data-help="phone-call-help">100 phone call credits</span> <span data-help="phone-call-help">100 phone call credits</span>
</li> </li>
<li class="list-group-item">Priority email support</li> <li>Priority email support</li>
</ul> </ul>
{% if not request.user.is_authenticated %} {% if not request.user.is_authenticated %}