Skip to content
This repository has been archived by the owner on Jul 10, 2024. It is now read-only.

Commit

Permalink
Show the 'down' message for five full seconds before showing the coun…
Browse files Browse the repository at this point in the history 
…tdown
  • Loading branch information
@zackbloom
zackbloom committed Dec 9, 2013
1 parent 55c8c84 commit 8dffa1c
Show file tree
Hide file tree
Showing 6 changed files with 145 additions and 120 deletions.
25 changes: 15 additions & 10 deletions sass/_offline-theme-base.sass
View file
Original file line number Diff line number Diff line change
Expand Up @@ -42,15 +42,6 @@
&.offline-ui-down
display: block

.offline-ui-content:before
content: "Your computer lost its internet connection. "

@media (max-width: 1024px)
content: "Your device lost its internet connection. "

@media (max-width: 568px)
content: "Your device isn't connected. "

&.offline-ui-connecting, &.offline-ui-connecting-2s

.offline-ui-content:before
Expand All @@ -73,4 +64,18 @@
display: none

.offline-ui-content:before
content: "Connection attempt failed. "
content: "Connection attempt failed. "

&.offline-ui-down-5s

.offline-ui-content:before
content: "Your computer lost its internet connection. "

@media (max-width: 1024px)
content: "Your device lost its internet connection. "

@media (max-width: 568px)
content: "Your device isn't connected. "

&.offline-ui-waiting .offline-ui-retry
display: none
48 changes: 26 additions & 22 deletions themes/offline-theme-chrome.css
View file
Original file line number Diff line number Diff line change
Expand Up @@ -56,48 +56,52 @@
.offline-ui.offline-ui-down {
display: block;
}
/* line 45, ../sass/_offline-theme-base.sass */
.offline-ui.offline-ui-down .offline-ui-content:before {
content: "Your computer lost its internet connection. ";
}
@media (max-width: 1024px) {
/* line 45, ../sass/_offline-theme-base.sass */
.offline-ui.offline-ui-down .offline-ui-content:before {
content: "Your device lost its internet connection. ";
}
}
@media (max-width: 568px) {
/* line 45, ../sass/_offline-theme-base.sass */
.offline-ui.offline-ui-down .offline-ui-content:before {
content: "Your device isn't connected. ";
}
}
/* line 56, ../sass/_offline-theme-base.sass */
/* line 47, ../sass/_offline-theme-base.sass */
.offline-ui.offline-ui-down.offline-ui-connecting .offline-ui-content:before, .offline-ui.offline-ui-down.offline-ui-connecting-2s .offline-ui-content:before {
content: "Attempting to reconnect... ";
}
/* line 61, ../sass/_offline-theme-base.sass */
/* line 52, ../sass/_offline-theme-base.sass */
.offline-ui.offline-ui-down.offline-ui-waiting .offline-ui-retry {
display: block;
}
/* line 64, ../sass/_offline-theme-base.sass */
/* line 55, ../sass/_offline-theme-base.sass */
.offline-ui.offline-ui-down.offline-ui-waiting .offline-ui-content:before {
content: "Attempting to reconnect in " attr(data-retry-in) "... ";
}
@media (max-width: 568px) {
/* line 64, ../sass/_offline-theme-base.sass */
/* line 55, ../sass/_offline-theme-base.sass */
.offline-ui.offline-ui-down.offline-ui-waiting .offline-ui-content:before {
content: "Connecting in " attr(data-retry-in-abbr) "... ";
}
}
/* line 72, ../sass/_offline-theme-base.sass */
/* line 63, ../sass/_offline-theme-base.sass */
.offline-ui.offline-ui-down.offline-ui-reconnect-failed-2s.offline-ui-waiting .offline-ui-retry {
display: none;
}
/* line 75, ../sass/_offline-theme-base.sass */
/* line 66, ../sass/_offline-theme-base.sass */
.offline-ui.offline-ui-down.offline-ui-reconnect-failed-2s .offline-ui-content:before {
content: "Connection attempt failed. ";
}
/* line 71, ../sass/_offline-theme-base.sass */
.offline-ui.offline-ui-down.offline-ui-down-5s .offline-ui-content:before {
content: "Your computer lost its internet connection. ";
}
@media (max-width: 1024px) {
/* line 71, ../sass/_offline-theme-base.sass */
.offline-ui.offline-ui-down.offline-ui-down-5s .offline-ui-content:before {
content: "Your device lost its internet connection. ";
}
}
@media (max-width: 568px) {
/* line 71, ../sass/_offline-theme-base.sass */
.offline-ui.offline-ui-down.offline-ui-down-5s .offline-ui-content:before {
content: "Your device isn't connected. ";
}
}
/* line 80, ../sass/_offline-theme-base.sass */
.offline-ui.offline-ui-down.offline-ui-down-5s.offline-ui-waiting .offline-ui-retry {
display: none;
}

