remix-nlux
Version:
Remix IDE NLUX integration. Remix IDE is the leading IDE for building and deploying smart contracts on Ethereum. NLUX is a JavaScript and React library for building conversational AI experiences.
116 lines (96 loc) • 4.34 kB
CSS
/*
📐 CSS variables to control the layout of your theme.
*/
.nlux-AiChat-root.nlux-theme-dev {
/** 👇 Welcome message */
--nlux-WelcomeMessage-Avatar--Width: 60px;
--nlux-WelcomeMessage-PersonaName--FontSize: 22px;
--nlux-WelcomeMessage-PersonaName--FontWeight: 700;
--nlux-WelcomeMessage-Text--FontSize: 18px;
--nlux-WelcomeMessage-Text--FontWeight: 400;
--nlux-WelcomeMessage--Gap: 5px;
/** 👇 Loader */
--nlux-ChatRoom-Loader--Width: 25px;
/** 👇 Exceptions box ( displayed when an error occurs ) */
--nlux-Exceptions--Padding: 5px;
--nlux-Exceptions--BorderWidth: 5px;
--nlux-Exceptions--BorderRadius: 8px;
/** 👇 Conversation starters */
--nlux-ConversationStarter--Padding: 0 10px;
--nlux-ConversationStarter--BorderRadius: 50px;
--nlux-ConversationStarter--BorderWidth: 5px;
--nlux-ConversationStarter--Gap: 12px;
--nlux-ConversationStarter--Width: 160px;
--nlux-ConversationStarter--Height: 101px;
/** 👇 Conversation content */
--nlux-ChatRoom--LineHeight: 1.4;
--nlux-ChatRoom--FontWeight: 400;
--nlux-ChatRoom--FontFamily: 'Merienda', cursive;
--nlux-ChatRoom--FontSize: 16px;
--nlux-ChatRoom--Padding: 20px;
--nlux-ChatRoom--BorderRadius: 8px;
--nlux-ChatRoom--BorderWidth: 5px;
/** 👇 Chat item */
--nlux-ChatItem--AlignItems: flex-end;
/** 👇 Chat item avatar */
--nlux-ChatItem-Avatar--Width: 30px;
--nlux-ChatItem-Avatar--BorderRadius: 50%;
--nlux-ChatItem-Avatar--BorderWidth: 5px;
/** 👇 Chat item message */
--nlux-ChatItem-Message--Gap: 12px; /** Gap between elements within message */
/** 👇 Participant info in chat */
--nlux-ChatItem-ParticipantInfo--Gap: 12px;
--nlux-ChatItem-ParticipantInfo--Padding: 0px;
--nlux-ChatItem-ParticipantName--FontSize: 20px;
--nlux-ChatItem-ParticipantName--FontWeight: 700;
/** 👇 Chat item message in bubbles display layout */
--nlux-ChatItem-Message-BubbleLayout--BorderWidth: 5px;
--nlux-ChatItem-Message-BubbleLayout--BorderRadius: 8px;
--nlux-ChatItem-Message-BubbleLayout--PaddingTopBottom: 10px;
--nlux-ChatItem-Message-BubbleLayout--PaddingLeftRight: 15px;
/** 👇 Chat item message in list display layout */
--nlux-ChatItem-Message-ListLayout--BorderWidth: 2px;
--nlux-ChatItem-Message-ListLayout--BorderRadius: 2px;
--nlux-ChatItem-Message-ListLayout--PaddingTopBottom: 5px;
--nlux-ChatItem-Message-ListLayout--PaddingLeftRight: 10px;
--nlux-ChatItem-Message-ListLayout--MarginTop: 10px;
--nlux-ChatItem-Message-ListLayout--MarginBottom: 10px;
--nlux-ChatItem-Message-ListLayout--MarginLeft: 10px;
--nlux-ChatItem-Message-ListLayout--MarginRight: 10px;
/** 👇 Divider between conversation and composer */
--nlux-ChatRoom-Divider--MarginTop: 10px;
--nlux-ChatRoom-Divider--MarginBottom: 10px;
--nlux-ChatRoom-Divider--BorderWidth: 8px;
/** 👇 Composer */
--nlux-Composer--Gap: 5px;
/** 👇 Prompt input */
--nlux-PromptInput--FontFamily: 'Merienda', cursive;
--nlux-PromptInput--FontSize: 16px;
--nlux-PromptInput--BorderWidth: 5px;
--nlux-PromptInput--BorderRadius: 8px;
--nlux-PromptInput-Focus-Outline--Width: 5px;
--nlux-PromptInput-Max-Height: 80px;
--nlux-PromptInput-Height: 60px;
/** 👇 Submit button */
--nlux-SubmitButton--Width: 65px;
--nlux-SubmitButton--BorderWidth: 5px;
--nlux-SubmitButton--BorderRadius: 8px;
--nlux-SubmitButton-Focus-Outline--Width: 5px;
/** 👇 Code block in parsed markdown */
--nlux-CodeBlock--FontSize: 14px;
--nlux-CodeBlock--FontFamily: 'Courier New', monospace;
--nlux-CodeBlock--Padding: 10px;
--nlux-CodeBlock--BorderWidth: 5px;
--nlux-CodeBlock--BorderRadius: 8px;
/** 👇 Code block copy button */
--nlux-CodeBlock-CopyButton--Width: 28px;
--nlux-CodeBlock-CopyButton--Height: 28px;
--nlux-CodeBlock-CopyButton--Padding: 2px;
--nlux-CodeBlock-CopyButton--BorderRadius: 8px;
--nlux-CodeBlock-CopyButton--BorderWidth: 5px;
/** 👇 Inline code in markdown */
--nlux-InlineCode--BorderRadius: 6px;
--nlux-InlineCode--BorderWidth: 2px;
--nlux-InlineCode--Padding: 2px 4px;
--nlux-InlineCode--FontSize: 18px;
}