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.
This commit is contained in:
OverSu
parent
93e3a48004
commit
b38dea0597
25901 changed files with 9982925 additions and 369 deletions
326
assets/webapps/system.gaiamobile.org/style/system/system.css
Normal file
326
assets/webapps/system.gaiamobile.org/style/system/system.css
Normal file
|
|
@ -0,0 +1,326 @@
|
|||
* {
|
||||
-moz-user-select: none;
|
||||
}
|
||||
|
||||
html {
|
||||
font-size: 10px;
|
||||
font-weight: 500;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
background-color: black;
|
||||
overflow: hidden;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
body {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
margin: 0;
|
||||
overflow: hidden;
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
input,
|
||||
textarea,
|
||||
[contenteditable="true"] {
|
||||
-moz-user-select: text;
|
||||
}
|
||||
|
||||
#screen {
|
||||
position: absolute;
|
||||
overflow: hidden;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
background-color: #000;
|
||||
background-size: cover; /* Possible memory over-consumption with huge images, it should be removed for improving stability*/
|
||||
background-repeat: no-repeat;
|
||||
background-position: 50% 50%;
|
||||
}
|
||||
|
||||
/*
|
||||
* Poweroff animation
|
||||
*/
|
||||
#screen > div#poweroff-splash {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
background-color: #000;
|
||||
}
|
||||
|
||||
#screen > div#poweroff-splash.step1 {
|
||||
animation: poweroff-splash-fade-in var(--transition-duration);
|
||||
}
|
||||
|
||||
@keyframes poweroff-splash-fade-in {
|
||||
0% {
|
||||
opacity: 0;
|
||||
}
|
||||
100% {
|
||||
opacity: 1;
|
||||
}
|
||||
}
|
||||
|
||||
#bottom-panel {
|
||||
position: absolute;
|
||||
display: none;
|
||||
bottom: 0;
|
||||
width: 100%;
|
||||
height: 1rem;
|
||||
}
|
||||
|
||||
#bottom-panel.visible{
|
||||
display: block;
|
||||
}
|
||||
|
||||
.poweroff-ring {
|
||||
display: block;
|
||||
position: absolute;
|
||||
border-radius: 50%;
|
||||
width: 19vw;
|
||||
height: 19vw;
|
||||
margin-inline-start: -9.5vw;
|
||||
margin-top: -9.5vw;
|
||||
offset-inline-start: 50%;
|
||||
opacity: 0;
|
||||
}
|
||||
|
||||
#poweroff-ring-1 {
|
||||
top: 25%;
|
||||
background-color: #e66600;
|
||||
}
|
||||
|
||||
#poweroff-ring-2 {
|
||||
top: 50%;
|
||||
background-color: #dc4e00;
|
||||
}
|
||||
|
||||
#poweroff-ring-3 {
|
||||
top: 75%;
|
||||
background-color: #d24500;
|
||||
}
|
||||
|
||||
.poweroff-ring > span {
|
||||
display: block;
|
||||
position: absolute;
|
||||
border-radius: 50%;
|
||||
top: 50%;
|
||||
offset-inline-start: 50%;
|
||||
margin: auto;
|
||||
background-color: black;
|
||||
width: 12vw;
|
||||
height: 12vw;
|
||||
margin-top: -6vw;
|
||||
margin-inline-start: -6vw;
|
||||
}
|
||||
|
||||
@media all and (orientation:landscape) {
|
||||
.poweroff-ring {
|
||||
width: 19vh;
|
||||
height: 19vh;
|
||||
margin-inline-start: -9.5vh;
|
||||
margin-top: -9.5vh;
|
||||
}
|
||||
|
||||
.poweroff-ring > span {
|
||||
width: 12vh;
|
||||
height: 12vh;
|
||||
margin-top: -6vh;
|
||||
margin-inline-start: -6vh;
|
||||
}
|
||||
}
|
||||
|
||||
#poweroff-ring-2 > span {
|
||||
transform: scale(1.125);
|
||||
}
|
||||
|
||||
#poweroff-ring-3 > span {
|
||||
transform: scale(1.25);
|
||||
}
|
||||
|
||||
/* Ring 1 : inner diameter scales from 40 pixel to 58 pixel */
|
||||
@keyframes ring1-scale {
|
||||
0% {
|
||||
transform: scale(1);
|
||||
}
|
||||
100% {
|
||||
transform: scale(1.45);
|
||||
}
|
||||
}
|
||||
|
||||
/* Ring 2 : inner diameter scales from 45 pixel to 59.5 pixel */
|
||||
@keyframes ring2-scale {
|
||||
0% {
|
||||
transform: scale(1.125);
|
||||
}
|
||||
100% {
|
||||
transform: scale(1.4875);
|
||||
}
|
||||
}
|
||||
|
||||
/* Ring 3 : inner diameter scales from 50 pixel to 59 pixel */
|
||||
@keyframes ring3-scale {
|
||||
0% {
|
||||
transform: scale(1.25);
|
||||
}
|
||||
100% {
|
||||
transform: scale(1.475);
|
||||
}
|
||||
}
|
||||
|
||||
@keyframes ring-fade-in {
|
||||
0% {
|
||||
opacity: 0;
|
||||
}
|
||||
100% {
|
||||
opacity: 1;
|
||||
}
|
||||
}
|
||||
|
||||
@keyframes ring-fade-out {
|
||||
0% {
|
||||
opacity: 1;
|
||||
}
|
||||
100% {
|
||||
opacity: 0;
|
||||
}
|
||||
}
|
||||
|
||||
#screen > div#poweroff-splash.step2 > #poweroff-ring-1 {
|
||||
animation: ring-fade-in .4s ease-out 0s,
|
||||
ring-fade-out .5s linear .4s;
|
||||
}
|
||||
|
||||
#screen > div#poweroff-splash.step2 > #poweroff-ring-2 {
|
||||
animation: ring-fade-in .4s ease-out .25s,
|
||||
ring-fade-out .5s linear .65s;
|
||||
}
|
||||
|
||||
#screen > div#poweroff-splash.step2 > #poweroff-ring-3 {
|
||||
animation: ring-fade-in .4s ease-out .5s,
|
||||
ring-fade-out .5s linear .9s;
|
||||
}
|
||||
|
||||
#screen > div#poweroff-splash.step2 > #poweroff-ring-1 > span {
|
||||
animation: ring1-scale .5s linear .4s;
|
||||
}
|
||||
|
||||
#screen > div#poweroff-splash.step2 > #poweroff-ring-2 > span {
|
||||
animation: ring2-scale .5s linear .65s;
|
||||
}
|
||||
|
||||
#screen > div#poweroff-splash.step2 > #poweroff-ring-3 > span {
|
||||
animation: ring3-scale .5s linear .9s;
|
||||
}
|
||||
|
||||
|
||||
|
||||
#system-overlay,
|
||||
#fullscreen-dialog-overlay {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
visibility: hidden;
|
||||
pointer-events: none;
|
||||
}
|
||||
|
||||
#system-overlay.volume {
|
||||
visibility: visible;
|
||||
}
|
||||
|
||||
#windows {
|
||||
position: absolute;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
top: 0;
|
||||
height: 100%;
|
||||
max-height: 100%;
|
||||
border: 0;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
#windows .appWindow:not(.homescreen):not(.lockScreenInputWindow)::before {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
width: 100%;
|
||||
height: var(--statusbar-height);
|
||||
|
||||
background: rgba(0, 0, 0, .15);
|
||||
content: '';
|
||||
}
|
||||
|
||||
#secure-windows {
|
||||
position: absolute;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
top: 0;
|
||||
height: 100%;
|
||||
max-height: 100%;
|
||||
border: 0;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
#dialog-overlay {
|
||||
position: absolute;
|
||||
top: var(--statusbar-height);
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
visibility: hidden;
|
||||
pointer-events: none;
|
||||
}
|
||||
|
||||
#screen:-moz-full-screen-ancestor #dialog-overlay,
|
||||
#dialog-overlay.fullscreen {
|
||||
top: 0;
|
||||
bottom: 0;
|
||||
}
|
||||
|
||||
#screen:not(.crash-dialog) #crash-dialog,
|
||||
#screen:not(.trustedui) #trustedui-container {
|
||||
display: none;
|
||||
}
|
||||
|
||||
/* `.dialog` is set by system_dialog.js when a dialog is shown */
|
||||
#screen.dialog #dialog-overlay {
|
||||
visibility: visible;
|
||||
pointer-events: auto;
|
||||
}
|
||||
|
||||
#screen.crash-dialog #dialog-overlay,
|
||||
#screen.crash-dialog #crash-dialog,
|
||||
#screen.modal-dialog #dialog-overlay,
|
||||
#screen.modal-dialog #modal-dialog,
|
||||
#screen.popup #popup-container,
|
||||
#screen.fxa-dialog #fxa-dialog,
|
||||
#screen.trustedui #trustedui-container,
|
||||
#screen.trustedui #dialog-overlay {
|
||||
visibility: visible;
|
||||
pointer-events: auto;
|
||||
}
|
||||
|
||||
#screen.locked #dialog-overlay {
|
||||
visibility: hidden;
|
||||
}
|
||||
|
||||
#screen iframe.communication-frame {
|
||||
visibility: hidden;
|
||||
}
|
||||
|
||||
@media (min-width: 768px) {
|
||||
#dialog-overlay {
|
||||
background-color: rgba(0,0,0,0.6);
|
||||
background: url(../themes/default/images/ui/menu_bg.png) no-repeat;
|
||||
}
|
||||
}
|
||||
|
||||
/* DIALOGS */
|
||||
/* We'll potentially move this code into the components */
|
||||
|
||||
gaia-dialog > .dialog-content {
|
||||
padding: 1.8rem;
|
||||
}
|
||||
|
||||
Loading…
Reference in a new issue