@skhemata/skhemata-blog/src/style/SkhemataBlogSearchStyle.ts

Skhemata Blog Web Component. This web component provides several sub components in addition to main component, allowing featured blogs, blog listing and blog post display.

/**
 *
 * Lit Blog Post Style
 *
 * */

import { css } from '@skhemata/skhemata-base';

export const SkhemataBlogSearchStyle = css`
  :host {
    display: block;
    margin-top: 40px;

    --skhemata-blog-text-color: #5c6265;
    --light-grey-color: #969ea2;
    --lighter-grey-color: #dce3e6;
  }

  .search-control {
    position: relative;
  }

  fa-icon {
    width: 30px;
    display: inline-block;
    position: absolute;
    top: 15px;
    right: 20px;
    pointer-events: none;
  }

  fa-icon::slotted(*) {
    color: rgba(10, 10, 10, 0.05);
  }

  #search-input {
    padding-right: 60px;
  }
`;