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