Publish Vulpes Preview 15 sources for desktop, Android and Tundra
Share Gaia assets and adapters, keep private profiles and development documents local, and update both public READMEs.
243
overrides/costcontrol.gaiamobile.org/style/app.css
Normal file
|
|
@ -0,0 +1,243 @@
|
|||
/* GENERAL */
|
||||
* {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
a:focus,
|
||||
a::-moz-focus-inner {
|
||||
outline: none;
|
||||
border: none;
|
||||
}
|
||||
|
||||
html {
|
||||
font-size: 10px;
|
||||
color: #000;
|
||||
-moz-user-select: none;
|
||||
}
|
||||
|
||||
body {
|
||||
background-color: #000;
|
||||
}
|
||||
|
||||
iframe {
|
||||
border: none;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
display: flex; /* Fix Bug 976665 */
|
||||
}
|
||||
|
||||
[hidden] { display: none !important; }
|
||||
|
||||
input.error {
|
||||
background-color: rgba(219, 113, 95, 0.2) !important;
|
||||
border-color: #db715f !important;
|
||||
color: #c3503c;
|
||||
}
|
||||
|
||||
/* WINDOW & VIEWS */
|
||||
.window, .view {
|
||||
position: fixed;
|
||||
left: 0;
|
||||
top: 0;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
z-index: 5;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.window {
|
||||
opacity: 1.0;
|
||||
background: #f4f4f4;
|
||||
transition: opacity ease 0.2s;
|
||||
}
|
||||
|
||||
.splash {
|
||||
background-color: black;
|
||||
background-repeat: no-repeat;
|
||||
background-position: center center;
|
||||
background-image: url("/style/icons/cost-control.png");
|
||||
background-size: 6rem;
|
||||
}
|
||||
|
||||
|
||||
.window.non-ready {
|
||||
opacity: 0.0;
|
||||
}
|
||||
|
||||
/* Hide/show tab panel when other views show up */
|
||||
|
||||
#tabpanel {
|
||||
transition: visibility var(--transition-duration);
|
||||
}
|
||||
|
||||
#tabpanel.behind {
|
||||
visibility: hidden;
|
||||
}
|
||||
|
||||
/**
|
||||
* 1. GaiaHeader will vertically align
|
||||
* display block elements
|
||||
*/
|
||||
|
||||
gaia-header [data-icon]:before {
|
||||
display: block; /* 1 */
|
||||
color: var(--header-button-color, #000);
|
||||
}
|
||||
|
||||
#fte_view.non-ready {
|
||||
pointer-events: none;
|
||||
}
|
||||
|
||||
.view {
|
||||
top: 9.3rem;
|
||||
background: #f4f4f4;
|
||||
transform: translate(0, 0);
|
||||
transition: transform 0.5s ease,
|
||||
opacity 0.2s ease,
|
||||
visibility 0.5s;
|
||||
}
|
||||
|
||||
#balance-tab,
|
||||
#telephony-tab {
|
||||
background: #fff;
|
||||
}
|
||||
|
||||
.view.standalone {
|
||||
top: 5rem;
|
||||
}
|
||||
|
||||
.view-scroll {
|
||||
overflow-x: hidden;
|
||||
overflow-y: auto;
|
||||
position: absolute;
|
||||
-moz-user-select: none;
|
||||
bottom: 0;
|
||||
top: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
}
|
||||
|
||||
/* VIEWPORTS */
|
||||
.view.behind {
|
||||
visibility: hidden;
|
||||
}
|
||||
|
||||
.view[data-viewport="ethereal"] {
|
||||
pointer-events: none;
|
||||
opacity: 0;
|
||||
visibility: hidden;
|
||||
}
|
||||
|
||||
.view[data-viewport="bottom"] {
|
||||
transform: translateY(100%);
|
||||
visibility: hidden;
|
||||
}
|
||||
|
||||
.view[data-viewport="top"] {
|
||||
transform: translateY(-100%);
|
||||
visibility: hidden;
|
||||
}
|
||||
|
||||
.view[data-viewport="left"] {
|
||||
transform: translateX(-100%);
|
||||
visibility: hidden;
|
||||
}
|
||||
|
||||
.view[data-viewport="right"] {
|
||||
transform: translateX(100%);
|
||||
visibility: hidden;
|
||||
}
|
||||
|
||||
.view[data-viewport="inside"] {
|
||||
transform: scale(0.3);
|
||||
opacity: 0;
|
||||
pointer-events: none;
|
||||
visibility: hidden;
|
||||
}
|
||||
|
||||
#settings-view.view {
|
||||
top: 0;
|
||||
}
|
||||
|
||||
/* BB HEADER ICONS */
|
||||
[icon="config"]:before {
|
||||
background-image: image-set(url("images/app/icons/config.png") 1x, url("images/app/icons/config@1.5x.png") 1.5x, url("images/app/icons/config@2x.png") 2x, url("images/app/icons/config@2.25x.png") 2.25x);
|
||||
}
|
||||
|
||||
/* BB BUTTONS ICONS */
|
||||
.buttons-list {
|
||||
list-style: none;
|
||||
}
|
||||
|
||||
.fake-select select {
|
||||
height: 100%;
|
||||
position: absolute;
|
||||
-moz-user-select: none;
|
||||
top: 0;
|
||||
left: 0;
|
||||
opacity: 0;
|
||||
}
|
||||
|
||||
li button.icon-reload:before {
|
||||
background-image: image-set(url("images/app/icons/reload.png") 1x, url("images/app/icons/reload@1.5x.png") 1.5x, url("images/app/icons/reload@2x.png") 2x, url("images/app/icons/reload@2.25x.png") 2.25x);
|
||||
background-size: 3rem;
|
||||
}
|
||||
|
||||
li button.icon-topup:before {
|
||||
background-image: image-set(url("images/app/icons/topup.png") 1x, url("images/app/icons/topup@1.5x.png") 1.5x, url("images/app/icons/topup@2x.png") 2x, url("images/app/icons/topup@2.25x.png") 2.25x);
|
||||
background-size: 3rem;
|
||||
}
|
||||
|
||||
li button.icon-topupcode:before {
|
||||
background-image: image-set(url("images/app/icons/topupcode.png") 1x, url("images/app/icons/topupcode@1.5x.png") 1.5x, url("images/app/icons/topupcode@2x.png") 2x, url("images/app/icons/topupcode@2.25x.png") 2.25x);
|
||||
background-size: 3rem;
|
||||
}
|
||||
|
||||
/* CONTENT */
|
||||
section.content {
|
||||
padding: 1.5rem 2rem;
|
||||
}
|
||||
|
||||
#message-handler {
|
||||
visibility: hidden;
|
||||
}
|
||||
|
||||
#topup-dialog,
|
||||
#settings-view {
|
||||
z-index: 20;
|
||||
}
|
||||
|
||||
#reset-data-usage {
|
||||
margin-top: 1rem;
|
||||
}
|
||||
|
||||
/* GRAPHS */
|
||||
section.graph {
|
||||
position: relative;
|
||||
height: 28.5rem;
|
||||
flex: 1;
|
||||
}
|
||||
|
||||
section.graph canvas {
|
||||
position: absolute;
|
||||
-moz-user-select: none;
|
||||
left: 0;
|
||||
top: 0;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
/* FADE */
|
||||
.fade {
|
||||
opacity: 0;
|
||||
}
|
||||
|
||||
.fade.in {
|
||||
opacity: 1;
|
||||
transition: opacity var(--transition-duration) linear;
|
||||
}
|
||||
|
||||
.fade.out {
|
||||
transition: opacity var(--transition-duration) linear;
|
||||
}
|
||||
|
After Width: | Height: | Size: 615 B |
|
After Width: | Height: | Size: 1.3 KiB |
|
After Width: | Height: | Size: 1.3 KiB |
|
After Width: | Height: | Size: 530 B |
|
After Width: | Height: | Size: 912 B |
|
After Width: | Height: | Size: 1.2 KiB |
|
After Width: | Height: | Size: 281 B |
|
After Width: | Height: | Size: 427 B |
|
After Width: | Height: | Size: 667 B |
|
After Width: | Height: | Size: 466 B |
|
After Width: | Height: | Size: 998 B |
|
After Width: | Height: | Size: 905 B |
|
After Width: | Height: | Size: 647 B |
|
After Width: | Height: | Size: 1.1 KiB |
|
After Width: | Height: | Size: 605 B |
|
After Width: | Height: | Size: 394 B |
|
After Width: | Height: | Size: 341 B |
|
After Width: | Height: | Size: 306 B |
140
overrides/costcontrol.gaiamobile.org/style/views/balance.css
Normal file
|
|
@ -0,0 +1,140 @@
|
|||
/* OVERVIEW */
|
||||
#balance-tab-update-button {
|
||||
width: 13.5rem;
|
||||
}
|
||||
|
||||
#balance-tab .overview {
|
||||
font-size: 1.6rem;
|
||||
line-height: 1.6rem;
|
||||
border-bottom: solid 0.1rem #b7b7b7;
|
||||
box-shadow: 0 0.1rem 0 0 rgba(255, 255, 255, 0.8);
|
||||
margin-bottom: 1rem;
|
||||
padding: 0 0 0.8rem;
|
||||
overflow: hidden;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
html[dir="ltr"] #balance-tab .overview .info {
|
||||
transform: translateX(4.0rem);
|
||||
}
|
||||
html[dir="rtl"] #balance-tab .overview .info {
|
||||
transform: translateX(-4.0rem);
|
||||
}
|
||||
#balance-tab .overview .info {
|
||||
transition: transform var(--transition-duration);
|
||||
display: flex;
|
||||
flex-direction: row-reverse;
|
||||
align-items: center;
|
||||
margin-bottom: 1rem;
|
||||
padding-inline-start: 1rem;
|
||||
}
|
||||
|
||||
#balance-tab .overview .end {
|
||||
flex: 1;
|
||||
}
|
||||
|
||||
#balance-tab-credit {
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
/* COUNTDOWN */
|
||||
.countdown {
|
||||
font-size: 1.6rem;
|
||||
padding-bottom: 1.5rem;
|
||||
margin-bottom: 1.5rem;
|
||||
border-bottom: 1px solid #BBB;
|
||||
}
|
||||
|
||||
#top-up-countdown {
|
||||
color: #c7c9c6;
|
||||
}
|
||||
|
||||
/* ERROR MESSAGES */
|
||||
section.content .error-messages[hidden] {
|
||||
transform: translateY(-10rem);
|
||||
display: block !important;
|
||||
height: 0;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
section.content .error-messages {
|
||||
transform: translate(0,0);
|
||||
color: #b20000;
|
||||
font-size: 1.4rem;
|
||||
line-height: 1.4em;
|
||||
padding: 0 0.8rem 0.5rem;
|
||||
margin-bottom: 1.5rem;
|
||||
overflow: hidden;
|
||||
border-bottom: solid 1px #b20000;
|
||||
transition: all 0.2s ease;
|
||||
}
|
||||
|
||||
/* ICONS CONTAINER */
|
||||
#balance-tab .overview .icons {
|
||||
width: 2.2rem;
|
||||
height: 2.2rem;
|
||||
background-position: center;
|
||||
background-repeat: no-repeat;
|
||||
padding: 0 0.4rem;
|
||||
padding-inline-end: 0;
|
||||
margin: 0.5rem 1rem 1rem;
|
||||
flex: 0 0 2.2rem;
|
||||
}
|
||||
|
||||
/* ICONS*/
|
||||
#balance-tab .overview .icons progress,
|
||||
#balance-tab .overview .icons .warning {
|
||||
display: none;
|
||||
}
|
||||
|
||||
/* SPINNER */
|
||||
#balance-tab .overview .icons progress {
|
||||
margin: -0.5rem 0 0 -0.5rem;
|
||||
}
|
||||
|
||||
/* WARNING*/
|
||||
#balance-tab .overview .icons .warning {
|
||||
background: image-set(url("./../images/app/icons/warning.png") 1x, url("../images/app/icons/warning@1.5x.png") 1.5x, url("../images/app/icons/warning@2x.png") 2x, url("../images/app/icons/warning@2.25x.png") 2.25x) no-repeat center / 2.2rem;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
/* ALL STATES */
|
||||
html[dir="ltr"] #balance-tab.updating .overview > .info,
|
||||
html[dir="rtl"] #balance-tab.updating .overview > .info,
|
||||
html[dir="ltr"] #balance-tab.warning .overview > .info,
|
||||
html[dir="rtl"] #balance-tab.warning .overview > .info {
|
||||
transform: none;
|
||||
}
|
||||
|
||||
/* UPDATING STATE */
|
||||
#balance-tab.updating .overview .icons progress {
|
||||
display: block;
|
||||
}
|
||||
|
||||
#balance-tab.updating .overview .icons .warning {
|
||||
display: none !important;
|
||||
}
|
||||
|
||||
/* WARNING STATE */
|
||||
#balance-tab.warning .overview .icons .warning{
|
||||
display: block;
|
||||
}
|
||||
|
||||
#balance-tab.warning #balance-tab-credit,
|
||||
#balance-tab.warning #balance-tab-currency {
|
||||
color: #777775;
|
||||
}
|
||||
|
||||
/* LOW CREDIT STATE */
|
||||
#balance-tab.low-credit #balance-tab-credit,
|
||||
#balance-tab.low-credit #balance-tab-currency {
|
||||
color: #e7a239;
|
||||
}
|
||||
|
||||
/* ZERO CREDIT STATE */
|
||||
#balance-tab.no-credit #balance-tab-credit,
|
||||
#balance-tab.no-credit #balance-tab-currency {
|
||||
color: #a50606;
|
||||
}
|
||||
147
overrides/costcontrol.gaiamobile.org/style/views/datausage.css
Normal file
|
|
@ -0,0 +1,147 @@
|
|||
/* DATAUSAGE VIEW */
|
||||
#datausage-tab .content {
|
||||
padding: 0;
|
||||
height: 100%;
|
||||
padding-bottom: 3rem;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
/* DATA TOGGLE */
|
||||
#datausage-tab .toggle-data {
|
||||
list-style: none;
|
||||
padding: 0;
|
||||
margin: 0 1.5rem;
|
||||
border: solid 0.1rem #adadad;
|
||||
border-right: none;
|
||||
border-left: none;
|
||||
border-bottom: none;
|
||||
}
|
||||
|
||||
#datausage-tab .toggle-data li {
|
||||
height: 3.8rem;
|
||||
padding-inline-start: 3rem;
|
||||
border-bottom-color: #adadad;
|
||||
}
|
||||
|
||||
#datausage-tab .toggle-data li label {
|
||||
/* Removing BB absolute positioning styles */
|
||||
position: unset;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
box-sizing: border-box;
|
||||
width: 100%;
|
||||
padding-inline-end: 2.2rem;
|
||||
pointer-events: auto;
|
||||
}
|
||||
|
||||
#datausage-tab .toggle-data .data-origin-label,
|
||||
#datausage-tab .toggle-data .overview {
|
||||
font-size: 1.9rem;
|
||||
font-weight: normal;
|
||||
line-height: 3.8rem;
|
||||
}
|
||||
|
||||
#datausage-tab .toggle-data .data-origin-label {
|
||||
flex: 1;
|
||||
white-space: nowrap;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
}
|
||||
|
||||
/* Color legend (square) */
|
||||
#datausage-tab .toggle-data li:before {
|
||||
content: "";
|
||||
width: 1.5rem;
|
||||
height: 1.5rem;
|
||||
position: absolute;
|
||||
border: solid 0.1rem #979797;
|
||||
left: 0.5rem;
|
||||
right: 0.5rem;
|
||||
top: 50%;
|
||||
margin: -0.9rem 0 0;
|
||||
transition: background 0.2s ease;
|
||||
}
|
||||
|
||||
#datausage-tab .toggle-data li:first-child:before {
|
||||
background: #975177 image-set(url("../images/app/ui/datausage/pattern-3g.png") 1x, url("../images/app/ui/datausage/pattern-3g@1.5x.png") 1.5x, url("../images/app/ui/datausage/pattern-3g@2x.png") 2x, url("../images/app/ui/datausage/pattern-3g@2.25x.png") 2.25x) repeat left top;
|
||||
}
|
||||
|
||||
#datausage-tab .toggle-data li:last-child:before {
|
||||
background-color: #d4e073;
|
||||
}
|
||||
|
||||
/* Disabled state */
|
||||
#datausage-tab .toggle-data li[aria-disabled=true]:before {
|
||||
background: #d4d2d2;
|
||||
}
|
||||
|
||||
#datausage-tab .toggle-data li .overview {
|
||||
color: #333;
|
||||
font-weight: 500;
|
||||
padding: 0 0.8rem;
|
||||
}
|
||||
|
||||
#datausage-tab .toggle-data li[aria-disabled=true] .overview {
|
||||
display: none;
|
||||
}
|
||||
|
||||
/* APPS */
|
||||
#datausage-tab #app-usage-no-data {
|
||||
font-size: 1.5rem;
|
||||
font-weight: 500;
|
||||
padding-inline-start: 3rem;
|
||||
padding-inline-end: 3rem;
|
||||
}
|
||||
|
||||
#datausage-tab .app-item {
|
||||
padding: 1.9rem 0 0 0;
|
||||
}
|
||||
|
||||
#datausage-tab .app-item > a {
|
||||
display: flex;
|
||||
overflow: auto;
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
#datausage-tab .app-image {
|
||||
padding: 1.1rem 1.3rem 1.1rem 1.3rem;
|
||||
width: 3rem;
|
||||
height: 3rem;
|
||||
}
|
||||
|
||||
#datausage-tab .app-info {
|
||||
flex: 1;
|
||||
margin-inline-end: 5.4rem;
|
||||
}
|
||||
|
||||
#datausage-tab .app-info-row {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
#datausage-tab .app-name {
|
||||
color: #000;
|
||||
text-indent: -0.2rem;
|
||||
padding: 0;
|
||||
font-size: 1.9rem;
|
||||
line-height: 1;
|
||||
font-weight: normal;
|
||||
}
|
||||
|
||||
#datausage-tab .app-usage-bar {
|
||||
height: 0.3rem;
|
||||
margin-top: 0.5rem;
|
||||
margin-bottom: 0.5rem;
|
||||
padding: 0;
|
||||
background-color: #e7e7e7;
|
||||
}
|
||||
|
||||
#datausage-tab .app-usage-bar-used {
|
||||
background-color: #00caf2;
|
||||
height: 0.3rem;
|
||||
}
|
||||
|
||||
#datausage-tab .app-usage-total {
|
||||
font-size: 1.4rem;
|
||||
font-weight: 500;
|
||||
color: #5f5f5f;
|
||||
}
|
||||