Skip to content
This repository has been archived by the owner on Aug 28, 2022. It is now read-only.

CSS

Jump to bottom
TheStngularity edited this page May 18, 2022 · 6 revisions

CSS

Switches

<input type="checkbox" id="check1" class="toggle">
<label for="check1">Default switch</label>

<input type="checkbox" id="check2" class="toggle colored">
<label for="check2">Colored switch</label>

<input type="checkbox" id="check3" class="toggle" disabled>
<label for="check3">Disabled switch</label>

Additional classes: colored

Buttons

<button class="btn">Default button</button>
<button class="btn danger">Danger(red) button</button>
<button class="btn success">success(green) button</button>
<button class="btn main">Main button</button>

Additional classes:

  • Default buttons: danger, success, main and rounded
  • Buttons for "social networks" and important sites: vk, discord, google, twitter, github and reddit

Inputs

<input type="text" class="input" placeholder="Text input">
<input type="file" class="input"> // File input
<input type="text" class="input validation" required placeholder="Text input with validation">
<select class="select">
    <optgroup label="Select 1">
        <option value="1.1">Option 1.1</option>
        <option value="1.2">Option 1.2</option>
    </optgroup>
    <optgroup label="Select 2">
        <option value="2.1">Option 2.1</option>
        <option value="2.2">Option 2.2</option>
    </optgroup>
</select>
<textarea class="input" placeholder="Textarea input"></textarea>

Scrollbar

<html class="custom-scrollbar">
    ...
</html>

Tooltips

<div data-tooltip="This is a tooltip!">Hover at me</div>

SyrGroup & TheStnularity © 2021-2022 All rights reserved

Home

CSS

JS

Clone this wiki locally