saudade/sues_virtual_life/sues_virtual_life.css

169 lines
3.1 KiB
CSS
Raw Normal View History

2023-06-14 12:18:54 -07:00
/**
* TABLE OF CONTENTS
*
* layout ................. site layout
* text ................... global text styles
* menu ................... left sidebar nav menu
* sidebar-text ........... text sections on sidebars
2023-06-14 15:35:40 -07:00
* missing ................ box for missing assets
2023-06-14 12:18:54 -07:00
*/
/* -------------------------------------------------------------------------- *\
&layout
\* -------------------------------------------------------------------------- */
2023-06-14 15:35:40 -07:00
body:not(#links) {
2023-06-14 12:18:54 -07:00
--background-color: #fff;
display: grid;
grid-template:
'header header header' 90px
'nav main aside' auto
'spacer spacer spacer' 10px
'footer footer footer' auto /
230px auto 200px;
}
body > * {
padding: 0 10px 10px;
}
header {
grid-area: header;
background-color: #7ac5cd;
text-align: center;
}
main {
grid-area: main;
background-color: #ffd700;
text-align: center;
padding-bottom: 0;
}
nav {
grid-area: nav;
background-color: #cd8c95;
}
aside {
grid-area: aside;
background-color: #cd8c95;
}
.spacer {
grid-area: spacer;
background-color: #cd8c95;
}
footer {
grid-area: footer;
background-color: #66cd00;
color: #fff;
text-align: center;
padding: 4px 0;
}
/* -------------------------------------------------------------------------- *\
&text
\* -------------------------------------------------------------------------- */
2023-06-14 15:35:40 -07:00
body:not(#links) {
2023-06-14 12:18:54 -07:00
--color: #000;
2023-06-14 12:18:54 -07:00
font-family: Tahoma, sans-serif;
color: var(--color);
font-weight: 100;
font-size: 10pt;
}
a, a:visited, a:active {
2023-06-14 12:18:54 -07:00
text-decoration: none;
}
a:hover {
2023-06-14 12:18:54 -07:00
text-decoration: underline overline;
cursor: crosshair;
}
2023-06-14 15:35:40 -07:00
.defunct {
text-decoration: line-through;
}
2023-06-14 12:18:54 -07:00
/* -------------------------------------------------------------------------- *\
&menu
\* -------------------------------------------------------------------------- */
.menu {
margin-top: 47px;
width: 190px;
}
.menu + .menu {
margin-top: 13px;
}
.menu-title {
font: bold 13px Verdana;
color: white;
background: #8b5f65 url(img/a-link.gif) no-repeat 8px 6px;
text-transform: uppercase;
padding: 7px 0 7px 31px;
}
.menu-item {
margin-bottom: 2px;
font-size: 13px;
background-color: #ffb6c1;
display: block;
padding: 5px 0 5px 8px;
line-height: 17px;
text-decoration: none;
color: #000;
}
.menu-item:visited, .menu-item:active {
color: #000;
}
.menu-item:hover {
text-decoration: none;
color: #fff;
background-color: #ffd700;
}
/* -------------------------------------------------------------------------- *\
&sidebar-text
\* -------------------------------------------------------------------------- */
.sidebar-text {
margin-top: 34px;
}
.sidebar-text + .sidebar-text {
margin-top: 17px;
}
.sidebar-text-title::before {
content: url(img/a-link.gif);
}
.sidebar-text-title {
text-decoration: underline;
}
2023-06-14 15:35:40 -07:00
/* -------------------------------------------------------------------------- *\
&missing
\* -------------------------------------------------------------------------- */
.missing {
border: 1px solid;
padding: 3px 7px;
font-style: italic;
display: inline-block;
}