@-webkit-keyframes offline-dropin {
/* line 40, ../sass/_keyframes.sass */
Expand Down
48 changes: 26 additions & 22 deletions themes/offline-theme-dark.css
View file
Original file line number Diff line number Diff line change
Expand Up @@ -56,48 +56,52 @@
.offline-ui.offline-ui-down {
display: block;
}
/* line 45, ../sass/_offline-theme-base.sass */
.offline-ui.offline-ui-down .offline-ui-content:before {
content: "Your computer lost its internet connection. ";
}
@media (max-width: 1024px) {
/* line 45, ../sass/_offline-theme-base.sass */
.offline-ui.offline-ui-down .offline-ui-content:before {
content: "Your device lost its internet connection. ";
}
}
@media (max-width: 568px) {
/* line 45, ../sass/_offline-theme-base.sass */
.offline-ui.offline-ui-down .offline-ui-content:before {
content: "Your device isn't connected. ";
}
}
/* line 56, ../sass/_offline-theme-base.sass */
/* line 47, ../sass/_offline-theme-base.sass */
.offline-ui.offline-ui-down.offline-ui-connecting .offline-ui-content:before, .offline-ui.offline-ui-down.offline-ui-connecting-2s .offline-ui-content:before {
content: "Attempting to reconnect... ";
}
/* line 61, ../sass/_offline-theme-base.sass */
/* line 52, ../sass/_offline-theme-base.sass */
.offline-ui.offline-ui-down.offline-ui-waiting .offline-ui-retry {
display: block;
}
/* line 64, ../sass/_offline-theme-base.sass */
/* line 55, ../sass/_offline-theme-base.sass */
.offline-ui.offline-ui-down.offline-ui-waiting .offline-ui-content:before {
content: "Attempting to reconnect in " attr(data-retry-in) "... ";
}
@media (max-width: 568px) {
/* line 64, ../sass/_offline-theme-base.sass */
/* line 55, ../sass/_offline-theme-base.sass */
.offline-ui.offline-ui-down.offline-ui-waiting .offline-ui-content:before {
content: "Connecting in " attr(data-retry-in-abbr) "... ";
}
}
/* line 72, ../sass/_offline-theme-base.sass */
/* line 63, ../sass/_offline-theme-base.sass */
.offline-ui.offline-ui-down.offline-ui-reconnect-failed-2s.offline-ui-waiting .offline-ui-retry {
display: none;
}
/* line 75, ../sass/_offline-theme-base.sass */
/* line 66, ../sass/_offline-theme-base.sass */
.offline-ui.offline-ui-down.offline-ui-reconnect-failed-2s .offline-ui-content:before {
content: "Connection attempt failed. ";
}
/* line 71, ../sass/_offline-theme-base.sass */
.offline-ui.offline-ui-down.offline-ui-down-5s .offline-ui-content:before {
content: "Your computer lost its internet connection. ";
}
@media (max-width: 1024px) {
/* line 71, ../sass/_offline-theme-base.sass */
.offline-ui.offline-ui-down.offline-ui-down-5s .offline-ui-content:before {
content: "Your device lost its internet connection. ";
}
}
@media (max-width: 568px) {
/* line 71, ../sass/_offline-theme-base.sass */
.offline-ui.offline-ui-down.offline-ui-down-5s .offline-ui-content:before {
content: "Your device isn't connected. ";
}
}
/* line 80, ../sass/_offline-theme-base.sass */
.offline-ui.offline-ui-down.offline-ui-down-5s.offline-ui-waiting .offline-ui-retry {
display: none;
}

@-webkit-keyframes offline-dropin {
/* line 40, ../sass/_keyframes.sass */
Expand Down
48 changes: 26 additions & 22 deletions themes/offline-theme-default.css
View file
Original file line number Diff line number Diff line change
Expand Up @@ -56,48 +56,52 @@
.offline-ui.offline-ui-down {
display: block;
}
/* line 45, ../sass/_offline-theme-base.sass */
.offline-ui.offline-ui-down .offline-ui-content:before {
content: "Your computer lost its internet connection. ";
}
@media (max-width: 1024px) {
/* line 45, ../sass/_offline-theme-base.sass */
.offline-ui.offline-ui-down .offline-ui-content:before {
content: "Your device lost its internet connection. ";
}
}
@media (max-width: 568px) {
/* line 45, ../sass/_offline-theme-base.sass */
.offline-ui.offline-ui-down .offline-ui-content:before {
content: "Your device isn't connected. ";
}
}
/* line 56, ../sass/_offline-theme-base.sass */
/* line 47, ../sass/_offline-theme-base.sass */
.offline-ui.offline-ui-down.offline-ui-connecting .offline-ui-content:before, .offline-ui.offline-ui-down.offline-ui-connecting-2s .offline-ui-content:before {
content: "Attempting to reconnect... ";
}
/* line 61, ../sass/_offline-theme-base.sass */
/* line 52, ../sass/_offline-theme-base.sass */
.offline-ui.offline-ui-down.offline-ui-waiting .offline-ui-retry {
display: block;
}
/* line 64, ../sass/_offline-theme-base.sass */
/* line 55, ../sass/_offline-theme-base.sass */
.offline-ui.offline-ui-down.offline-ui-waiting .offline-ui-content:before {
content: "Attempting to reconnect in " attr(data-retry-in) "... ";
}
@media (max-width: 568px) {
/* line 64, ../sass/_offline-theme-base.sass */
/* line 55, ../sass/_offline-theme-base.sass */
.offline-ui.offline-ui-down.offline-ui-waiting .offline-ui-content:before {
content: "Connecting in " attr(data-retry-in-abbr) "... ";
}
}
/* line 72, ../sass/_offline-theme-base.sass */
/* line 63, ../sass/_offline-theme-base.sass */
.offline-ui.offline-ui-down.offline-ui-reconnect-failed-2s.offline-ui-waiting .offline-ui-retry {
display: none;
}
/* line 75, ../sass/_offline-theme-base.sass */
/* line 66, ../sass/_offline-theme-base.sass */
.offline-ui.offline-ui-down.offline-ui-reconnect-failed-2s .offline-ui-content:before {
content: "Connection attempt failed. ";
}
/* line 71, ../sass/_offline-theme-base.sass */
.offline-ui.offline-ui-down.offline-ui-down-5s .offline-ui-content:before {
content: "Your computer lost its internet connection. ";
}
@media (max-width: 1024px) {
/* line 71, ../sass/_offline-theme-base.sass */
.offline-ui.offline-ui-down.offline-ui-down-5s .offline-ui-content:before {
content: "Your device lost its internet connection. ";
}
}
@media (max-width: 568px) {
/* line 71, ../sass/_offline-theme-base.sass */
.offline-ui.offline-ui-down.offline-ui-down-5s .offline-ui-content:before {
content: "Your device isn't connected. ";
}
}
/* line 80, ../sass/_offline-theme-base.sass */
.offline-ui.offline-ui-down.offline-ui-down-5s.offline-ui-waiting .offline-ui-retry {
display: none;
}

@-webkit-keyframes offline-fadein {
/* line 6, ../sass/_keyframes.sass */
Expand Down
48 changes: 26 additions & 22 deletions themes/offline-theme-hubspot.css
View file
Original file line number Diff line number Diff line change
Expand Up @@ -56,48 +56,52 @@
.offline-ui.offline-ui-down {
display: block;
}
/* line 45, ../sass/_offline-theme-base.sass */
.offline-ui.offline-ui-down .offline-ui-content:before {
content: "Your computer lost its internet connection. ";
}
@media (max-width: 1024px) {
/* line 45, ../sass/_offline-theme-base.sass */
.offline-ui.offline-ui-down .offline-ui-content:before {
content: "Your device lost its internet connection. ";
}
}
@media (max-width: 568px) {
/* line 45, ../sass/_offline-theme-base.sass */
.offline-ui.offline-ui-down .offline-ui-content:before {
content: "Your device isn't connected. ";
}
}
/* line 56, ../sass/_offline-theme-base.sass */
/* line 47, ../sass/_offline-theme-base.sass */
.offline-ui.offline-ui-down.offline-ui-connecting .offline-ui-content:before, .offline-ui.offline-ui-down.offline-ui-connecting-2s .offline-ui-content:before {
content: "Attempting to reconnect... ";
}
/* line 61, ../sass/_offline-theme-base.sass */
/* line 52, ../sass/_offline-theme-base.sass */
.offline-ui.offline-ui-down.offline-ui-waiting .offline-ui-retry {
display: block;
}
/* line 64, ../sass/_offline-theme-base.sass */
/* line 55, ../sass/_offline-theme-base.sass */
.offline-ui.offline-ui-down.offline-ui-waiting .offline-ui-content:before {
content: "Attempting to reconnect in " attr(data-retry-in) "... ";
}
@media (max-width: 568px) {
/* line 64, ../sass/_offline-theme-base.sass */
/* line 55, ../sass/_offline-theme-base.sass */
.offline-ui.offline-ui-down.offline-ui-waiting .offline-ui-content:before {
content: "Connecting in " attr(data-retry-in-abbr) "... ";
}
}
/* line 72, ../sass/_offline-theme-base.sass */
/* line 63, ../sass/_offline-theme-base.sass */
.offline-ui.offline-ui-down.offline-ui-reconnect-failed-2s.offline-ui-waiting .offline-ui-retry {
display: none;
}
/* line 75, ../sass/_offline-theme-base.sass */
/* line 66, ../sass/_offline-theme-base.sass */
.offline-ui.offline-ui-down.offline-ui-reconnect-failed-2s .offline-ui-content:before {
content: "Connection attempt failed. ";
}
/* line 71, ../sass/_offline-theme-base.sass */
.offline-ui.offline-ui-down.offline-ui-down-5s .offline-ui-content:before {
content: "Your computer lost its internet connection. ";
}
@media (max-width: 1024px) {
/* line 71, ../sass/_offline-theme-base.sass */
.offline-ui.offline-ui-down.offline-ui-down-5s .offline-ui-content:before {
content: "Your device lost its internet connection. ";
}
}
@media (max-width: 568px) {
/* line 71, ../sass/_offline-theme-base.sass */
.offline-ui.offline-ui-down.offline-ui-down-5s .offline-ui-content:before {
content: "Your device isn't connected. ";
}
}
/* line 80, ../sass/_offline-theme-base.sass */
.offline-ui.offline-ui-down.offline-ui-down-5s.offline-ui-waiting .offline-ui-retry {
display: none;
}

@-webkit-keyframes offline-fadein {
/* line 6, ../sass/_keyframes.sass */
Expand Down
Loading

0 comments on commit 8dffa1c

Please sign in to comment.