mirror of
https://github.com/tcsenpai/spacellama.git
synced 2025-06-09 04:35:33 +00:00
background added
This commit is contained in:
parent
96a1882323
commit
3477478cfd
@ -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).
|
Licensed under the [Do What The Fuck You Want To Public License](LICENSE.md).
|
||||||
See [LICENSE.md](LICENSE.md) for more details.
|
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.
|
SpaceLLama: Bringing the power of OLLAMA to your browser for effortless web page summarization.
|
||||||
|
@ -1,125 +1,165 @@
|
|||||||
body {
|
body {
|
||||||
font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
|
font-family: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif;
|
||||||
margin: 0;
|
margin: 0;
|
||||||
padding: 0;
|
padding: 0;
|
||||||
background-color: #f5f5f5;
|
|
||||||
color: #333;
|
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 {
|
.container {
|
||||||
max-width: 600px;
|
max-width: 600px;
|
||||||
margin: 0 auto;
|
margin: 0 auto;
|
||||||
padding: 20px;
|
padding: 20px;
|
||||||
}
|
}
|
||||||
|
|
||||||
h1 {
|
h1 {
|
||||||
font-size: 24px;
|
font-size: 24px;
|
||||||
margin-bottom: 20px;
|
margin-bottom: 20px;
|
||||||
color: #2c3e50;
|
color: #2c3e50;
|
||||||
}
|
}
|
||||||
|
|
||||||
.btn {
|
.btn {
|
||||||
display: inline-block;
|
display: inline-block;
|
||||||
padding: 10px 20px;
|
padding: 10px 20px;
|
||||||
font-size: 16px;
|
font-size: 16px;
|
||||||
border: none;
|
border: none;
|
||||||
border-radius: 5px;
|
border-radius: 5px;
|
||||||
cursor: pointer;
|
cursor: pointer;
|
||||||
transition: background-color 0.3s ease;
|
transition: background-color 0.3s ease;
|
||||||
}
|
}
|
||||||
|
|
||||||
.btn-primary {
|
.btn-primary {
|
||||||
background-color: #3498db;
|
background-color: #3498db;
|
||||||
color: white;
|
color: white;
|
||||||
}
|
}
|
||||||
|
|
||||||
.btn-primary:hover {
|
.btn-primary:hover {
|
||||||
background-color: #2980b9;
|
background-color: #2980b9;
|
||||||
}
|
}
|
||||||
|
|
||||||
.btn-secondary {
|
.btn-secondary {
|
||||||
background-color: #95a5a6;
|
background-color: #95a5a6;
|
||||||
color: white;
|
color: white;
|
||||||
}
|
}
|
||||||
|
|
||||||
.btn-secondary:hover {
|
.btn-secondary:hover {
|
||||||
background-color: #7f8c8d;
|
background-color: #7f8c8d;
|
||||||
}
|
}
|
||||||
|
|
||||||
.summary-container {
|
.summary-container {
|
||||||
margin-top: 10px;
|
margin-top: 10px;
|
||||||
padding: 10px;
|
padding: 10px;
|
||||||
background-color: white;
|
background-color: white;
|
||||||
border-radius: 5px;
|
border-radius: 5px;
|
||||||
box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
|
box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
|
||||||
}
|
}
|
||||||
|
|
||||||
#summary h1, #summary h2, #summary h3 {
|
#summary h1,
|
||||||
margin-top: 0px;
|
#summary h2,
|
||||||
margin-bottom: 0px;
|
#summary h3 {
|
||||||
color: #2c3e50;
|
margin-top: 0px;
|
||||||
|
margin-bottom: 0px;
|
||||||
|
color: #2c3e50;
|
||||||
}
|
}
|
||||||
|
|
||||||
#summary p {
|
#summary p {
|
||||||
margin-top: 10px;
|
margin-top: 10px;
|
||||||
margin-bottom: 10px;
|
margin-bottom: 10px;
|
||||||
line-height: 1.6;
|
line-height: 1.6;
|
||||||
}
|
}
|
||||||
|
|
||||||
#summary ul, #summary ol {
|
#summary ul,
|
||||||
padding-left: 20px;
|
#summary ol {
|
||||||
margin-bottom: 10px;
|
padding-left: 20px;
|
||||||
margin-top: 10px;
|
margin-bottom: 10px;
|
||||||
|
margin-top: 10px;
|
||||||
}
|
}
|
||||||
|
|
||||||
#summary li {
|
#summary li {
|
||||||
margin-bottom: 10px;
|
margin-bottom: 10px;
|
||||||
}
|
}
|
||||||
|
|
||||||
#summary code {
|
#summary code {
|
||||||
background-color: #f0f0f0;
|
background-color: #f0f0f0;
|
||||||
padding: 2px 4px;
|
padding: 2px 4px;
|
||||||
border-radius: 3px;
|
border-radius: 3px;
|
||||||
font-family: 'Courier New', Courier, monospace;
|
font-family: "Courier New", Courier, monospace;
|
||||||
}
|
}
|
||||||
|
|
||||||
#summary pre {
|
#summary pre {
|
||||||
background-color: #f0f0f0;
|
background-color: #f0f0f0;
|
||||||
padding: 10px;
|
padding: 10px;
|
||||||
border-radius: 3px;
|
border-radius: 3px;
|
||||||
overflow-x: auto;
|
overflow-x: auto;
|
||||||
font-family: 'Courier New', Courier, monospace;
|
font-family: "Courier New", Courier, monospace;
|
||||||
}
|
}
|
||||||
|
|
||||||
#open-options {
|
#open-options {
|
||||||
margin-top: 20px;
|
margin-top: 20px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.form-group {
|
.form-group {
|
||||||
margin-top: 10px;
|
margin-top: 10px;
|
||||||
}
|
}
|
||||||
|
|
||||||
label {
|
label {
|
||||||
display: block;
|
display: block;
|
||||||
margin-bottom: 5px;
|
margin-bottom: 5px;
|
||||||
font-weight: bold;
|
font-weight: bold;
|
||||||
}
|
}
|
||||||
|
|
||||||
textarea {
|
textarea {
|
||||||
width: 100%;
|
width: 100%;
|
||||||
padding: 10px;
|
padding: 10px;
|
||||||
border: 1px solid #ccc;
|
border: 1px solid #ccc;
|
||||||
border-radius: 4px;
|
border-radius: 4px;
|
||||||
resize: vertical;
|
resize: vertical;
|
||||||
}
|
}
|
||||||
|
|
||||||
#save-prompt {
|
#save-prompt {
|
||||||
margin-top: 10px;
|
margin-top: 10px;
|
||||||
margin-bottom: 10px;
|
margin-bottom: 10px;
|
||||||
}
|
}
|
||||||
|
|
||||||
#summary, #system-prompt {
|
#summary,
|
||||||
|
#system-prompt {
|
||||||
user-select: text;
|
user-select: text;
|
||||||
-webkit-user-select: text;
|
-webkit-user-select: text;
|
||||||
-moz-user-select: text;
|
-moz-user-select: text;
|
||||||
|
Loading…
x
Reference in New Issue
Block a user