aboutsummaryrefslogtreecommitdiff
path: root/src
diff options
context:
space:
mode:
Diffstat (limited to 'src')
-rw-r--r--src/site/assets/styles/bulma-divider.scss164
-rw-r--r--src/site/assets/styles/style.scss94
-rw-r--r--src/site/pages/dashboard/account.vue5
-rw-r--r--src/site/pages/dashboard/admin/settings.vue6
-rw-r--r--src/site/pages/dashboard/albums/_id.vue3
-rw-r--r--src/site/pages/dashboard/albums/index.vue1
-rw-r--r--src/site/pages/dashboard/index.vue3
-rw-r--r--src/site/pages/dashboard/tags/index.vue1
-rw-r--r--src/site/pages/login.vue2
-rw-r--r--src/site/pages/register.vue3
10 files changed, 260 insertions, 22 deletions
diff --git a/src/site/assets/styles/bulma-divider.scss b/src/site/assets/styles/bulma-divider.scss
new file mode 100644
index 0000000..713c7e4
--- /dev/null
+++ b/src/site/assets/styles/bulma-divider.scss
@@ -0,0 +1,164 @@
+/*! @creativebulma/bulma-divider v1.1.0 | (c) 2020 Gaetan | MIT License | https://github.com/CreativeBulma/bulma-divider */
+@-webkit-keyframes spinAround {
+ from {
+ transform: rotate(0deg);
+ }
+ to {
+ transform: rotate(359deg);
+ }
+}
+
+@keyframes spinAround {
+ from {
+ transform: rotate(0deg);
+ }
+ to {
+ transform: rotate(359deg);
+ }
+}
+
+/* line 17, src/sass/app.sass */
+.divider {
+ position: relative;
+ display: flex;
+ align-items: center;
+ text-transform: uppercase;
+ color: #7a7a7a;
+ font-size: 0.75rem;
+ font-weight: 600;
+ letter-spacing: .5px;
+ margin: 25px 0;
+}
+
+/* line 28, src/sass/app.sass */
+.divider::after, .divider::before {
+ content: '';
+ display: block;
+ flex: 1;
+ height: 1px;
+ background-color: #dbdbdb;
+}
+
+/* line 37, src/sass/app.sass */
+.divider:not(.is-right)::after {
+ margin-left: 10px;
+}
+
+/* line 41, src/sass/app.sass */
+.divider:not(.is-left)::before {
+ margin-right: 10px;
+}
+
+/* line 45, src/sass/app.sass */
+.divider.is-left::before {
+ display: none;
+}
+
+/* line 49, src/sass/app.sass */
+.divider.is-right::after {
+ display: none;
+}
+
+/* line 52, src/sass/app.sass */
+.divider.is-vertical {
+ flex-direction: column;
+ margin: 0 25px;
+}
+
+/* line 56, src/sass/app.sass */
+.divider.is-vertical::after, .divider.is-vertical::before {
+ height: auto;
+ width: 1px;
+}
+
+/* line 61, src/sass/app.sass */
+.divider.is-vertical::after {
+ margin-left: 0;
+ margin-top: 10px;
+}
+
+/* line 65, src/sass/app.sass */
+.divider.is-vertical::before {
+ margin-right: 0;
+ margin-bottom: 10px;
+}
+
+/* line 72, src/sass/app.sass */
+.divider.is-white::after, .divider.is-white::before {
+ background-color: white;
+}
+
+/* line 72, src/sass/app.sass */
+.divider.is-black::after, .divider.is-black::before {
+ background-color: #0a0a0a;
+}
+
+/* line 72, src/sass/app.sass */
+.divider.is-light::after, .divider.is-light::before {
+ background-color: whitesmoke;
+}
+
+/* line 72, src/sass/app.sass */
+.divider.is-dark::after, .divider.is-dark::before {
+ background-color: #363636;
+}
+
+/* line 72, src/sass/app.sass */
+.divider.is-primary::after, .divider.is-primary::before {
+ background-color: #00d1b2;
+}
+
+/* line 80, src/sass/app.sass */
+.divider.is-primary.is-light::after, .divider.is-primary.is-light::before {
+ background-color: #ebfffc;
+}
+
+/* line 72, src/sass/app.sass */
+.divider.is-link::after, .divider.is-link::before {
+ background-color: #3273dc;
+}
+
+/* line 80, src/sass/app.sass */
+.divider.is-link.is-light::after, .divider.is-link.is-light::before {
+ background-color: #eef3fc;
+}
+
+/* line 72, src/sass/app.sass */
+.divider.is-info::after, .divider.is-info::before {
+ background-color: #3298dc;
+}
+
+/* line 80, src/sass/app.sass */
+.divider.is-info.is-light::after, .divider.is-info.is-light::before {
+ background-color: #eef6fc;
+}
+
+/* line 72, src/sass/app.sass */
+.divider.is-success::after, .divider.is-success::before {
+ background-color: #48c774;
+}
+
+/* line 80, src/sass/app.sass */
+.divider.is-success.is-light::after, .divider.is-success.is-light::before {
+ background-color: #effaf3;
+}
+
+/* line 72, src/sass/app.sass */
+.divider.is-warning::after, .divider.is-warning::before {
+ background-color: #ffdd57;
+}
+
+/* line 80, src/sass/app.sass */
+.divider.is-warning.is-light::after, .divider.is-warning.is-light::before {
+ background-color: #fffbeb;
+}
+
+/* line 72, src/sass/app.sass */
+.divider.is-danger::after, .divider.is-danger::before {
+ background-color: #f14668;
+}
+
+/* line 80, src/sass/app.sass */
+.divider.is-danger.is-light::after, .divider.is-danger.is-light::before {
+ background-color: #feecf0;
+}
diff --git a/src/site/assets/styles/style.scss b/src/site/assets/styles/style.scss
index 202e02a..026f277 100644
--- a/src/site/assets/styles/style.scss
+++ b/src/site/assets/styles/style.scss
@@ -10,11 +10,16 @@ $family-primary: 'Nunito', BlinkMacSystemFont, -apple-system, 'Segoe UI', 'Robot
'Fira Sans', 'Droid Sans', 'Helvetica Neue', 'Helvetica', 'Arial', sans-serif;
$size-normal: 1rem;
-@import '../../../node_modules/bulma/bulma.sass';
-@import '../../../node_modules/buefy/src/scss/buefy.scss';
+/* @import '../../../node_modules/bulma/bulma.sass';
+@import '../../../node_modules/buefy/src/scss/buefy.scss'; */
+
+@import "~bulma";
+@import "~buefy/src/scss/buefy";
@import '@mdi/font/css/materialdesignicons.css';
+@import './bulma-divider.scss';
+
html {
// font-size: 100%;
font-size: 14px;
@@ -204,24 +209,6 @@ section#register a.is-text {
margin-top: 5px;
}
-.input,
-.taginput .taginput-container.is-focusable,
-.textarea,
-.select select {
- border: 2px solid #21252d;
- border-radius: 0.3em !important;
- background: rgba(0, 0, 0, 0.15);
- padding: 1rem;
- color: $textColor;
- height: 3rem;
- &:focus,
- &:hover {
- border: 2px solid #21252d;
- }
- &::placeholder {
- color: $textColor;
- }
-}
/* button.button.is-primary {
background-color: #323846;
border: 2px solid #21252d;
@@ -277,6 +264,29 @@ table.table {
}
}
+.lolisafe-input input,
+.lolisafe-select select,
+.lolisafe-textarea textarea {
+ border: 2px solid #21252d;
+ border-radius: 0.3em !important;
+ background: rgba(0, 0, 0, 0.15);
+ padding: 1rem;
+ color: $textColor;
+ height: 3rem;
+ &:focus,
+ &:hover {
+ border: 2px solid #21252d;
+ }
+ &::placeholder {
+ color: $textColor;
+ }
+}
+
+.lolisafe-input .icon {
+ color: #323846 !important;
+}
+
+
// vue-bar
.vb > .vb-dragger {
z-index: 5;
@@ -345,3 +355,47 @@ table.table {
height: 3rem;
padding-right: 1rem;
}
+
+.is-marginless {
+ margin: 0 !important;
+}
+
+.fucking-opl-shut-up {
+ display: flex;
+ justify-content: center;
+ align-items: center;
+}
+
+.lolisafe-on-border.field.is-floating-label .label:before {
+ background-color: $lolisafe;
+}
+
+.is-lolisafe.divider::after, .is-lolisafe.divider::before {
+ background-color: #21252d;
+}
+
+.lolisafe.taginput {
+ .taginput-container {
+ background-color: #21252d;
+ border: 2px solid #21252d;
+ border-radius: 0.3em !important;
+
+ input {
+ background-color: #21252d;
+ color: $textColor;
+ &::placeholder {
+ color: $textColor;
+ }
+ }
+
+ .icon {
+ padding-left: 15px;
+ }
+
+ &:focus,
+ &:hover,
+ &:active {
+ border: 2px solid #21252d;
+ }
+ }
+}
diff --git a/src/site/pages/dashboard/account.vue b/src/site/pages/dashboard/account.vue
index 31ec8af..5d2f064 100644
--- a/src/site/pages/dashboard/account.vue
+++ b/src/site/pages/dashboard/account.vue
@@ -16,6 +16,7 @@
message="Nothing to do here"
horizontal>
<b-input
+ class="lolisafe-input"
:value="user.username"
expanded
disabled />
@@ -27,6 +28,7 @@
horizontal>
<b-input
v-model="password"
+ class="lolisafe-input"
type="password"
expanded />
</b-field>
@@ -37,6 +39,7 @@
horizontal>
<b-input
v-model="newPassword"
+ class="lolisafe-input"
type="password"
expanded />
</b-field>
@@ -47,6 +50,7 @@
horizontal>
<b-input
v-model="reNewPassword"
+ class="lolisafe-input"
type="password"
expanded />
</b-field>
@@ -65,6 +69,7 @@
horizontal>
<b-field expanded>
<b-input
+ class="lolisafe-input"
:value="apiKey"
expanded
disabled />
diff --git a/src/site/pages/dashboard/admin/settings.vue b/src/site/pages/dashboard/admin/settings.vue
index 7f6a0fe..56331b5 100644
--- a/src/site/pages/dashboard/admin/settings.vue
+++ b/src/site/pages/dashboard/admin/settings.vue
@@ -17,6 +17,7 @@
horizontal>
<b-input
v-model="settings.serviceName"
+ class="lolisafe-input"
expanded />
</b-field>
@@ -26,6 +27,7 @@
horizontal>
<b-input
v-model="settings.uploadFolder"
+ class="lolisafe-input"
expanded />
</b-field>
@@ -35,6 +37,7 @@
horizontal>
<b-input
v-model="settings.linksPerAlbum"
+ class="lolisafe-input"
type="number"
expanded />
</b-field>
@@ -45,6 +48,7 @@
horizontal>
<b-input
v-model="settings.maxUploadSize"
+ class="lolisafe-input"
expanded />
</b-field>
@@ -54,6 +58,7 @@
horizontal>
<b-input
v-model="settings.filenameLength"
+ class="lolisafe-input"
expanded />
</b-field>
@@ -63,6 +68,7 @@
horizontal>
<b-input
v-model="settings.albumLinkLength"
+ class="lolisafe-input"
expanded />
</b-field>
diff --git a/src/site/pages/dashboard/albums/_id.vue b/src/site/pages/dashboard/albums/_id.vue
index a909e75..a4aa440 100644
--- a/src/site/pages/dashboard/albums/_id.vue
+++ b/src/site/pages/dashboard/albums/_id.vue
@@ -14,7 +14,7 @@
<div class="level-left">
<div class="level-item">
<h1 class="title is-3">
- {{ images.name }}
+ {{ images.albumName }}
</h1>
</div>
<div class="level-item">
@@ -27,6 +27,7 @@
<div class="level-item">
<b-field>
<b-input
+ class="lolisafe-input"
placeholder="Search"
type="search" />
<p class="control">
diff --git a/src/site/pages/dashboard/albums/index.vue b/src/site/pages/dashboard/albums/index.vue
index a2ba522..c5acb2e 100644
--- a/src/site/pages/dashboard/albums/index.vue
+++ b/src/site/pages/dashboard/albums/index.vue
@@ -16,6 +16,7 @@
<b-field>
<b-input
v-model="newAlbumName"
+ class="lolisafe-input"
placeholder="Album name..."
type="text"
@keyup.enter.native="createAlbum" />
diff --git a/src/site/pages/dashboard/index.vue b/src/site/pages/dashboard/index.vue
index 08c5166..d623b5c 100644
--- a/src/site/pages/dashboard/index.vue
+++ b/src/site/pages/dashboard/index.vue
@@ -1,7 +1,7 @@
<template>
<section class="section is-fullheight dashboard">
<div class="container">
- <div class="columns is-variable is-0-mobile">
+ <div class="columns ">
<div class="column is-narrow">
<Sidebar />
</div>
@@ -18,6 +18,7 @@
<div class="level-item">
<b-field>
<b-input
+ class="lolisafe-input"
placeholder="Search"
type="search" />
<p class="control">
diff --git a/src/site/pages/dashboard/tags/index.vue b/src/site/pages/dashboard/tags/index.vue
index a9c5756..fe92087 100644
--- a/src/site/pages/dashboard/tags/index.vue
+++ b/src/site/pages/dashboard/tags/index.vue
@@ -140,6 +140,7 @@
<b-field>
<b-input
v-model="newTagName"
+ class="lolisafe-input"
placeholder="Tag name..."
type="text"
@keyup.enter.native="createTag" />
diff --git a/src/site/pages/login.vue b/src/site/pages/login.vue
index 569e9d9..1f313e3 100644
--- a/src/site/pages/login.vue
+++ b/src/site/pages/login.vue
@@ -12,6 +12,7 @@
<b-field>
<b-input
v-model="username"
+ class="lolisafe-input"
type="text"
placeholder="Username"
@keyup.enter.native="login" />
@@ -19,6 +20,7 @@
<b-field>
<b-input
v-model="password"
+ class="lolisafe-input"
type="password"
placeholder="Password"
password-reveal
diff --git a/src/site/pages/register.vue b/src/site/pages/register.vue
index 7cf4573..5a7a158 100644
--- a/src/site/pages/register.vue
+++ b/src/site/pages/register.vue
@@ -12,12 +12,14 @@
<b-field>
<b-input
v-model="username"
+ class="lolisafe-input"
type="text"
placeholder="Username" />
</b-field>
<b-field>
<b-input
v-model="password"
+ class="lolisafe-input"
type="password"
placeholder="Password"
password-reveal />
@@ -25,6 +27,7 @@
<b-field>
<b-input
v-model="rePassword"
+ class="lolisafe-input"
type="password"
placeholder="Re-type Password"
password-reveal