Start of new menu

This commit is contained in:
2019-09-16 23:50:57 +02:00
parent 09509367aa
commit b1107236cd
11 changed files with 303 additions and 152 deletions

View File

@@ -7,12 +7,15 @@
</head>
<body>
{{template "menu" .}}
<div class="highlight_middle">
{{template "page_top" .}}
<br/>
<div class="centered">
These files were uploaded while logged in to your pixeldrain account,
<a href="/history">click here</a> to view files uploaded anonymously
in this browser.
</div>
<br/>
<br/>
{{$limit := 200}}
{{$page := .URLQuery.Get "page" | pageNr}}
@@ -56,6 +59,8 @@
{{end}}
</div>
{{template "page_bottom" .}}
{{template "analytics"}}
</body>
</html>

View File

@@ -7,10 +7,13 @@
</head>
<body>
<div id='body' class="body">
{{template "menu" .}}
{{template "page_top" .}}
<h1 class="highlight_middle">Welcome home, {{.Username}}!</h1>
<div class="checkers inset highlight_dark">
<h1>Welcome home, {{.Username}}!</h1>
</div>
<div class="centered">
<h2>Actions</h2>
<ul>
@@ -47,8 +50,10 @@
<br/>
<a href="/user/lists" class="button">...All my lists</a>
</div>
{{template "footer"}}
</div>
{{template "page_bottom" .}}
{{template "analytics"}}
</body>
</html>

View File

@@ -1,3 +1,3 @@
{{define "bgpattern"}}
<style>body, .checkers{background-image: url("/res/img/{{bgPattern}}");}</style>
<style>.checkers{background-image: url("/res/img/{{bgPattern}}");}</style>
{{end}}

View File

@@ -1,9 +0,0 @@
{{define "footer"}}
<br/>
<div class="highlight_dark">
Pixeldrain is a product by <a href="//fornaxian.com" target="_blank">Fornaxian Technologies</a> |
Twitter:&nbsp;<a href="https://twitter.com/Fornax96" target="_blank">@Fornax96</a>
Reddit:&nbsp;<a href="https://reddit.com/r/pixeldrain" target="_blank">/r/pixeldrain</a>
Medium:&nbsp;<a href="https://medium.com/pixeldrain" target="_blank">Pixeldrain</a>
</div>
{{end}}

View File

@@ -1,24 +0,0 @@
{{define "menu"}}
<div id="navigation" class="highlight_headerbar navigation">
<a href="/">Home</a>
<a href="{{if .Authenticated}}/user/files{{else}}/history{{end}}">My&nbsp;Files</a>
{{if .Authenticated}}<a href="/user/lists">My&nbsp;Lists</a>{{end}}
<a href="/api">API</a>
{{if .Authenticated}}<a href="/user">{{.Username}}</a>
<a href="/logout" style="vertical-align: 0.6em; font-size: 0.9em; padding: 1px;">(Log out)</a>{{else}}
<a href="/login">Login</a>
<a href="/register">Register</a>
{{end}}
<a href="javascript:void(0);" class="icon" onclick="expandNavigation()">&#9776;</a>
<script>
function expandNavigation() {
var x = document.getElementById("navigation");
if (!x.className.includes("responsive")) {
x.className += " responsive";
} else {
x.className = x.className.replace(" responsive", "");
}
}
</script>
</div>
{{end}}

View File

