mirrors/treebird
0
0
Fork 1
Code Issues Pull requests Projects Releases Wiki Activity

Sidebar opacity, fix dark theme, and other stuff

Browse source 
FossilOrigin-Name: 9e6dd5bad46fd36aaa7e1cac0b0ac4507b9aafe89613dd98e184040835398c83
This commit is contained in:
nekobit 2022-07-15 05:24:33 +00:00
parent 65300b6ce8
commit 661272026c
13 changed files with 329 additions and 48 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

209
dist/treebird-dark.css vendored
View file

@ -1,5 +1,4 @@
/* Dark color overrides */
html
{
background-color: #202020;
@ -17,7 +16,7 @@ body
#navbar
{
border-top: 2px solid #5e5e5e;
border-top: 2px solid #4e4e4e;
background: linear-gradient(#3e3e3e, #262626);
border-bottom: 1px solid #101010;
}
@ -50,7 +49,7 @@ a, a:visited, a:hover, a:active
.sidebar
{
background-color: #222;
background-color: rgba(34, 34, 34, var(--sidebar-opacity));
}
.btn
@ -76,6 +75,16 @@ a, a:visited, a:hover, a:active
cursor: pointer;
}
.sidebarbtn
{
border: 1px solid transparent;
}
.sidebarbtn:hover
{
border: 1px solid #505050;
}
.sidebarbtn, .sidebarbtn:visited
{
color: #808080;
@ -147,9 +156,15 @@ select
border-color: #666;
}
select:hover
{
background: linear-gradient(#666, #505050);
}
.account-sidebar
{
background-color: #404040;
border-bottom: 1px dashed #505050;
}
.header-btn
@ -278,3 +293,191 @@ ul.large-list li .edit-list-btn
border: 1px solid #515151;
padding: 3px 7px;
}
.sidebarbtn-sub
{
color: unset;
}
#leftbar ul.sidebar-config
{
background: linear-gradient(#303030, #202020);
color: #cacaca;
border-radius: 6px;
padding: 4px;
margin: 8px;
border: 1px solid #505050;
box-shadow: inset 0px 2px 3px rgba(0, 0, 0, 0.1);
}
.sidebarbtn-sub:active, .sidebarbtn-sub:hover
{
background-color: #505050;
box-shadow: 0px 1px 0px #606060;
}
input[type=submit].post-btn
{
background: linear-gradient(#404040, #303030);
border: 1px solid #505050;
}
input[type=submit].post-btn:hover
{
background: linear-gradient(#505050, #404040);
border: 1px solid #505050;
}
.notification-compact
{
scrollbar-color: #404040 transparent;
}
.notification-compact .notification-content.is-mention
{
color: #f3f3f3;
}
.notification
{
border-bottom: 1px solid #505050;
width: 100%;
}
.sidebar-embed-container .navigation
{
background-color: rgba(60, 62, 64, .5);
}
.navigation tr td:not(:last-child), .tabs tr td:not(:last-child)
{
border-right: 1px solid #606060;
}
.navigation, .tabs
{
box-shadow: 0px 1px 0px #606060;
}
input[type=range] {
-webkit-appearance: none;
appearance: none;
height: 12px;
background: linear-gradient(#404040, #303030);
border: 1px solid #505050;
border-radius: 4px;
outline: none;
vertical-align: middle;
}
input[type=range]::-webkit-slider-thumb,
input[type=range]::-moz-range-thumb
{
-webkit-appearance: none;
appearance: none;
width: 20px;
height: 20px;
border: 1px solid #303236;
background: linear-gradient(#75777c, #505256);
cursor: pointer;
}
/* Accounts */
.acct-header
{
z-index: 1;
padding-left: 160px;
background: linear-gradient(#505053, #303033);
border-bottom: 1px solid #202020;
background-color: #e8e8e8;
}
.account-info
{
background: linear-gradient(#28282b, #37373a);
border-bottom: 1px solid #202020;
color: #cacaca;
}
.tabs .tab-btn:hover, .tabs .tab-btn:active
{
background: linear-gradient(#404040, #303032);
}
.tabs .tab-btn.active, .tabs .tab-btn:checked
{
color: #eee;
background: linear-gradient(#505052, #404045);
}
.tabs .tab-btn
{
color: #808080;
border-bottom: 2px solid #303030;
}
.btn-disabled, .btn-disabled:hover
{
background: #252525;
color: #606060;
}
.header-btn:hover, .header-btn:active
{
background: linear-gradient(#5c5c5c,#444);
}
html, body {
scrollbar-color: #303030 #101010;
}
.file-uploads-container .file-upload
{
overflow: hidden;
display: inline-block;
width: 200px;
margin: 2px 4px;
background: linear-gradient(#, #f7f7f7);
border: 1px solid #606060;
box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.2);
border-radius: 4px;
}
.file-upload .upload-info {
background: linear-gradient(#202020, #101010);
border-top: 1px solid #505050;
color: #ccc;
}
.btn-icon
{
border: 1px solid #5f6376;
background-color: #757991;
text-align: middle;
vertical-align: middle;
border-radius: 3px;
cursor: pointer;
}
.btn-icon svg
{
stroke: #ddd;
}
.btn-icon:hover
{
background-color: #696d82;
}
.btn-icon:active
{
background-color: #4e5161;
}
.nav-symbol
{
color: #aaa;
}

52
dist/treebird.css vendored
View file

@ -1,3 +1,9 @@
/* Variables */
:root
{
--sidebar-opacity: 1.0;
}
*
{
margin: 0;
@ -91,16 +97,8 @@ table.ui-table td
vertical-align: top;
}
#content
{
border-bottom-left-radius: 5px;
border-bottom-right-radius: 5px;
}
#navbar
{
border-top-left-radius: 5px;
border-top-right-radius: 5px;
border-top: 2px solid #fff;
background: linear-gradient(#fbfbfb, #ececef);
width: 1000px;
@ -208,7 +206,7 @@ table.ui-table td
min-height: 600px;
max-width: 180px;
min-width: 180px;
background-color: #eaecf0;
background-color: rgba(234, 236, 240, var(--sidebar-opacity));
}
.sidebar-frame
@ -461,6 +459,29 @@ select:hover
background: linear-gradient(#f0f0f0, #d0d0d0);
}
input[type=range] {
-webkit-appearance: none;
appearance: none;
height: 12px;
background: linear-gradient(#f3f3f3, #d5d5d5);
border: 1px solid #cacaca;
border-radius: 4px;
outline: none;
vertical-align: middle;
}
input[type=range]::-webkit-slider-thumb,
input[type=range]::-moz-range-thumb
{
-webkit-appearance: none;
appearance: none;
width: 20px;
height: 20px;
border: 1px solid #303236;
background: linear-gradient(#75777c, #505256);
cursor: pointer;
}
/*************************************************
* BUTTONS *
*************************************************/
@ -538,6 +559,11 @@ input[type=button], input[type=submit]
cursor: pointer;
}
.btn-icon svg
{
stroke: #ffffff;
}
.btn-icon:hover
{
background-color: #9096b3;
@ -548,13 +574,13 @@ input[type=button], input[type=submit]
background-color: #747890;
}
.post-btn
input[type=submit].post-btn
{
background: linear-gradient(#aa0000, #900000);
padding: 2px 25px 3px !important;
font-size: 15px;
border-radius: 4px;
border: none !important;
border: none;
color: #fff;
}
@ -2069,7 +2095,6 @@ input[type=checkbox].hidden:not(:checked) + .list-edit-content
.file-upload-btn svg
{
stroke: #ffffff;
width: 14px;
height: 14px;
text-shadow: 0px 1px 0px rgba(0, 0, 0, 0.2);
@ -2496,7 +2521,7 @@ input[type=submit].chatbox-btn
{
transform: rotate(-33deg) skew(-30deg);
border-radius: 75% 0 75% 75%;
margin-left: 31px;
margin-left: 28px;
}
.is-bun:before, .is-bun:after
@ -2682,6 +2707,7 @@ input[type=submit].chatbox-btn
{
padding: 0;
margin: 0;
border-radius: 0px;
}
#main-page, #navbar

11
src/base_page.c
View file

@ -55,6 +55,8 @@ void render_base_page(struct base_page* page, struct session* ssn, mastodont_t*
struct mstdnt_storage storage = { 0 };
struct mstdnt_notification* notifs = NULL;
size_t notifs_len = 0;
#define SIDEBAR_CSS_LEN 128
char sidebar_css[SIDEBAR_CSS_LEN];
if (keyint(ssn->cookies.logged_in))
login_string = "";
@ -131,10 +133,17 @@ void render_base_page(struct base_page* page, struct session* ssn, mastodont_t*
ssn->config.theme,
ssn->config.themeclr ? "-dark" : "");
}
if (ssn->config.sidebar_opacity)
{
float sidebar_opacity = (float)ssn->config.sidebar_opacity / 255.0f;
snprintf(sidebar_css, SIDEBAR_CSS_LEN, ":root { --sidebar-opacity: %.2f; }",
sidebar_opacity);
}
struct index_template index_tmpl = {
.title = L10N[locale][L10N_APP_NAME],
.sidebar_css = sidebar_css,
.theme_str = theme_str,
.prefix = config_url_prefix,
.background_url = background_url_css,

1
src/cookie.c
View file

@ -69,6 +69,7 @@ char* read_cookies_env(struct cookie_values* cookies)
{ "statdope", &(cookies->stat_dope), key_int },
{ "statoneclicksoftware", &(cookies->stat_oneclicksoftware), key_int },
{ "statemojolikes", &(cookies->stat_emojo_likes), key_int },
{ "sidebaropacity", &(cookies->sidebar_opacity), key_int },
{ "stathidemuted", &(cookies->stat_hide_muted), key_int },
{ "instanceshowshoutbox", &(cookies->instance_show_shoutbox), key_int },
{ "instancepanel", &(cookies->instance_panel), key_int },

1
src/cookie.h
View file

@ -45,6 +45,7 @@ struct cookie_values
struct key stat_hide_muted;
struct key instance_show_shoutbox;
struct key instance_panel;
struct key sidebar_opacity;
struct key notif_embed;
};

1
src/local_config.h
View file

@ -41,6 +41,7 @@ struct local_config
int instance_show_shoutbox;
int instance_panel;
int notif_embed;
int sidebar_opacity;
};
#endif // LOCAL_CONFIG_H

51
src/local_config_set.c
View file

@ -22,13 +22,13 @@
#define post_bool_intp(post) (post->is_set ? keypint(post) : 0)
int set_config_str(struct session* ssn,
char** v,
char* cookie_name,
struct key* post,
struct key* cookie,
enum config_page page,
enum config_page curr_page)
void set_config_str(struct session* ssn,
char** v,
char* cookie_name,
struct key* post,
struct key* cookie,
enum config_page page,
enum config_page curr_page)
{
if (page == curr_page)
{
@ -47,13 +47,13 @@ int set_config_str(struct session* ssn,
return 0;
}
int set_config_int(struct session* ssn,
int* v,
char* cookie_name,
struct key* post,
struct key* cookie,
enum config_page page,
enum config_page curr_page)
void set_config_int(struct session* ssn,
int* v,
char* cookie_name,
struct key* post,
struct key* cookie,
enum config_page page,
enum config_page curr_page)
{
if (page == curr_page)
{
@ -77,23 +77,18 @@ int set_config_int(struct session* ssn,
// Shorthand for the arguments passed into functions below
#define LOAD_CFG_SIM(strcookie, varname) ssn, &(ssn->config.varname), (strcookie), &(ssn->post.varname), &(ssn->cookies.varname), page
void load_config(struct session* ssn, mastodont_t* api, enum config_page page)
struct mstdnt_storage* load_config(struct session* ssn, mastodont_t* api, enum config_page page)
{
struct mstdnt_attachment* attachments = NULL;
struct mstdnt_storage* storage = NULL;
size_t attachments_len = 0;
if (ssn->post.set.is_set)
{
struct mstdnt_attachment* attachments = NULL;
struct mstdnt_storage* storage = NULL;
if (try_upload_media(&storage, ssn, api, &attachments, NULL) == 0)
{
struct key atm = { .type.s = attachments[0].url, .is_set = 1 };
set_config_str(ssn, &(ssn->config.background_url), "background_url", &(atm), &(ssn->cookies.background_url), page, CONFIG_APPEARANCE);
}
if (storage)
cleanup_media_storages(ssn, storage);
try_upload_media(&storage, ssn, api, &attachments, NULL);
}
if (!ssn->post.set.is_set)
ssn->config.background_url = keystr(ssn->cookies.background_url);
struct key atm = { .type.s = attachments ? attachments[0].url : NULL, .is_set = attachments ? 1 : 0 };
set_config_str(ssn, &(ssn->config.background_url), "background_url", &(atm), &(ssn->cookies.background_url), page, CONFIG_APPEARANCE);
set_config_int(LOAD_CFG_SIM("sidebaropacity", sidebar_opacity), CONFIG_APPEARANCE);
set_config_str(LOAD_CFG_SIM("theme", theme), CONFIG_APPEARANCE);
set_config_int(LOAD_CFG_SIM("themeclr", themeclr), CONFIG_APPEARANCE);
set_config_int(LOAD_CFG_SIM("jsactions", jsactions), CONFIG_GENERAL);
@ -111,4 +106,6 @@ void load_config(struct session* ssn, mastodont_t* api, enum config_page page)
set_config_int(LOAD_CFG_SIM("notifembed", notif_embed), CONFIG_GENERAL);
set_config_int(LOAD_CFG_SIM("interact_img", interact_img), CONFIG_GENERAL);
set_config_int(LOAD_CFG_SIM("lang", lang), CONFIG_GENERAL);
return storage;
}

36
src/local_config_set.h
View file

@ -30,7 +30,18 @@ enum config_page
CONFIG_APPEARANCE,
};
int set_config_str(struct session* ssn,
/*!
* Sets a config string
*
* \param ssn The session to modify
* \param v The (config) character pointer to modify
* \param cookie_name The cookie name to match
* \param post The post value to check
* \param cookie The cookie value to store into
* \param page The page that this value is expected to be set on.
* \param curr_page The page to check against
*/
void set_config_str(struct session* ssn,
char** v,
char* cookie_name,
struct key* post,
@ -38,7 +49,18 @@ int set_config_str(struct session* ssn,
enum config_page page,
enum config_page curr_page);
int set_config_int(struct session* ssn,
/*!
* Sets a config integer
*
* \param ssn The session to modify
* \param v The (config) integer pointer to modify
* \param cookie_name The cookie name to match
* \param post The post value to check
* \param cookie The cookie value to store into
* \param page The page that this value is expected to be set on.
* \param curr_page The page to check against
*/
void set_config_int(struct session* ssn,
int* v,
char* cookie_name,
struct key* post,
@ -46,6 +68,14 @@ int set_config_int(struct session* ssn,
enum config_page page,
enum config_page curr_page);
void load_config(struct session* ssn, mastodont_t* api, enum config_page page);
/*!
* Loads the config and sets the values based on POST or session
*
* \param ssn The session
* \param api mastodont-c api
* \param page Page enum, to ensure that config changes on different pages don't effect other cookies
* \return Storage if files were uploaded, must free. This might change
*/
struct mstdnt_storage* load_config(struct session* ssn, mastodont_t* api, enum config_page page);
#endif // LOCAL_CONFIG_SET_H

5
src/main.c
View file

@ -137,6 +137,7 @@ int main(void)
.instance_show_shoutbox = 1,
.instance_panel = 1,
.notif_embed = 1,
.sidebar_opacity = 255,
},
.cookies = {{}},
.post = {{}},
@ -156,7 +157,7 @@ int main(void)
char* path_info = getenv("PATH_INFO");
if (path_info && strcmp(path_info, "/config/appearance") == 0)
page = CONFIG_APPEARANCE;
load_config(&ssn, &api, page);
struct mstdnt_storage* attachments = load_config(&ssn, &api, page);
// Load current account information
get_account_info(&api, &ssn);
@ -170,6 +171,8 @@ int main(void)
free_files(&(keyfile(ssn.post.files)));
if (ssn.logged_in) mstdnt_cleanup_account(&(ssn.acct));
mastodont_storage_cleanup(&(ssn.acct_storage));
if (attachments)
cleanup_media_storages(&ssn, attachments);
++run_count;
}

1
src/query.c
View file

@ -118,6 +118,7 @@ char* read_post_data(struct post_values* post)
{ "statemojolikes", &(post->stat_emojo_likes), key_int },
{ "stathidemuted", &(post->stat_hide_muted), key_int },
{ "instanceshowshoutbox", &(post->instance_show_shoutbox), key_int },
{ "sidebaropacity", &(post->sidebar_opacity), key_int },
{ "instancepanel", &(post->instance_panel), key_int },
{ "notifembed", &(post->notif_embed), key_int },
{ "file", &(post->files), key_files }

1
src/query.h
View file

@ -64,6 +64,7 @@ struct post_values
struct key visibility; // String
struct key instance; // String
struct key emojoindex; // Int
struct key sidebar_opacity; // Int
// Navigation
struct key min_id; // String

5
static/config_appearance.tmpl
View file

@ -31,6 +31,11 @@
<input type="file" name="file">
</li>
</ul>
<ul>
<li>
Sidebar opacity: <input type="range" name="sidebaropacity" min="0" max="255" value="255">
</li>
</ul>
<input class="btn btn-single" type="submit" value="Save">
</form>

3
static/index.tmpl
View file

@ -8,6 +8,9 @@
{{ %s : theme_str }}
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta name="description" content="{{ %s : title }} is a decentralized social media platform">
<style>
{{ %s : sidebar_css }}
</style>
</head>
<body>
<div id="main-page">