Logo ThemeSuccess

Styles

This is the head part of document.

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Daniel - Creative and Responsive Bootstrap 5 Component based HTML Portfolio Template</title>
    <!--Usefull Meta-->
    <meta name="description" content="A slick, component based, customizable bootstrap 5.2 CV, Resume or Portfolio template, perfect for photographers, freelancers or designers.">
    <meta name="keywords" content="">
    <meta name="robots" content="index, follow, noodp">
    <meta name="googlebot" content="index, follow">
    <meta name="google" content="notranslate">
    <meta property="og:title" content="Daniel - Creative and Responsive Bootstrap 5 Component based HTML Portfolio Template">
    <meta property="og:description" content="A slick, component based, customizable bootstrap 5.2 CV, Resume or Portfolio template, perfect for photographers, freelancers or designers.">
    <meta property="og:image" content="">
    <meta property="og:url" content="">
    <!--Google Fonts-->
    <link rel="preconnect" href="https://fonts.gstatic.com">
    <link href="https://fonts.googleapis.com/css2?family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap" rel="stylesheet">
    <!--Splide -->
    <link rel="stylesheet" href="./assets/css/splide/splide-core.min.css">
    <!--AOS-->
    <link rel="stylesheet" href="./assets/css/aos.min.css">
    <!--Daniel Styelsheet with Bootstrap 5-->
    <link rel="stylesheet" href="./assets/css/daniel1.css">
    <!--Color Switcher-->
    <link rel="stylesheet" href="./assets/css/color_schema.css">
</head>

All CSS files are located in the assets/css folder.

All SCSS files are located in the assets/scss folder.

CSS and SCSS files are structured to be user-friendly and there is a table of contents so you can easily find any section.

Main Stylesheet

SCSS

In the SCSS folder you can find daniel.scss files. All files are structured using the Bootstrap framework. Read more here.

Using SCSS you can quickly adjust the settings of the template.

Main settings for SCSS are located in the daniel/variables.scss file.

Colors

Colors settings are located in daniel/_variables.scss file.

Layout colors

Here you can find the $layouts object variables. This object has two main properties: dark and light. Each property has all the information on the current layout colors such us background color, text color, secondary color, button colors etc.

Color Schemas

In the same file you will find $color_schemes object, that have 12 different colors.

Other Properties

In the variables.scss you can find

  • Heading font-sizes ($h1-font-size, $h2-font-size … )
  • Heading font-weight ($h1-font-weight, $h2-font-weight …)
  • Border radius ( $border-radius … )
  • Accordion settings
  • Input settings
  • Button settings
  • List settings
  • Shadow settings
  • Transitions settings

Read more about bootstrap 5.2 scss structure here.