@@ -0,0 +1,56 @@
{{define "page_top"}}
<div id="page_wrapper" class="page_wrapper">
<div id="page_header" class="page_header highlight_headerbar navigation">
<button id="button_toggle_toolbar" class="button_toggle_toolbar" onClick="toggleMenu();"></button>
<span>Pixeldrain ~ Free file sharing</span>
</div>
<div id="page_content_wrapper" class="page_content_wrapper">
<div id="page_navigation" class="page_navigation">
<a href="/">Home</a>
<hr/>
{{if .Authenticated}}<a href="/user">{{.Username}}</a>
<a href="{{if .Authenticated}}/user/files{{else}}/history{{end}}">My&nbsp;Files</a>
{{if .Authenticated}}<a href="/user/lists">My&nbsp;Lists</a>{{end}}
<a href="/logout" style="vertical-align: 0.6em; font-size: 0.9em; padding: 1px;">(Log out)</a>{{else}}
<a href="/login">Login</a>
<a href="/register">Register</a>
{{end}}
<hr/>
<a href="/api">API</a>
</div>
<div id="page_content" class="page_content">
{{end}}
{{define "page_bottom"}}
<br/>
<div class="checkers inset" style="height: 100px;"></div>
<div class="highlight_dark">
Pixeldrain is a product by <a href="//fornaxian.com" target="_blank">Fornaxian Technologies</a> |
Twitter:&nbsp;<a href="https://twitter.com/Fornax96" target="_blank">@Fornax96</a>
Reddit:&nbsp;<a href="https://reddit.com/r/pixeldrain" target="_blank">/r/pixeldrain</a>
Medium:&nbsp;<a href="https://medium.com/pixeldrain" target="_blank">Pixeldrain</a>
</div>
</div><!-- end page_content -->
</div><!-- end page_content_wrapper -->
</div><!-- end page_wrapper-->
<script>
var nav = document.getElementById("page_navigation");
var content = document.getElementById("page_content");
function toggleMenu() {
if (nav.offsetLeft === 0) {
// Menu is visible
nav.style.left = -nav.clientWidth - 10 + "px";
content.style.left = "0";
} else {
// Menu is hidden
nav.style.left = "0";
content.style.left = nav.clientWidth + "px";
}
}
</script>
{{end}}

View File

@@ -6,27 +6,30 @@
{{template "user_style" .}}
<script type="text/javascript">var apiEndpoint = '{{.APIEndpoint}}';</script>
</head>
<body>
<img id="header_image" class="header_image" src="/res/img/header_neuropol.png" alt="Header image"/>
{{template "page_top" .}}
<div class="checkers highlight_dark">
<img id="header_image" class="header_image" src="/res/img/header_neuropol.png" alt="Header image"/>
</div>
<br/>
<div id="body" class="body">
{{template "menu" .}}
<div class="highlight_middle">
<input id="file_input_field" type="file" name="file" multiple="multiple"/>
<button id="select_file_button" class="big_button button_highlight">Upload Files</button>
<button id="text_button" class="big_button button_highlight" onClick="window.location.href = '/t/'">Upload Text</button><br/>
By uploading files to Pixeldrain you accept that a cookie will
be placed in your web browser. More information below.
<input id="file_input_field" type="file" name="file" multiple="multiple"/>
<button id="select_file_button" class="big_button button_highlight">Upload Files</button>
<button id="text_button" class="big_button button_highlight" onClick="window.location.href = '/t/'">Upload Text</button>
<br/><br/>
<div id="uploads_queue"></div>
</div>
<div class="highlight_dark">
<button id="btn_create_list">Create list with uploaded files</button>
<button id="btn_copy_links">Copy links to clipboard</button>
<button id="btn_copy_bbcode">Copy BBCode to clipboard</button>
</div>
By uploading files to Pixeldrain you accept that a cookie will be
placed in your web browser. More information below.
<br/><br/>
<div id="uploads_queue"></div>
<br/>
<button id="btn_create_list">Create list with uploaded files</button>
<button id="btn_copy_links">Copy links to clipboard</button>
<button id="btn_copy_bbcode">Copy BBCode to clipboard</button>
<br/>
<div class="centered">
<h1>What is Pixeldrain?</h1>
<p>
Pixeldrain is a file sharing website built for speed and ease of
@@ -47,6 +50,7 @@
(Inspired by <a href="https://github.com/vinceliuice/Canta-theme" target="_blank">Canta GTK</a>)<br/>
<input type="radio" id="style_arc" name="style"><label for="style_arc">Arc Style</label>
(Inspired by <a href="https://github.com/horst3180/Arc-theme" target="_blank">Arc GTK</a>)<br/>
<input type="radio" id="style_sunny" name="style"><label for="style_sunny">Sunny Style</label>
</div>
<h2>Questions and Answers</h2>
@@ -152,9 +156,10 @@
<a href="mailto:support@pixeldrain.com">support@pixeldrain.com</a>
</p>
{{template "footer"}}
</div>
{{template "page_bottom"}}
<script src="/res/script/jquery-2.1.4.min.js"></script>
<script type="text/javascript">var API_URL = "/api";</script>
<script src="/res/script/compiled/home.js"></script>

View File

@@ -11,7 +11,7 @@
position: absolute;
width: 8em;
height: 100%;
background-color: var(--accent_color_medium)
background-color: var(--layer_2_color)
}
.textarea_container {
position: absolute;
@@ -26,7 +26,7 @@
height: 100%;
width: 100%;
/* border: none !important; */
background: var(--accent_color_dark);
background: var(--layer_1_color);
}
.toolbar_button{