More styling options and small fixes

This commit is contained in:
2022-01-18 20:58:57 +01:00
parent 118a5db158
commit d69736d273
8 changed files with 37 additions and 29 deletions

View File

@@ -86,7 +86,7 @@ footer {
.button_toggle_navigation {
position: fixed;
backface-visibility: hidden;
z-index: 300;
z-index: 10;
top: 0;
left: 0;
padding: 10px 20px 15px 10px;
@@ -459,7 +459,7 @@ input[type="submit"]:disabled, input[type="submit"].disabled,
input[type="button"]:disabled, input[type="button"].disabled,
input[type="color"]:disabled, input[type="color"].disabled,
select:disabled , select.disabled {
background: var(--layer_1_color);
background: var(--input_disabled_color);
color: var(--input_color);
box-shadow: none;
transition: none;
@@ -542,7 +542,7 @@ input[type="password"]:disabled,
input[type="email"]:disabled,
input[type="number"]:disabled,
input[type="date"]:disabled{
background: var(--layer_1_color);
background: var(--input_disabled_color);
color: var(--input_color);
box-shadow: none;
transition: none;

View File

@@ -39,19 +39,16 @@
.feat_table > div > .feat_normal {
background-color: var(--layer_3_color);
box-shadow: 1px 1px 4px -2px var(--shadow_color);
text-shadow: 1px 1px 2px var(--shadow_color);
}
.feat_table > div > .feat_pro {
background-color: var(--layer_4_color);
box-shadow: 1px 1px 4px -1px var(--shadow_color);
text-shadow: 1px 1px 4px var(--shadow_color);
}
.feat_table > div > .feat_highlight {
border: 1px solid var(--link_color)
}
.text_highlight {
color: var(--link_color);
text-shadow: 0 0 4px var(--shadow_color);
font-size: 1.1em;
font-weight: bold;
}

View File

@@ -13,13 +13,16 @@ onMount(() => {
return
}
switch (Math.floor(Math.random()*2)) {
switch (Math.floor(Math.random()*3)) {
case 0:
set_ad_type("ads.plus")
break
case 1:
set_ad_type("valueimpression")
break
case 2:
set_ad_type("pixfuture")
break
}
})
@@ -130,7 +133,7 @@ head.valueimpression_loaded.subscribe(v => {
</div>
{:else if ad_type === "pixfuture"}
<!-- AuctionX Display platform tag START -->
<div bind:this={banner} class="banner" id="27517x728x90x4605x_ADSLOT1" clickTrack="%%CLICK_URL_ESC%%" style="display: block; margin: auto;"></div>
<div bind:this={banner} class="banner" id="27517x728x90x4605x_ADSLOT1" clickTrack="%%CLICK_URL_ESC%%"></div>
<script type="text/javascript" async src="https://served-by.pixfuture.com/www/delivery/headerbid.js" slotId="27517x728x90x4605x_ADSLOT1" refreshTime="5" refreshInterval="60"></script>
<!-- AuctionX Display platform tag END -->
{:else if ad_type === "adaround"}

View File

@@ -31,13 +31,16 @@ onMount(() => {
return
}
switch (Math.floor(Math.random()*2)) {
switch (Math.floor(Math.random()*3)) {
case 0:
set_ad_type("ads.plus")
break
case 1:
set_ad_type("valueimpression")
break
case 2:
set_ad_type("pixfuture")
break
}
})

View File

@@ -273,50 +273,51 @@ const keyboard_event = evt => {
return // Prevent shortcuts from interfering with input fields
}
console.debug("Key pressed: " + evt.keyCode)
switch (evt.keyCode) {
case 65: // A or left arrow key go to previous file
case 37:
console.debug("Key pressed: " + evt.key)
switch (evt.key) {
case "a": // A or left arrow key go to previous file
case "ArrowLeft":
if (list_navigator) {
list_navigator.prev()
}
break
case 68: // D or right arrow key go to next file
case 39:
case "d": // D or right arrow key go to next file
case "ArrowRight":
if (list_navigator) {
list_navigator.next()
}
break
case 83:
case "s":
case "S":
if (evt.shiftKey) {
downloader.download_list() // SHIFT + S downloads all files in list
} else {
downloader.download_file() // S to download the current file
}
break
case 82: // R to toggle list shuffle
case "r": // R to toggle list shuffle
if (list_navigator) {
toggle_shuffle()
}
break
case 67: // C to copy to clipboard
case "c": // C to copy to clipboard
copy_url()
break
case 73: // I to open the details window
case "i": // I to open the details window
details_window.toggle()
break
case 69: // E to open the edit window
if (file.can_edit) {
case "e": // E to open the edit window
if (file.can_edit || list.can_edit) {
edit_window.toggle()
}
break
case 77: // M to open the embed window
case "m": // M to open the embed window
embed_window.toggle()
break
case 71: // G to grab this file
case "g": // G to grab this file
this.grabFile()
break
case 81: // Q to close the window
case "q": // Q to close the window
window.close()
break
}

View File

@@ -71,7 +71,7 @@ const keydown = e => {
right: 0;
bottom: 0;
left: 0;
background-color: rgba(0, 0, 0, 0.7);
background-color: rgba(0, 0, 0, 0.6);
}
.window {
position: absolute;
@@ -89,7 +89,6 @@ const keydown = e => {
border-radius: 20px 20px 16px 16px;
overflow: hidden;
text-align: left;
/* box-shadow: var(--shadow_color) 0px 0px 50px; Does not work with light theme */
}
.header {
flex-grow: 0;

View File

@@ -81,7 +81,6 @@ func (wc *WebController) serveFileViewer(w http.ResponseWriter, r *http.Request,
templateData.Title = fmt.Sprintf("%d files on pixeldrain", len(files))
vd.Type = "list"
vd.APIResponse = pixelapi.ListInfo{
Success: true,
Title: "Multiple files",
DateCreated: time.Now(),
Files: files,

View File

@@ -53,6 +53,7 @@ type pixeldrainStyleSheet struct {
Link hsl // Based on Highlight if undefined
Input hsl // Buttons, text fields
InputText hsl
InputDisabled hsl
Highlight hsl // Links, highlighted buttons, list navigation
HighlightText hsl // Text on buttons
Danger hsl
@@ -75,6 +76,9 @@ func (s pixeldrainStyleSheet) String() string {
if s.Link == noColor {
s.Link = s.Highlight.Add(0, 0, -.05)
}
if s.InputDisabled == noColor {
s.InputDisabled = s.Input.Add(0, -.2, -.2)
}
if s.ScrollbarForeground == noColor {
s.ScrollbarForeground = s.Input
}
@@ -92,6 +96,7 @@ func (s pixeldrainStyleSheet) String() string {
--input_color: #%s;
--input_color_dark: #%s;
--input_text_color: #%s;
--input_disabled_color: #%s;
--highlight_color: #%s;
--highlight_color_dark: #%s;
--highlight_text_color: #%s;
@@ -118,6 +123,7 @@ func (s pixeldrainStyleSheet) String() string {
s.Input.RGB(),
s.Input.Add(0, 0, -.02).RGB(),
s.InputText.RGB(),
s.InputDisabled.RGB(),
s.Highlight.RGB(),
s.Highlight.Add(0, 0, -.02).RGB(),
s.HighlightText.RGB(),
@@ -431,7 +437,7 @@ var nordPixeldrainStyle = pixeldrainStyleSheet{
var snowstormPixeldrainStyle = pixeldrainStyleSheet{
Text: hsl{220, .16, .36}, // hsl(220, 16%, 36%)
Link: hsl{92, .28, .40},
Link: hsl{92, .40, .40},
Input: hsl{193, .43, .67}, // hsl(193, 43%, 67%)
InputText: hsl{180, .19, .23},
Highlight: hsl{92, .28, .65}, // hsl(92, 28%, 65%)
@@ -440,7 +446,7 @@ var snowstormPixeldrainStyle = pixeldrainStyleSheet{
ScrollbarForeground: hsl{193, .43, .67},
ScrollbarHover: hsl{193, .43, .76},
Layer1: hsl{220, .16, .36}, // hsl(220, 16%, 36%)
Layer1: hsl{220, .17, .32}, // hsl(220, 17%, 32%)
Layer1Text: hsl{219, .28, .88},
Layer2: hsl{219, .28, .88}, // hsl(219, 28%, 88%)
Layer3: hsl{218, .27, .92}, // hsl(218, 27%, 92%)