Merge branch 'develop'

This commit is contained in:
Alice Gaudon 2020-05-05 22:27:59 +02:00
commit 8165d8fbcc
9 changed files with 379 additions and 322 deletions

1
.npmrc Normal file
View File

@ -0,0 +1 @@
registry=https://registry.yarnpkg.com/

1
.yarnrc Normal file
View File

@ -0,0 +1 @@
registry "https://registry.yarnpkg.com/"

View File

@ -1,6 +1,6 @@
{ {
"name": "tabs", "name": "tabs",
"version": "0.6.4", "version": "0.7.0",
"description": "Persistent and separate browser tabs in one window.", "description": "Persistent and separate browser tabs in one window.",
"author": { "author": {
"name": "Alice Gaudon", "name": "Alice Gaudon",
@ -71,6 +71,6 @@
} }
] ]
}, },
"electronVersion": "8.2.4" "electronVersion": "8.2.5"
} }
} }

View File

@ -6,7 +6,5 @@
<meta http-equiv="Content-Security-Policy" content="default-src 'none'"> <meta http-equiv="Content-Security-Policy" content="default-src 'none'">
</head> </head>
<body> <body></body>
<p>Loading...</p>
</body>
</html> </html>

View File

@ -33,6 +33,7 @@
<div id="services"> <div id="services">
<div class="loader"></div> <div class="loader"></div>
<div id="url-preview" class="hidden"></div> <div id="url-preview" class="hidden"></div>
<div id="empty-message">Load a service using the menu on the left.</div>
</div> </div>
</body> </body>

View File

@ -3,11 +3,24 @@ body {
flex-direction: row; flex-direction: row;
} }
#navigation {
display: flex;
flex-direction: column;
height: 100%;
width: 48px;
}
#service-selector { #service-selector {
flex-grow: 1; flex-grow: 1;
display: block; display: block;
margin: 0; margin: 0;
padding: 0; padding: 0;
overflow: hidden auto;
}
#service-selector::-webkit-scrollbar {
width: 6px;
} }
#service-selector [draggable] { #service-selector [draggable] {
@ -21,14 +34,14 @@ body {
} }
#service-selector .drag-target button { #service-selector .drag-target button {
height: 144px; height: 56px;
padding-top: 88px; padding-top: 88px;
} }
#service-selector .drag-target button::after, #service-selector .drag-target button::after,
#service-last-drag-position.drag-target { #service-last-drag-position.drag-target {
content: ""; content: "";
height: 72px; height: 56px;
border: 1px dashed #fff; border: 1px dashed #fff;
box-sizing: border-box; box-sizing: border-box;
@ -63,11 +76,12 @@ body {
} }
#navigation button { #navigation button {
position: relative;
display: block; display: block;
width: 100%; width: 48px;
padding: 16px; height: 48px;
margin: 0; margin: 0;
height: 72px; padding: 0;
color: #fff; color: #fff;
border: 0; border: 0;
@ -76,12 +90,17 @@ body {
cursor: pointer; cursor: pointer;
} }
#navigation button:focus {
outline-color: transparent;
background: #fff3 !important;
}
#navigation button img { #navigation button img {
width: 32px; width: 24px;
} }
#navigation button i { #navigation button i {
font-size: 32px; font-size: 24px;
} }
#service-selector li { #service-selector li {
@ -94,39 +113,39 @@ body {
} }
#service-selector li.active button { #service-selector li.active button {
position: relative;
background-color: #fff2; background-color: #fff2;
} }
#service-selector li.active button::before { #service-selector li.loaded button::before {
content: ""; content: "";
display: block; display: block;
position: absolute; position: absolute;
left: 0; right: 0;
top: 0;
height: 100%;
border-left: 4px solid #ffffff2e;
}
#service-selector li.loaded::after {
content: "";
position: absolute;
top: 50%; top: 50%;
right: 2px;
transform: translateY(-50%); transform: translateY(-50%);
width: 4px; height: 75%;
height: 4px; border-right: 4px solid #ffffff3e;
background-color: #fff;
border-radius: 100%;
} }
/*#service-selector li.loaded::after {*/
/* content: "";*/
/* position: absolute;*/
/* top: 50%;*/
/* right: 2px;*/
/* transform: translateY(-50%);*/
/* width: 4px;*/
/* height: 4px;*/
/* background-color: #fff;*/
/* border-radius: 100%;*/
/*}*/
#navigation button:hover { #navigation button:hover {
background-color: #fff3; background-color: #fff3;
} }
#history { #history {
padding: 8px; padding: 2px;
} }
#history button { #history button {
@ -137,8 +156,6 @@ body {
font-size: 12px; font-size: 12px;
background: #fff1; background: #fff1;
border: 1px solid #fff4;
border-radius: 72px;
color: #fff; color: #fff;
cursor: pointer; cursor: pointer;
@ -234,3 +251,16 @@ body {
#url-preview.hidden { #url-preview.hidden {
opacity: 0; opacity: 0;
} }
#services > #empty-message {
display: flex !important;
position: absolute;
bottom: 0;
width: 100%;
justify-content: center;
align-items: center;
}
#services > .loader:not(.hidden) ~ #empty-message {
display: none !important;
}

View File

@ -77,4 +77,22 @@ button:hover {
.hidden { .hidden {
display: none; display: none;
} }
::-webkit-scrollbar {
width: 8px;
background: rgba(0, 0, 0, 0.25);
}
::-webkit-scrollbar-button {
display: none;
}
::-webkit-scrollbar-track {
background-color: transparent;
}
::-webkit-scrollbar-thumb {
background-color: rgba(255, 255, 255, 0.5);
border-radius: 5px;
}

View File

@ -30,7 +30,7 @@ export default class Config {
} }
if (this.services.length === 0) { if (this.services.length === 0) {
this.services.push(new Service('welcome', 'Welcome', 'rocket', false, 'https://gitlab.com/ArisuOngaku/tabs', false)); this.services.push(new Service('welcome', 'Welcome', 'rocket', false, 'https://github.com/ArisuOngaku/tabs', false));
} }
this.save(); this.save();

584
yarn.lock

File diff suppressed because it is too large Load Diff