a5b289e120
This commit updates the entire site to follow Material design guidelines, providing a more modern look and feel. The font has been changed to 'Roboto' and 'Roboto Slab' for a cleaner typography. The color scheme has been adjusted to match the provided palette, enhancing the visual appeal and consistency across the site. Additional changes include: - Updated background and text colors for better contrast. - Added box shadows and border-radius for a softer appearance. - Improved button styling with hover effects for better interactivity. These changes aim to improve user experience by aligning with current design standards and making the interface more intuitive and visually appealing. Fixes #FLAS-4
154 lines
2.1 KiB
CSS
154 lines
2.1 KiB
CSS
html {
|
|
font-family: 'Roboto', sans-serif;
|
|
background: #FEFAE0;
|
|
padding: 1rem;
|
|
}
|
|
|
|
body {
|
|
max-width: 960px;
|
|
margin: 0 auto;
|
|
background: white;
|
|
box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
|
|
border-radius: 8px;
|
|
}
|
|
|
|
h1, h2, h3, h4, h5, h6 {
|
|
font-family: 'Roboto Slab', serif;
|
|
color: #377ba8;
|
|
margin: 1rem 0;
|
|
}
|
|
|
|
a {
|
|
color: #377ba8;
|
|
text-decoration: none;
|
|
}
|
|
|
|
hr {
|
|
border: none;
|
|
border-top: 1px solid #E0E5B6;
|
|
}
|
|
|
|
nav {
|
|
background: #CCD5AE;
|
|
display: flex;
|
|
align-items: center;
|
|
padding: 0 0.5rem;
|
|
border-radius: 8px;
|
|
}
|
|
|
|
nav h1 {
|
|
flex: auto;
|
|
margin: 0;
|
|
}
|
|
|
|
nav h1 a {
|
|
text-decoration: none;
|
|
padding: 0.25rem 0.5rem;
|
|
color: #377ba8;
|
|
}
|
|
|
|
nav ul {
|
|
display: flex;
|
|
list-style: none;
|
|
margin: 0;
|
|
padding: 0;
|
|
}
|
|
|
|
nav ul li a, nav ul li span, header .action {
|
|
display: block;
|
|
padding: 0.5rem;
|
|
color: #377ba8;
|
|
}
|
|
|
|
.content {
|
|
padding: 0 1rem 1rem;
|
|
}
|
|
|
|
.content > header {
|
|
border-bottom: 1px solid #E0E5B6;
|
|
display: flex;
|
|
align-items: flex-end;
|
|
}
|
|
|
|
.content > header h1 {
|
|
flex: auto;
|
|
margin: 1rem 0 0.25rem 0;
|
|
}
|
|
|
|
.flash {
|
|
margin: 1em 0;
|
|
padding: 1em;
|
|
background: #FAEDCE;
|
|
border: 1px solid #377ba8;
|
|
border-radius: 4px;
|
|
}
|
|
|
|
.post > header {
|
|
display: flex;
|
|
align-items: flex-end;
|
|
font-size: 0.85em;
|
|
}
|
|
|
|
.post > header > div:first-of-type {
|
|
flex: auto;
|
|
}
|
|
|
|
.post > header h1 {
|
|
font-size: 1.5em;
|
|
margin-bottom: 0;
|
|
}
|
|
|
|
.post .about {
|
|
color: slategray;
|
|
font-style: italic;
|
|
}
|
|
|
|
.post .body {
|
|
white-space: pre-line;
|
|
}
|
|
|
|
.content:last-child {
|
|
margin-bottom: 0;
|
|
}
|
|
|
|
.content form {
|
|
margin: 1em 0;
|
|
display: flex;
|
|
flex-direction: column;
|
|
}
|
|
|
|
.content label {
|
|
font-weight: bold;
|
|
margin-bottom: 0.5em;
|
|
}
|
|
|
|
.content input, .content textarea {
|
|
margin-bottom: 1em;
|
|
padding: 0.5em;
|
|
border: 1px solid #E0E5B6;
|
|
border-radius: 4px;
|
|
}
|
|
|
|
.content textarea {
|
|
min-height: 12em;
|
|
resize: vertical;
|
|
}
|
|
|
|
input.danger {
|
|
color: #cc2f2e;
|
|
}
|
|
|
|
input[type=submit] {
|
|
align-self: start;
|
|
min-width: 10em;
|
|
background-color: #377ba8;
|
|
color: white;
|
|
border: none;
|
|
border-radius: 4px;
|
|
cursor: pointer;
|
|
transition: background-color 0.3s;
|
|
}
|
|
|
|
input[type=submit]:hover {
|
|
background-color: #2c5f8a;
|
|
}
|