akf-forum/public/css/styles.css
2022-05-01 17:21:40 +03:00

260 lines
3.4 KiB
CSS

:root {
/* Apprentice Scheme */
/*
* use `var(--col-x)` instead of directly typing the color.
*/
--col-0: #1C1C1C;
--col-1: #AF5F5F;
--col-2: #5F875F;
--col-3: #87875F;
--col-4: #5F87AF;
--col-5: #5F5F87;
--col-6: #5F8787;
--col-7: #6C6C6C;
--col-8: #444444;
--col-9: #FF8700;
--col-10: #87AF87;
--col-11: #FFFFAF;
--col-12: #8FAFD7;
--col-13: #8787AF;
--col-14: #5FAFAF;
--col-15: #FFFFFF;
--col-fg: #BCBCBC;
--col-bg: #262626;
}
textarea {
font-family: monospace;
background-color: var(--col-bg);
border: 2px solid var(--col-8);
color: var(--col-fg);
width: auto;
height: auto;
cursor: pointer;
resize: none;
}
p {
font-size: 25px;
}
hr {
border-color: var(--col-8);
border: 0;
border-top: 1px solid var(--col-fg);
margin: 20px 0;
}
body,
h1,
h2,
h3,
h4,
h5,
h6 {
font-family: monospace;
background: var(--col-bg);
color: var(--col-fg);
max-width: 69rem;
margin-top: 10px;
margin: auto;
/* funny number */
}
a:link {
color: var(--col-4);
}
a:hover {
color: var(--col-1);
}
a:visited {
color: var(--col-13);
}
a:active {
color: var(--col-1);
}
pre {
background-color: var(--col-0);
padding: 1em;
border: 0;
}
h1,
h2,
h3,
h4,
h5 {
margin-bottom: 0.1rem;
}
hr {
border-color: var(--col-8);
}
button, input {
font-family: monospace;
background-color: var(--col-bg);
border: 2px solid var(--col-8);
color: var(--col-fg);
width: auto;
height: 30px;
}
button.buyuk {
width: 150px;
height: 50px;
}
input {
width: 75%;
cursor: pointer;
color: var(--col-fg);
}
button:hover {
background-color: var(--col-fg);
color: var(--col-bg);
}
/* NAVBAR: */
.navbar {
background-color: #333;
overflow: hidden;
}
.navbar a {
float: left;
color: var(--col-fg);
text-align: center;
padding: 14px 16px;
text-decoration: none;
font-size: 17px;
border-right: 3px solid var(--col-8);
}
.navbar a:hover {
background-color: var(--col-bg);
color: var(--col-fg);
}
.navbar h1:hover {
background-color: var(--col-bg);
color: var(--col-fg);
}
.navbar a.active {
background-color: var(--col-14);
color: var(--col-15);
}
.user {
margin: 0;
border: 1px solid var(--col-8);
}
.user h1 {
font-family: monospace;
background: #333;
color: var(--col-fg);
margin: auto;
text-align: center;
line-height: 1;
color: var(--col-13);
font-size: 27px;
}
.user img {
padding: 6px 10px;
}
.user a {
color: var(--col-13);
padding: 0px 5px;
}
/*
*****************************
IMAGES
*****************************
*/
/*
*****************************
IMAGES
*****************************
*/
img.yuvarlak {
border-radius: 50%;
height: 30px;
width: 30px;
}
img.logo {
width: 266px;
height: 75px;
}
/*
*****************************
FOOTER
*****************************
*/
.footer {
position: fixed;
left: 0;
bottom: 0;
width: 100%;
background-color: var(--col-8);
color: white;
text-align: center;
}
.footer p {
font-size: 16px;
color: white;
}
/*
*****************************
ADMIN TEXT
*****************************
*/
.admin {
position: fixed;
left: 0;
top: 0;
height: 20px;
width: 100%;
text-align: center;
}
.admin p {
font-size: 16px;
margin: auto;
color: var(--col-15);
}
.admin a {
background-color: var(--col-13);
border: 2px solid var(--col-8);
height: 20px;
color: var(--col-15);
}