More styling options and small fixes
This commit is contained in:
@@ -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;
|
||||
|
@@ -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;
|
||||
}
|
||||
|
@@ -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"}
|
||||
|
@@ -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
|
||||
}
|
||||
})
|
||||
|
||||
|
@@ -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
|
||||
}
|
||||
|
@@ -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;
|
||||
|
@@ -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,
|
||||
|
@@ -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%)
|
||||
|
Reference in New Issue
Block a user