Verified Commit 08f896e1 authored by Roberto Bochet's avatar Roberto Bochet
Browse files

Update bits client

parent 4e03f820
<div class="material-kit hq-status-fab">
<a class="btn btn-round btn-lg btn-gialla loading" href="https://bits.poul.org" title="POuL headquarters status">
<i class="loading-indicator fa fa-sync fa-spin fa-fw"></i>
<div class="ripple-container"></div>
</a>
<div class="hq-status-fab">
<a class="btn bits bits-loading" href="https://bits.poul.org" title="POuL headquarters status"></a>
</div>
{% assign page.has_bits_button = true %}
......@@ -2,128 +2,6 @@
z-index: unset !important;
}
/* purgecss start ignore */
.material-kit .btn:not(.loading) i.loading-indicator,
.material-kit .btn:not(.loading) i.loading-indicator::before {
display: none !important;
}
.btn {
top: 0;
.material-kit & {
text-transform: none;
}
&, &:after {
font-family: $sans-serif;
font-weight: bold;
}
&.loading {
i.loading-indicator.fa.fa-spin.fa-fw {
top: -1px;
}
&.btn-gialla {
padding-left: 16px;
padding-right: 16px;
&:after {
content: none;
}
}
}
&.btn-gialla {
color: #fff;
background-color: #ffc500;
border-color: #ffc500;
box-shadow: 0 2px 2px 0 rgba(255, 152, 0, 0.14), 0 3px 1px -2px rgba(255, 152, 0, 0.2), 0 1px 5px 0 rgba(255, 152, 0, 0.12);
transition: 0.5s linear width, 0.5s linear padding;
&:hover {
color: #fff;
background-color: #ffc500;
border-color: #7f6200;
box-shadow: 0 14px 26px -12px rgba(255, 202, 43, 0.42), 0 4px 23px 0px rgba(0, 0, 0, 0.12), 0 8px 10px -5px rgba(153, 153, 153, 0.2);
}
&:after {
content: 'HQs GIALLA';
}
&:focus, &.focus {
box-shadow: none, 0 0 0 0.2rem rgba(127, 98, 0, 1);
}
&:disabled, &.disabled {
color: #212529;
background-color: #ffc500;
border-color: #ffc500;
}
}
&.btn-open {
color: #fff;
background-color: #387002;
border-color: #387002;
box-shadow: 0 2px 2px 0 rgba(28, 56, 1, 0.14), 0 3px 1px -2px rgba(28, 56, 1, 0.2), 0 1px 5px 0 rgba(28, 56, 1, 0.12);
&:hover {
color: #fff;
background-color: #387002;
border-color: #1c3801;
box-shadow: 0 14px 26px -12px rgba(43, 187, 3, 0.42), 0 4px 23px 0px rgba(0, 0, 0, 0.12), 0 8px 10px -5px rgba(153, 153, 153, 0.2);
}
&:after {
content: 'HQs OPEN';
}
&:focus, &.focus {
box-shadow: none, 0 0 0 0.2rem rgb(28, 56, 1);
}
&:disabled, &.disabled {
color: #212529;
background-color: #387002;
border-color: #1c3801;
}
}
&.btn-closed {
color: #fff;
background-color: #d32f2f;
border-color: #d32f2f;
box-shadow: 0 2px 2px 0 rgba(105, 23, 23, 0.14), 0 3px 1px -2px rgba(105, 23, 23, 0.2), 0 1px 5px 0 rgba(105, 23, 23, 0.12);
&:hover {
color: #fff;
background-color: #d32f2f;
border-color: #691717;
box-shadow: 0 14px 26px -12px rgba(213, 7, 7, 0.42), 0 4px 23px 0px rgba(0, 0, 0, 0.12), 0 8px 10px -5px rgba(153, 153, 153, 0.2);
}
&:after {
content: 'HQs CLOSED';
}
&:focus, &.focus {
box-shadow: none, 0 0 0 0.2rem rgb(105, 23, 23);
}
&:disabled, &.disabled {
color: #212529;
background-color: #d32f2f;
border-color: #691717;
}
}
}
.stick-to-bar {
position: fixed !important;
left: 0 !important;
......@@ -143,5 +21,3 @@
content: 'open';
}
}
\ No newline at end of file
/* purgecss end ignore */
.bits {
&-loading {
@extend .btn-yellow;
&:before {
display: inline-block;
font: normal normal normal 14px/1 ForkAwesome;
content: "\f021";
animation: spin 2s infinite linear;
}
}
&-open {
@extend .btn-green;
&:before {
content: "HQs OPEN";
}
}
&-closed {
@extend .btn-red;
&:before {
content: "HQs CLOSED";
}
}
&-error {
&:before {
content: "BITS DOWN :(";
}
}
}
\ No newline at end of file
......@@ -11,10 +11,9 @@ document.addEventListener('DOMContentLoaded', () => {
throw new Error();
}).then(isOpen => {
document.querySelectorAll(".hq-status-fab .btn").forEach(e => {
e.classList.remove("btn-gialla");
e.classList.remove("loading");
e.classList.add(isOpen ? "btn-open" : "btn-closed");
document.querySelectorAll(".bits").forEach(e => {
e.classList.remove("bits-loading");
e.classList.add(isOpen ? "bits-open" : "bits-closed");
});
document.querySelectorAll("#we-are-currently").forEach(e => {
......@@ -22,5 +21,9 @@ document.addEventListener('DOMContentLoaded', () => {
});
}).catch(e => {
console.error("Impossible fetch bits data");
document.querySelectorAll(".bits").forEach(e => {
e.classList.remove("bits-loading");
e.classList.add("bits-error");
});
});
});
\ No newline at end of file
Markdown is supported
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment