Add dracula theming

3 files changed, 223 insertions, 56 deletions

diff --git a/.config/nyxt/init.lisp b/.config/nyxt/init.lisp
index b973077..f43ca9b 100644
--- a/.config/nyxt/init.lisp
+++ b/.config/nyxt/init.lisp
@@ -1,57 +1,5 @@
-;; prompt
-(define-configuration prompt-buffer
-  ((style (str:concat
-           %slot-default%
-           (cl-css:css
-            '((body
-               :background-color "black"
-               :color "#808080")
-              ("#prompt-area"
-               :background-color "black")
-              ;; The area you input text in.
-              ("#input"
-               :background-color "white")
-              (".source-name"
-               :color "black"
-               :background-color "gray")
-              (".source-content"
-               :background-color "black")
-              (".source-content th"
-               :border "1px solid lightgray"
-               :background-color "black")
-              ;; The currently highlighted option.
-              ("#selection"
-               :background-color "#37a8e4"
-               :color "black")
-              (.marked :background-color "darkgray"
-                       :font-weight "bold"
-                       :color "white")
-              (.selected :background-color "black"
-                         :color "white")))))))
+(in-package #:nyxt-user)
 
-;;; Panel buffers are the same in regards to style.
-(define-configuration (internal-buffer panel-buffer)
-  ((style
-    (str:concat
-     %slot-default%
-     (cl-css:css
-      '((body
-         :background-color "black"
-         :color "lightgray")
-        (hr
-         :color "darkgray")
-        (a
-         :color "lightgray")
-        (.button
-         :color "lightgray"
-         :background-color "gray")))))))
-
-;;Window
-(define-configuration window
-  ((message-buffer-style
-    (str:concat
-     %slot-default%
-     (cl-css:css
-      '((body
-         :background-color "black"
-         :color "white")))))))
+;; Import Files
+(nyxt::load-lisp "~/.config/nyxt/statusline.lisp")
+(nyxt::load-lisp "~/.config/nyxt/stylesheet.lisp")
diff --git a/.config/nyxt/statusline.lisp b/.config/nyxt/statusline.lisp
new file mode 100644
index 0000000..a90527e
--- /dev/null
+++ b/.config/nyxt/statusline.lisp
@@ -0,0 +1,73 @@
+;; (in-package #:nyxt-user)
+
+;; ;; Set StatusLines Mode Icons
+;; (define-configuration status-buffer ((glyph-mode-presentation-p t)))
+;; (define-configuration nyxt/force-https-mode:force-https-mode ((glyph "")))
+;; (define-configuration nyxt/blocker-mode:blocker-mode ((glyph "")))
+;; (define-configuration nyxt/proxy-mode:proxy-mode ((glyph "")))
+;; (define-configuration nyxt/reduce-tracking-mode:reduce-tracking-mode  ((glyph "")))
+;; (define-configuration nyxt/certificate-exception-mode:certificate-exception-mode ((glyph "")))
+;; (define-configuration nyxt/style-mode:style-mode ((glyph "")))
+;; (define-configuration nyxt/help-mode:help-mode ((glyph "")))
+;; (define-configuration nyxt/web-mode:web-mode ((glyph "ω")))
+;; (define-configuration nyxt/auto-mode:auto-mode ((glyph "α")))
+
+;;Set StatusLines URL Icons
+(defun laconic-format-status-load-status (buffer)
+ (if (web-buffer-p buffer)
+     (case (slot-value buffer 'nyxt::load-status)
+       (:unloaded "∅")
+       (:loading "∞")
+       (:finished ""))
+     ""))
+
+;;Remove https/www from URL
+(defun laconic-format-status-url (buffer)
+ (markup:markup
+  (:span
+      (format nil "~a ~a"
+              (laconic-format-status-load-status buffer)
+              (ppcre:regex-replace-all
+               "(https://|www\\.|/$)"
+               (render-url (url buffer))
+               "")))))
+
+;;Set StatusLines Webpage Loadtime
+(defun laconic-format-status-modes (buffer window)
+ (str:concat
+  (format-status-modes buffer window)
+  " | "
+  (format nil "~d:~d"
+          (mod (+ 5 (local-time:timestamp-hour (local-time:now))) 24)
+          (local-time:timestamp-minute (local-time:now)))))
+
+;;Configure StatusLines Design
+(defun laconic-format-status (window)
+ (flet ((input-indicating-background ()
+          (format nil "background-color: ~:[#50fa7b~;#ff5555~]"
+                  (or (current-mode 'vi-insert)
+                      (current-mode 'input-edit)))))
+   (let ((buffer (current-buffer window)))
+     (markup:markup
+      (:div :id "container"
+            (:div :id "controls"
+                  :style (input-indicating-background)
+                  (markup:raw ""))
+            (:div :class "arrow arrow-right"
+                  :style (input-indicating-background) "")
+            (:div :id "url"
+                  (markup:raw
+                   (laconic-format-status-url buffer)))
+            (:div :class "arrow arrow-right"
+                  :style "background-color:#21222C" "")
+            (:div :id "tabs"
+                  (title buffer))
+            (:div :class "arrow arrow-left"
+                  :style "background-color:#21222C" "")
+            (:div :id "modes"
+                  :title (nyxt::list-modes buffer)
+                  (laconic-format-status-modes buffer window)))))))
+
+;;Define Current Configuration
+(define-configuration window
+ ((status-formatter #'laconic-format-status)))
diff --git a/.config/nyxt/stylesheet.lisp b/.config/nyxt/stylesheet.lisp
new file mode 100644
index 0000000..1fc1e88
--- /dev/null
+++ b/.config/nyxt/stylesheet.lisp
@@ -0,0 +1,146 @@
+;; (in-package #:nyxt-user)
+
+;; ;; This only works on the versions of Nyxt after 2.2.4.
+;; (define-configuration browser
+;;   ((theme (make-instance
+;;            'theme:theme
+;;            :dark-p t
+;;            :background-color "#282a36"
+;;            :text-color "#f8f8f2"
+;;            :accent-color "#ff5555"
+;;            :primary-color "#50fa7b"
+;;            :secondary-color "#bd93f9"
+;;            :tertiary-color "#6272a4"
+;;            :quaternary-color "#44475a"))))
+
+;; ;; Custom Dark-mode for webpages
+;; (define-configuration nyxt/style-mode:dark-mode
+;;   ((style #.(cl-css:css
+;;              '((*
+;;                 :background-color "#282a36 !important"
+;;                 :background-image "none !important"
+;;                 :color "#f8f8f2")
+;;                (a
+;;                 :background-color "#282a36 !important"
+;;                 :background-image "none !important"
+;;                 :color "#6272a4 !important"))))))
+
+
+;; Configurations for versions below 2.2.4:
+
+;;Configure Webpage Colors
+(define-configuration window
+ ((message-buffer-style
+   (str:concat
+    %slot-default%
+    (cl-css:css
+     '((body
+        :background-color "#282a36"
+        :color "#f8f8f2")))))))
+
+;;Configure Prompt Section
+(define-configuration prompt-buffer
+ ((style (str:concat
+          %slot-default%
+          (cl-css:css
+           '((body
+              :background-color "#282a36"
+              :color "#f8f8f2")
+             ("#prompt-area"
+              :background-color "#282a36")
+             ("#input"
+              :background-color "#6272a4"
+              :color "#f8f8f2")
+             (".source-name"
+              :color "#f8f8f2"
+              :background-color "#bd93f9")
+             (".source-content"
+              :background-color "#282a36")
+             (".source-content th"
+              :border "1px solid #bd93f9"
+              :background-color "#282a36")
+             ("#selection"
+              :background-color "#44475a"
+              :color "#f8f8f2")
+             (.marked :background-color "#ff5555"
+                      :font-weight "bold"
+                      :color "#f8f8f2")
+             (.selected :background-color "#282a36"
+                        :color "#f8f8f2")))))))
+
+(define-configuration internal-buffer
+ ((style
+   (str:concat
+    %slot-default%
+    (cl-css:css
+     '((title
+        :color "#ff79c6")
+       (body
+        :background-color "#21222C"
+        :color "#f8f8f2")
+       (hr
+        :color "#44475a")
+       (a
+        :color "#6272a4")
+       (.button
+        :color "#f8f8f2"
+        :background-color "#44475a")))))))
+
+;;Configure History Tree Mode
+(define-configuration nyxt/history-tree-mode:history-tree-mode
+ ((nyxt/history-tree-mode::style
+   (str:concat
+    %slot-default%
+    (cl-css:css
+     '((body
+        :background-color "#21222C"
+        :color "lightgray")
+       (hr
+        :color "darkgray")
+       (a
+        :color "#50fa7b")
+       ("ul li::before"
+        :background-color "#f8f8f2")
+       ("ul li::after"
+        :background-color "#f8f8f2")
+       ("ul li:only-child::before"
+        :background-color "#f8f8f2")))))))
+
+;;Highlight Hint Buttons
+(define-configuration nyxt/web-mode:web-mode
+ ((nyxt/web-mode:highlighted-box-style
+   (cl-css:css
+    '((".nyxt-hint.nyxt-highlight-hint"
+       :background "#ff5555")))
+   :documentation "The style of highlighted boxes, e.g. link hints.")))
+
+;;Configure StatusLines Styles
+(define-configuration status-buffer
+ ((style (str:concat
+          %slot-default%
+          (cl-css:css
+           '(("#controls"
+              :border-top "1px solid #6272a4"
+              :background-color "#21222C")
+             ("#url"
+              :background-color "#21222C"
+              :color "#f8f8f2"
+              :border-top "1px solid #6272a4")
+             ("#modes"
+              :background-color "#21222C"
+              :border-top "1px solid #6272a4")
+             ("#tabs"
+              :background-color "#6272a4"
+              :color "#f8f8f2"
+              :border-top "1px solid #6272a4")))))))
+
+(define-configuration nyxt/style-mode:dark-mode
+ ((style #.(cl-css:css
+            '((*
+               :background-color "#21222C !important"
+               :background-image "none !important"
+               :color "#f8f8f2")
+              (a
+               :background-color "#21222C !important"
+               :background-image "none !important"
+               :color "#556B2F !important"))))))