background added

This commit is contained in:
tcsenpai 2025-03-11 12:19:32 +01:00
parent 96a1882323
commit 3477478cfd
2 changed files with 110 additions and 66 deletions

View File

@ -63,6 +63,10 @@ Contributions to SpaceLLama are welcome! Please feel free to submit issues, feat
Licensed under the [Do What The Fuck You Want To Public License](LICENSE.md).
See [LICENSE.md](LICENSE.md) for more details.
## Credits
- [Background Image](https://www.pexels.com/) - I could not find the right image; if you know the author, please let me know so I can give them the credits they deserve.
---
SpaceLLama: Bringing the power of OLLAMA to your browser for effortless web page summarization.

View File

@ -1,125 +1,165 @@
body {
font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
margin: 0;
padding: 0;
background-color: #f5f5f5;
color: #333;
font-family: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif;
margin: 0;
padding: 0;
background-image: url("https://static.pexels.com/photos/414171/pexels-photo-414171.jpeg");
background-size: cover;
-webkit-animation: slidein 100s;
animation: slidein 100s;
-webkit-animation-fill-mode: forwards;
animation-fill-mode: forwards;
-webkit-animation-iteration-count: infinite;
animation-iteration-count: infinite;
-webkit-animation-direction: alternate;
animation-direction: alternate;
background-color: #f5f5f5;
color: #333;
}
@-webkit-keyframes slidein {
from {
background-position: top;
background-size: 3000px;
}
to {
background-position: -100px 0px;
background-size: 2750px;
}
}
@keyframes slidein {
from {
background-position: top;
background-size: 3000px;
}
to {
background-position: -100px 0px;
background-size: 2750px;
}
}
.container {
max-width: 600px;
margin: 0 auto;
padding: 20px;
max-width: 600px;
margin: 0 auto;
padding: 20px;
}
h1 {
font-size: 24px;
margin-bottom: 20px;
color: #2c3e50;
font-size: 24px;
margin-bottom: 20px;
color: #2c3e50;
}
.btn {
display: inline-block;
padding: 10px 20px;
font-size: 16px;
border: none;
border-radius: 5px;
cursor: pointer;
transition: background-color 0.3s ease;
display: inline-block;
padding: 10px 20px;
font-size: 16px;
border: none;
border-radius: 5px;
cursor: pointer;
transition: background-color 0.3s ease;
}
.btn-primary {
background-color: #3498db;
color: white;
background-color: #3498db;
color: white;
}
.btn-primary:hover {
background-color: #2980b9;
background-color: #2980b9;
}
.btn-secondary {
background-color: #95a5a6;
color: white;
background-color: #95a5a6;
color: white;
}
.btn-secondary:hover {
background-color: #7f8c8d;
background-color: #7f8c8d;
}
.summary-container {
margin-top: 10px;
padding: 10px;
background-color: white;
border-radius: 5px;
box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
margin-top: 10px;
padding: 10px;
background-color: white;
border-radius: 5px;
box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
}
#summary h1, #summary h2, #summary h3 {
margin-top: 0px;
margin-bottom: 0px;
color: #2c3e50;
#summary h1,
#summary h2,
#summary h3 {
margin-top: 0px;
margin-bottom: 0px;
color: #2c3e50;
}
#summary p {
margin-top: 10px;
margin-bottom: 10px;
line-height: 1.6;
margin-top: 10px;
margin-bottom: 10px;
line-height: 1.6;
}
#summary ul, #summary ol {
padding-left: 20px;
margin-bottom: 10px;
margin-top: 10px;
#summary ul,
#summary ol {
padding-left: 20px;
margin-bottom: 10px;
margin-top: 10px;
}
#summary li {
margin-bottom: 10px;
margin-bottom: 10px;
}
#summary code {
background-color: #f0f0f0;
padding: 2px 4px;
border-radius: 3px;
font-family: 'Courier New', Courier, monospace;
background-color: #f0f0f0;
padding: 2px 4px;
border-radius: 3px;
font-family: "Courier New", Courier, monospace;
}
#summary pre {
background-color: #f0f0f0;
padding: 10px;
border-radius: 3px;
overflow-x: auto;
font-family: 'Courier New', Courier, monospace;
background-color: #f0f0f0;
padding: 10px;
border-radius: 3px;
overflow-x: auto;
font-family: "Courier New", Courier, monospace;
}
#open-options {
margin-top: 20px;
margin-top: 20px;
}
.form-group {
margin-top: 10px;
margin-top: 10px;
}
label {
display: block;
margin-bottom: 5px;
font-weight: bold;
display: block;
margin-bottom: 5px;
font-weight: bold;
}
textarea {
width: 100%;
padding: 10px;
border: 1px solid #ccc;
border-radius: 4px;
resize: vertical;
width: 100%;
padding: 10px;
border: 1px solid #ccc;
border-radius: 4px;
resize: vertical;
}
#save-prompt {
margin-top: 10px;
margin-bottom: 10px;
}
#summary, #system-prompt {
margin-top: 10px;
margin-bottom: 10px;
}
#summary,
#system-prompt {
user-select: text;
-webkit-user-select: text;
-moz-user-select: text;