feat: style feed directory component

Author: gildesmarais

_sass/custom/_feed-directory.scss

@@ -0,0 +1,85 @@
+.feed-directory__item {
+  border: 1px solid var(--border-color);
+  display: flex;
+  justify-content: space-between;
+  align-items: flex-start;
+  border-radius: 8px;
+  background-color: var(--main-bg-color);
+  align-items: center; /* Vertically align items in the center */
+}
+
+.feed-directory__item-info {
+  display: flex;
+  flex-direction: column;
+  flex-grow: 1;
+  margin-right: 1rem;
+}
+
+.feed-directory__item-name {
+  font-family: var(--mono-font-family);
+  font-size: 1.2rem;
+  font-weight: bold;
+  margin-bottom: 0; /* Remove bottom margin to reduce vertical space */
+  color: var(--text-color);
+}
+
+.feed-directory__item-url {
+  color: var(--text-color);
+  margin-bottom: 1rem;
+  word-break: break-all;
+}
+
+.feed-directory__item-actions {
+  display: flex;
+  align-items: center;
+  gap: 1rem;
+  flex-shrink: 0;
+}
+
+.feed-directory__item-actions__rss-icon {
+  width: 24px;
+  height: 24px;
+}
+
+.feed-directory__item-actions__edit-link {
+  font-size: 0.9rem;
+  white-space: nowrap;
+}
+
+.feed-directory__item-param-form {
+  margin-top: 1rem;
+  padding-top: 1rem;
+  border-top: 1px solid var(--border-color);
+}
+
+.feed-directory__item-param-form__group {
+  /* Add styles if needed */
+}
+
+.feed-directory__item-param-form__label {
+  /* Add styles if needed */
+}
+
+.feed-directory__item-param-form__input {
+  /* Add styles if needed */
+}
+
+.feed-directory__item-param-form__code {
+  /* Add styles if needed */
+}
+
+.feed-directory__item-param-form__code-instance {
+  /* Add styles if needed */
+}
+
+.feed-directory__item-param-form__code-path-preview {
+  /* Add styles if needed */
+}
+
+.feed-directory__fieldset {
+  /* Add styles if needed */
+}
+
+.feed-directory__input {
+  /* Add styles if needed */
+}

assets/css/sass/base.scss

@@ -134,3 +134,5 @@ summary {
 summary:hover {
   color: var(--link-color);
 }
+
+@import "custom/feed-directory";