voussoir/bringrss
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity

Match voussoirkit common.css.

Browse source
This commit is contained in:
voussoir 2022-11-11 15:26:06 -08:00
parent 0fe3e8a2e5
commit ed81edea6f
No known key found for this signature in database
GPG key ID: 5F7554F8C26DACCB
1 changed files with 29 additions and 23 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

52
frontends/bringrss_flask/static/css/common.css
View file

@ -3,6 +3,8 @@ This file contains styles that I want on almost all webpages that I make,
not specific to one project. not specific to one project.
*/ */
/* SCREEN SIZE CAPTURE ****************************************************************************/
/* /*
These properties are used by javascript functions in common.js. These properties are used by javascript functions in common.js.
See common.is_narrow_mode, is_wide_mode. See common.is_narrow_mode, is_wide_mode.
@ -23,6 +25,8 @@ getComputedStyle(document.documentElement).getPropertyValue("--narrow").trim() =
} }
} }
/**************************************************************************************************/
html html
{ {
height: 100vh; height: 100vh;
@ -46,6 +50,8 @@ body
min-height: 100%; min-height: 100%;
margin: 0; margin: 0;
padding: 8px;
grid-row-gap: 8px;
background-color: var(--color_primary); background-color: var(--color_primary);
} }
@ -68,26 +74,14 @@ textarea:disabled
background-color: var(--color_text_placeholder); background-color: var(--color_text_placeholder);
} }
input::placeholder, textarea::placeholder input::placeholder,
textarea::placeholder
{ {
color: var(--color_text_placeholder); color: var(--color_text_placeholder);
opacity: 1; opacity: 1;
} }
pre /* ELEMENTS I USE OFTEN ***************************************************************************/
{
white-space: pre-line;
}
.hidden
{
display: none !important;
}
.bold
{
font-weight: bold;
}
#header #header
{ {
@ -96,8 +90,7 @@ pre
flex-direction: row; flex-direction: row;
height: 18px; height: 18px;
margin: 8px; margin: 0;
margin-bottom: 0;
background-color: var(--color_transparency); background-color: var(--color_transparency);
} }
#header button #header button
@ -111,10 +104,7 @@ pre
flex: 1; flex: 1;
display: flex; display: flex;
justify-content: center; justify-content: center;
} align-items: center;
.header_element:hover
{
background-color: var(--color_transparency);
} }
#content_body #content_body
@ -123,8 +113,6 @@ pre
display: grid; display: grid;
grid-auto-rows: min-content; grid-auto-rows: min-content;
grid-gap: 8px; grid-gap: 8px;
padding: 8px;
} }
.panel .panel
@ -134,6 +122,20 @@ pre
padding: 8px; padding: 8px;
} }
/* NONSEMANTICS ***********************************************************************************/
.hidden
{
display: none !important;
}
.bold
{
font-weight: bold;
}
/* BUTTONS ****************************************************************************************/
button, button,
button * button *
{ {
@ -174,6 +176,8 @@ button:active
background-color: #ffea57; background-color: #ffea57;
} }
/* TABBED CONTAINER *******************************************************************************/
.tabbed_container .tabbed_container
{ {
display: flex; display: flex;
@ -225,6 +229,8 @@ button:active
/*border-top-color: transparent;*/ /*border-top-color: transparent;*/
} }
/* MESSAGE BUBBLES ********************************************************************************/
#message_area #message_area
{ {
display: grid; display: grid;