Kagi websites are more suitable for wide screens.
/* ==UserStyle==
@name Kagi responsive + customizations
@version 1.0.0
@description Kagi websites are more suitable for wide screens.
@author BreatFR (https://breat.fr)
@namespace https://gitlab.com/breatfr
@homepageURL https://gitlab.com/breatfr/kagi
@supportURL https://discord.gg/Q8KSHzdBxs
@license AGPL-3.0-or-later; https://www.gnu.org/licenses/agpl-3.0.txt
@preprocessor stylus
@var text fontsize "Custom Font size" 1.2rem
@var checkbox darkmode "Dark mode" 1
@var checkbox hidescrollbars "Hide scrollbars" 1
@var checkbox hidesidebar "Hide sidebar" 1
@var checkbox savespace "Save space" 1
@var checkbox widemode "Wide mode" 1
==/UserStyle== */
/* === Credits ===
Website https://breat.fr
facebook https://www.facebook.com/breatfroff
mastodon https://mastodon.social/@breat_fr
telegram https://t.me/breatfr
vk https://vk.com/breatfroff
X (twitter) https://x.com/breatfroff
=== Credits === */
@-moz-document domain("kagi.com") {
/* Domain */
.cm-line,
.font-universal,
button > span,
input,
input::placeholder,
label,
textarea,
textarea::placeholder {
font-size: fontsize !important;
line-height: 1.5 !important;
}
if hidescrollbars {
*,
:root ::-webkit-scrollbar {
scrollbar-width: none !important;
-ms-overflow-style: none !important;
-moz-overflow-style: none !important;
-webkit-overflow-style: none !important;
}
::-webkit-scrollbar {
display: none;
width: 0;
}
}
}
@-moz-document url("https://kagi.com/assistant") {
/* Assistant */
if widemode {
#prompt-box {
flex: 0 1 auto;
margin: auto;
padding: 1em;
}
#prompt-box::before {
display: none;
}
}
}
@-moz-document url-prefix("https://kagi.com/assistant") {
/* Assistant */
.thread-more-menu {
left: 15% !important;
}
#promptBox {
border: 1px solid #454549;
border-radius: 1em;
padding: 1em;
}
.rich-placeholder {
align-items: center;
display: flex;
padding-bottom: .5em;
padding-left: 1em;
}
if hidesidebar {
.tags-pane {
display: none !important;
}
.sidebar-box {
width: 300px !important;
}
.main-center-box {
margin-left: 300px!important;
}
.thread-more-menu {
left: 8.5% !important;
}
}
if widemode {
.tags-pane {
width: auto !important;
}
#chat_box,
#prompt-box,
form#form {
max-width: 100%;
}
#chat_box {
padding: 0 2em;
}
#prompt-box {
padding: 0 1em 1em 1em;
}
form#form {
position: relative;
}
#prompt-box-focus-hint {
margin-bottom: .75em;
position: absolute !important;
}
.rich-placeholder {
left: auto;
padding-left: 0;
right: 1em;
}
.sidebar-box {
z-index: auto;
}
.prompt-options {
align-items: center;
bottom: 1em;
left: 1em;
margin-top: 0;
position: fixed;
right: auto;
z-index: 9999;
}
.chat_bubble[data-author="assistant"],
.chat_bubble[data-author="user"] {
border: 1px solid #454549;
border-radius: 1em;
margin: 1em 0;
max-width: 80%;
padding: 1em 1em 0 1em;
}
.chat_bubble[data-author="assistant"]::before,
.chat_bubble[data-author="user"]::before {
display: none;
}
.chat_bubble[data-author="user"] {
margin-left: auto;
}
.chat_bubble[data-author="user"] > div.content,
.chat_bubble[data-author="user"] [data-files] {
display: flex;
justify-content: flex-end;
}
form#form {
display: flex;
flex-direction: column-reverse;
}
#usage-limit-notice {
justify-content: center;
margin: auto;
width: fit-content;
}
#usage-limit-notice p {
text-align: center;
}
}
}
@-moz-document domain("news.kagi.com") {
/* News */
if darkmode {
:root {
color-scheme: dark !important;
}
}
if widemode {
main > div {
max-width: 100%;
}
form > div:nth-of-type(2) > div > div {
min-height: 100%;
}
}
}
@-moz-document domain("translate.kagi.com") {
/* Translate */
if darkmode {
:root {
color-scheme: dark !important;
}
.transition-colors {
display: none;
}
/* Logo */
[href="/"] {
background: url("data:image/svg+xml,%3Csvg width='112' height='42' viewBox='0 0 112 42' fill='%23ffb319' xmlns='http://www.w3.org/2000/svg'%3E%3Cg clip-path='url(%23a)'%3E%3Cpath d='M59.624 33.134h-7.376c-1.996 0-2.343-2.148-1.996-3.008.173-.43.607-1.03.954-1.46 1.389.773 3.038 1.203 4.773 1.203 5.554 0 9.98-4.469 9.98-9.883 0-2.921-1.301-5.5-3.297-7.39l.26-.258c.52-.515 1.302-.86 2.083-.773l1.215.086V6.924h-2.083c-2.43 0-4.426 1.461-5.294 3.524-.868-.258-1.822-.43-2.777-.43-5.554 0-9.98 4.469-9.98 9.882 0 2.149.694 4.211 1.91 5.844a2.6 2.6 0 0 1-.608.43l-.26.257c-1.996 1.89-2.951 4.297-2.43 7.047.26 1.46 1.562 3.008 2.863 3.867.868.601 1.996.86 3.125.86l8.33-.345c.955 0 1.823.43 2.344 1.29l1.041 1.976 5.12-1.719-.867-1.89a7.79 7.79 0 0 0-7.03-4.383M56.066 15.26c2.604 0 4.773 2.148 4.773 4.726s-2.17 4.727-4.773 4.727-4.773-2.149-4.773-4.727c0-2.664 2.083-4.726 4.773-4.726M30.547 9.931c-5.207.258-9.546 4.383-9.893 9.54-.434 6.1 4.426 11.17 10.414 11.17 1.996 0 3.818-1.117 5.38-2.062v1.805h5.12V19.9c-.26-5.758-5.12-10.226-11.02-9.969m.52 15.898c-3.123 0-5.553-2.492-5.553-5.5 0-3.093 2.516-5.5 5.554-5.5 3.124 0 5.554 2.493 5.554 5.5.087 3.008-2.43 5.5-5.554 5.5'/%3E%3Cpath d='M20.741 10.275h-7.203L7.29 16.463 5.12 18.61V6.752H0v23.632h5.12v-8.851l2.17 2.148v-.086l6.769 6.789h7.203L10.241 20.072zM70.902 28.58v1.718h5.12V10.276h-5.12zm2.521-21.14c1.821 0 3.298-1.462 3.298-3.266 0-1.803-1.477-3.265-3.298-3.265s-3.298 1.462-3.298 3.265 1.477 3.266 3.298 3.266'/%3E%3Cg clip-path='url(%23b)' fill-rule='evenodd' clip-rule='evenodd'%3E%3Cpath d='M92.242 11.063c.568 0 1.029.46 1.029 1.028v7.151c0 .568-.46 1.029-1.029 1.029h-7.15c-.569 0-1.03-.46-1.03-1.029v-7.15c0-.569.461-1.03 1.03-1.03zm2.654 1.028a2.654 2.654 0 0 0-2.654-2.653h-7.15a2.654 2.654 0 0 0-2.654 2.653v7.151a2.654 2.654 0 0 0 2.653 2.654h7.151a2.654 2.654 0 0 0 2.654-2.654z'/%3E%3Cpath d='M100.977 19.73h-6.352v-1.626h6.352a2.58 2.58 0 0 1 2.389 1.596c.13.314.197.65.197.99v7.287a2.586 2.586 0 0 1-2.586 2.585H93.69a2.586 2.586 0 0 1-2.586-2.585v-6.352h1.625v6.352a.96.96 0 0 0 .961.96h7.287a.96.96 0 0 0 .961-.96V20.69a.96.96 0 0 0-.961-.96m-12.852-7.584c.449 0 .813.364.813.812v.271h1.895a.812.812 0 1 1 0 1.625h-.478a9.8 9.8 0 0 1-.964 2.023c.479.42.915.686 1.442.686a.812.812 0 1 1 0 1.625c-1.04 0-1.845-.513-2.445-1.026a3.2 3.2 0 0 1-.634.492c-.48.282-1.017.415-1.662.522a.812.812 0 1 1-.267-1.602c.596-.1.89-.195 1.107-.322.21-.123.414-.317.746-.754a7.7 7.7 0 0 0 .939-1.644h-2.659a.813.813 0 0 1 0-1.625h1.355v-.27c0-.45.363-.813.812-.813'/%3E%3Cpath d='m97.333 23.442-.58 1.162h1.162zm1.394 2.787.588 1.176a.813.813 0 1 0 1.453-.727l-2.514-5.029a1.03 1.03 0 0 0-1.841 0l-2.515 5.03a.813.813 0 1 0 1.454.726l.588-1.176z'/%3E%3C/g%3E%3C/g%3E%3Cdefs%3E%3CclipPath id='a'%3E%3Cpath d='M0 0h112v40H0z'/%3E%3C/clipPath%3E%3CclipPath id='b'%3E%3Cpath d='M80 7h26v26H80z'/%3E%3C/clipPath%3E%3C/defs%3E%3C/svg%3E") center center / cover no-repeat;
height: 0;
padding-left: 112px;
padding-top: 42px;
width: 0;
}
}
/* Save space */
if savespace {
main > div > div > div > div:nth-of-type(1),
main > div > div > div > div:nth-of-type(5) {
padding: 2em;
}
main > div > div > div > div:nth-of-type(1) > div:nth-of-type(1) {
left: 11%;
position: fixed;
top: .6em;
width: auto;
}
main > div > div > div > div:nth-of-type(1) > div:nth-of-type(2) {
max-width: 100%
}
main > div > div > div > div:nth-of-type(5) > div:nth-of-type(1) {
right: 10%;
position: fixed;
top: .8em;
width: auto;
}
}
/* Wide mode */
if widemode {
main > div {
max-width: 100%;
}
form > div:nth-of-type(2) > div > div {
min-height: 100%;
}
}
}