Elements of Qurno Blog Theme

Elements

This page demonstrate some basic elements and typography which you will use frequently within your site. Make the text bold or make it italic. Why not bold and italic both at a time. Here is the link to Astro.js website. Do you want to link a long text here how it looks in this theme.

URLs will automatically get turned into links. https://astro.build/.

Heading two

Heading three

Heading four

Heading five

Heading six

Paragraph

Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry’s standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book.

It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum.

Ordered List

1. The leap into electronic typesetting
2. It was popularised in the 1960s
   1. Recently with desktop publishing software
   2. An unknown printer took a galley
      1. Recently with desktop publishing software
      2. An unknown printer took a galley
3. It has survived not only five centuries
4. The final item

Unordered List

• The leap into electronic typesetting
• It was popularised in the 1960s
  • Recently with desktop publishing software
  • An unknown printer took a galley
    • Recently with desktop publishing software
    • An unknown printer took a galley
• It has survived not only five centuries
• The final item

Syntax Highlighting

/* form autofill style reset */
input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:focus,
textarea:-webkit-autofill,
textarea:-webkit-autofill:hover,
textarea:-webkit-autofill:focus {
  -webkit-text-fill-color: #000;
  -webkit-box-shadow: 0 0 0px 1000px #fff inset;
}

export async function getStaticPaths() {
  const posts: CollectionEntry<"blog">[] = await getCollection("blog");
  const authors: CollectionEntry<"author">[] = await getCollection("author");

  return posts.map((post) => {
    const currentAuthor = authors.find((author) => author.data.title === post.data.author);
    return {
      params: { slug: post.slug },
      props: { post, currentAuthor },
    };
  });
}

interface User {
  id: number
  firstName: string
  lastName: string
  role: string
}

function updateUser(id: number, update: Partial<User>) {
  const user = getUser(id)
  const newUser = { ...user, ...update }
  saveUser(id, newUser)
}

Callout

Callout Support’s Title, Theme and Icon. Also they all can be empty!
Themes are info | warning | success | error.
You can use emoji as icon.
if you keep the icon=""; it will be default icon. and if you didn’t set it; no icon will be shown.
You can use Markdown and HTML both inside callout.

<Callout title="Astro Is Awesome" theme="info" icon="🔥">
  **Create your own platform on the web.** Astro is a tool for building static websites with your favorite JS framework. But it will ship zero JavaScript to the browser 🤯.
</Callout>

<Callout>
  **Build your own online platform effortlessly.** Astro is a versatile framework for modern web creators to develop, deploy, and scale their content-driven projects.
</Callout>

Blockquote

Since its beginning in the 1950s, the field of artificial intelligence has cycled several times between periods of optimistic predictions and investment Alexender Toto

Bookmark / Links

Welcome, World | Astro astro.build

Astro's new look is live! Learn all about our new brand including the design process, our new logo, typeface, color palette, and mascot.

Astro astro.build

Astro builds fast content sites, powerful web applications, dynamic server APIs, and everything in-between.

Responsive Table

Colons (:--- left, :---: center and ---: right) can be used to align columns.

Image

Gallery

Youtube video

Vimeo video