mirror of https://github.com/astrit/css.gg.git
Update licence
This commit is contained in:
astrit
parent
c635d0c826
commit
66c2a405d3
|
|
@ -1,3 +1,7 @@
|
|||
### 2.1.1: 2024-08-26
|
||||
|
||||
- Remove unused files and prepare strucutre for new version
|
||||
|
||||
### 2.1.1: 2020-06-23
|
||||
|
||||
- PNG version added black and white 1400 assets
|
||||
|
|
|
|||
33
LICENSE
33
LICENSE
|
|
@ -1,21 +1,22 @@
|
|||
MIT License
|
||||
License Agreement for CSS＊GG & GLYF＊APP (https://css.gg and https://glyf.app)
|
||||
|
||||
Copyright (c) 2019 css.gg
|
||||
Copyright © 2024 CSS＊GG & GLYF＊APP (https://css.gg and https://glyf.app)
|
||||
|
||||
**Note**: The previous versions of the CSS.GG icon library (stylized as CSS＊GG) and glyf.app (stylized as GLYF＊APP) are licensed under the MIT License. This new license applies to the current version and all future versions of the Library.
|
||||
|
||||
This license applies to the CSS.GG icon library (stylized as CSS＊GG) and glyf.app (stylized as GLYF＊APP).
|
||||
|
||||
Permission is hereby granted, free of charge, to any person obtaining a copy
|
||||
of this software and associated documentation files (the "Software"), to deal
|
||||
in the Software without restriction, including without limitation the rights
|
||||
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
|
||||
copies of the Software, and to permit persons to whom the Software is
|
||||
furnished to do so, subject to the following conditions:
|
||||
of this icon library (the "Library"), to use the Library under the following conditions:
|
||||
|
||||
The above copyright notice and this permission notice shall be included in all
|
||||
copies or substantial portions of the Software.
|
||||
1. **Attribution**: Users must provide appropriate credit to the original author, Astrit, as well as reference the brands CSS.GG (stylized as CSS＊GG) or glyf.app (stylized as GLYF＊APP) in any copies or substantial portions of the Library.
|
||||
|
||||
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
|
||||
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
|
||||
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
|
||||
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
|
||||
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
|
||||
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
|
||||
SOFTWARE.
|
||||
2. **Prohibition on Copying Functionality**: Users are expressly prohibited from copying, replicating, or using the same functionality or features of the Library in any other software or platform, whether commercial or non-commercial.
|
||||
|
||||
3. **No Derivative Works**: Users may not modify, adapt, or create derivative works based on the Library's functionality.
|
||||
|
||||
4. **Allowed Uses**: Users may use the Library for personal, non-commercial purposes, provided that they adhere to the attribution requirement.
|
||||
|
||||
5. **Disclaimer**: THE LIBRARY IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE LIBRARY OR THE USE OR OTHER DEALINGS IN THE LIBRARY.
|
||||
|
||||
For the full text of this license, please visit: https://css.gg
|
||||
|
|
|
|||
844
README.md
844
README.md
|
|
@ -1,842 +1,28 @@
|
|||
# [YouTube](https://youtube.com/@astrit) · [App](https://css.gg) · [Figma](https://css.gg/fig)
|
||||
## [CSS＊GG](https://css.gg)
|
||||
|
||||
A comprehensive, open-source CSS icons library. \
|
||||
Featuring Vanilla CSS, SVG and Figma UI icons
|
||||
|
||||
Now also a collection of well organised [6000 Unique Glyphs](https://glyf.app), \
|
||||
easy copy paste and available on the raycast extension.
|
||||
|
||||
### Update 2024-08-26
|
||||
|
||||
The new version is live on the website, with a new design and a new way to browse the icons. \
|
||||
Soon to be released as a Figma plugin and the new version of the library.
|
||||
|
||||
<br>
|
||||
|
||||
## [700 Pure CSS, SVG, PNG Icons](https://css.gg)
|
||||
Other resources: [YouTube](https://youtube.com/@astrit), [Figma](https://www.figma.com/community/file/1284635132283811437/glyf-app-6000-variable-glyphs), [Raycast](https://www.raycast.com/astrit/css-gg), [GLYF＊APP](https://glyf.app)
|
||||
|
||||
Open-source CSS, SVG and Figma UI Icons \
|
||||
Available in SVG Sprite, styled-components, NPM & API
|
||||
!!! Now available as PNG in white and black colors
|
||||
|
||||
<br>
|
||||
|
||||
## [6000 Unique Glyphs](https://glyphs.css.gg)
|
||||
|
||||
Now also a collection of well organised 6000+ glyphs, easy copy paste and available on the raycast extension.
|
||||
|
||||
<br>
|
||||
<br>
|
||||
|
||||
<a title="Install css-gg Raycast Extension" href="https://www.raycast.com/astrit/css-gg"><img src="https://www.raycast.com/astrit/css-gg/install_button@2x.png" height="64" alt="" style="height: 64px;"></a>
|
||||
|
||||
<br>
|
||||
<br>
|
||||
|
||||
      
|
||||
|
||||
|
||||
|
||||
|
||||
<br>
|
||||
<br>
|
||||
|
||||
# New in 2.1
|
||||
|
||||
#### 🥳 1400 New Icons, in white and black PNG
|
||||
|
||||
#### 🚀 6000+ glyphs available also available on [glyphs.css.gg](https://glyphs.css.gg)
|
||||
|
||||
<br>
|
||||
<br>
|
||||
|
||||
# Table of Contents
|
||||
|
||||
- [Get Started](#get-started)
|
||||
- [HTML include](#html-include)
|
||||
- [1. All icons](#1-all-icons)
|
||||
- [2. Single icon](#2-single-icon)
|
||||
- [3. Collection](#3-collection)
|
||||
- [4. Markup](#4-markup)
|
||||
- [5. Example](#5-example)
|
||||
- [CSS @import](#css--import)
|
||||
- [1. All icons](#1-all-icons-1)
|
||||
- [2. Single icon](#2-single-icon-1)
|
||||
- [3. Collection](#3-collection-1)
|
||||
- [4. Resizing](#4-resizing)
|
||||
- [5. Coloring](#5-coloring)
|
||||
- [SVG](#svg)
|
||||
- [1. SVG Sprite - Download Path](#1-svg-sprite---download-path)
|
||||
- [1.1. Example](#11-example)
|
||||
- [2. SVG Single Icon - Download Path](#2-svg-single-icon---download-path)
|
||||
- [2.1. Example - SVG Sprite](#21-example---svg-sprite)
|
||||
- [2.2. Example - Inline SVG Sprite/Symbol](#22-example---inline-svg-sprite-symbol)
|
||||
- [2.3. Example Single copy/paste icon](#23-example-single-copy-paste-icon)
|
||||
- [3. Encode SVG for CSS](#3-encode-svg-for-css)
|
||||
- [3.1. Example - Encoded SVG for CSS icon](#31-example---encoded-svg-for-css-icon)
|
||||
- [4. Coloring a SVG icon](#4-coloring-a-svg-icon)
|
||||
- [4.1. Directly on the icon](#41-directly-on-the-icon)
|
||||
- [4.2. using class](#42-using-class)
|
||||
- [JSON - paths](#json---paths)
|
||||
- [1. All icons](#1-all-icons-2)
|
||||
- [2. Single icon](#2-single-icon-2)
|
||||
- [3. Collection](#3-collection-2)
|
||||
- [XML - paths](#xml---paths)
|
||||
- [1. All icons](#1-all-icons-3)
|
||||
- [2. Single icon](#2-single-icon-3)
|
||||
- [3. Collection](#3-collection-3)
|
||||
- [React](#react)
|
||||
- [1. Styled Components](#1-styled-components---)
|
||||
- [2. Local Single Icon as `styled-component`](#2-local-single-icon-as--styled-component-)
|
||||
- [2.1. Copy directly from the page](#21-copy-directly-from-the-page)
|
||||
- [2.2. Local Component Example](#22-local-component-example)
|
||||
- [3. SVG Sprite method](#3-svg-sprite-method)
|
||||
- [4. All CSS icons](#4-all-css-icons)
|
||||
- [4.1. Single CSS icon](#41-single-css-icon)
|
||||
- [5. All SCSS icons](#5-all-scss-icons)
|
||||
- [5.1. Single SCSS icon](#51-single-scss-icon)
|
||||
- [6. Combined import SVG, CSS, SCSS etc.](#6-combined-import-svg-css-scss-etc)
|
||||
- [Design Tools](#design-tools)
|
||||
- [1. Figma](#1-figma---httpscssggfig)
|
||||
- [2. Adobe XD](#2-adobe-xd---httpscssggxd)
|
||||
- [Contributors](#contributors)
|
||||
- [Donate](#donate)
|
||||
- [Support](#support)
|
||||
- [v.1.0.6 or older](#v106-or-older)
|
||||
- [TODO:](#todo)
|
||||
|
||||
# Get Started
|
||||
|
||||
Install the latest version via npm or yarn
|
||||
|
||||
```shell
|
||||
npm i css.gg
|
||||
```
|
||||
|
||||
```shell
|
||||
yarn add css.gg
|
||||
```
|
||||
|
||||
Using Package Manager \
|
||||
This package contains the following directories and files:
|
||||
|
||||
| Path | What it is |
|
||||
| :----------------------------------------------------------------------------------------------------- | :------------------------------------------------------------ |
|
||||
| /icons/css | individual \*.css icons |
|
||||
| /icons/scss | individual \*.scss icons |
|
||||
| /icons/svg | individual \*.svg icons |
|
||||
| /icons/tsx | individual \*.tsx icons `styled-components` |
|
||||
| /icons/icons.css | all icons compressed in a single file |
|
||||
| /icons/icons.d.ts | `styled-components` |
|
||||
| /icons/icons.fig | local figma file same as https://css.gg/fig |
|
||||
| /icons/icons.js | list of exported `styled-components` |
|
||||
| /icons/icons.js.map | `styled-components` |
|
||||
| /icons/icons.json | all icons _.css, _.svg, \*.tsx including markup & public path |
|
||||
| /icons/icons.scss | all icons in a single SCSS file `npm i node-sass` needed |
|
||||
| /icons/icons.svg | SVG Sprite with all icons |
|
||||
| /icons/icons.xml | all icons _.css, _.svg, \*.tsx including markup & public path |
|
||||
| /glyphs/glyphs.json | 6000 glyphs categorized and available on json format |
|
||||
|
||||
<br>
|
||||
<br>
|
||||
|
||||
# ❤️ Support
|
||||
#### Support
|
||||
|
||||
If you want to support further development of this project consider becoming a sponsor
|
||||
<br>
|
||||
[Github Sponsor — github.com/sponsors/astrit](https://github.com/sponsors/astrit)
|
||||
|
||||
<br>
|
||||
|
||||
# HTML include
|
||||
|
||||
#### 1. All icons
|
||||
|
||||
```html
|
||||
<!-- css.gg -->
|
||||
<link href="https://css.gg/css" rel="stylesheet" />
|
||||
|
||||
<!-- UNPKG -->
|
||||
<link href="https://unpkg.com/css.gg/icons/icons.css" rel="stylesheet" />
|
||||
|
||||
<!-- JSDelivr -->
|
||||
<link
|
||||
href="https://cdn.jsdelivr.net/npm/css.gg/icons/icons.css"
|
||||
rel="stylesheet"
|
||||
/>
|
||||
```
|
||||
|
||||
#### 2. Single icon
|
||||
|
||||
```html
|
||||
<!-- css.gg -->
|
||||
<link href="https://css.gg/ {ICONNAME} .css" rel="stylesheet" />
|
||||
|
||||
<!-- UNPKG -->
|
||||
<link
|
||||
href="https://unpkg.com/css.gg/icons/css/ {ICONNAME} .css"
|
||||
rel="stylesheet"
|
||||
/>
|
||||
|
||||
<!-- JSDelivr -->
|
||||
<link
|
||||
href="https://cdn.jsdelivr.net/npm/css.gg/icons/css/ {ICONNAME} .css"
|
||||
rel="stylesheet"
|
||||
/>
|
||||
```
|
||||
|
||||
#### 3. Collection
|
||||
|
||||
```html
|
||||
<!-- CSS Format -->
|
||||
<link href="https://css.gg/css?= {ICONNAME} | {ICONNAME}" rel="stylesheet" />
|
||||
```
|
||||
|
||||
#### 4. Markup
|
||||
|
||||
```html
|
||||
<i class=" {ICONNAME} "></i>
|
||||
|
||||
<!-- reference icon using span -->
|
||||
<span class=" {ICONNAME} "></span>
|
||||
|
||||
<!-- reference icon using div -->
|
||||
<div class=" {ICONNAME} "></div>
|
||||
|
||||
<!-- reference icon using custom tag -->
|
||||
<gg-icon class=" {ICONNAME} "></gg-icon>
|
||||
```
|
||||
|
||||
##### 5. Example
|
||||
|
||||
```html
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="UTF-8" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
||||
<title>Document</title>
|
||||
|
||||
<!-- You can add this link or any other CDN alternatives as mentioned above -->
|
||||
<link href="https://css.gg/css" rel="stylesheet" />
|
||||
</head>
|
||||
<body>
|
||||
<!-- Using i tag -->
|
||||
<i class="gg- {ICONNAME} "></i>
|
||||
|
||||
<!-- Using div tag -->
|
||||
<div class="gg- {ICONNAME} "></div>
|
||||
|
||||
<!-- Using custom tag -->
|
||||
<gg-icon class="gg- {ICONNAME} "></gg-icon>
|
||||
</body>
|
||||
</html>
|
||||
```
|
||||
|
||||
# CSS @import
|
||||
|
||||
#### 1. All icons
|
||||
|
||||
```css
|
||||
/* css.gg */
|
||||
@import url("https://css.gg/css");
|
||||
|
||||
/* UNPKG */
|
||||
@import url("https://unpkg.com/css.gg/icons/icons.css");
|
||||
|
||||
/* JSDelivr */
|
||||
@import url("https://cdn.jsdelivr.net/npm/css.gg/icons/icons.css");
|
||||
```
|
||||
|
||||
#### 2. Single icon
|
||||
|
||||
```css
|
||||
/* css.gg */
|
||||
@import url("https://css.gg/ {ICONNAME} .css");
|
||||
|
||||
/* UNPKG */
|
||||
@import url("https://unpkg.com/css.gg/icons/css/ {ICONNAME} .css");
|
||||
|
||||
/* JSDelivr */
|
||||
@import url("https://cdn.jsdelivr.net/npm/css.gg/icons/css/ {ICONNAME} .css");
|
||||
```
|
||||
|
||||
#### 3. Collection
|
||||
|
||||
```css
|
||||
/* css.gg */
|
||||
@import url("https://css.gg/css?= {ICONNAME} | {ICONNAME}");
|
||||
```
|
||||
|
||||
#### 4. Resizing
|
||||
|
||||
> To resize an icon you just need to change the value of a css variable "--ggs" to any value you like if not specified it falls back to 1 or the actual size.
|
||||
|
||||
```css
|
||||
.gg-{ICONNAME} {
|
||||
/* This value will multiple the actual size */
|
||||
--ggs: 10;
|
||||
}
|
||||
```
|
||||
|
||||
> The variable can be added to the parent, custom class,body or root level if you want all icons same size.
|
||||
|
||||
```css
|
||||
:root {
|
||||
--ggs: 6;
|
||||
}
|
||||
```
|
||||
|
||||
#### 5. Coloring
|
||||
|
||||
By default all the CSS, SCSS icons inherit the color from the parent by using `currentColor` attribute how ever you can apply any color you like.
|
||||
|
||||
```css
|
||||
.gg-{ICONNAME} {
|
||||
color: teal;
|
||||
}
|
||||
```
|
||||
|
||||
# SVG
|
||||
|
||||
#### 1. SVG Sprite - Download Path
|
||||
|
||||
You can't use these paths, you must download since SVG doesn't allow external sources.
|
||||
|
||||
```html
|
||||
<!-- css.gg -->
|
||||
https://css.gg/svg
|
||||
|
||||
<!-- UNPKG -->
|
||||
https://unpkg.com/css.gg/icons/icons.svg
|
||||
|
||||
<!-- JSDelivr -->
|
||||
https://cdn.jsdelivr.net/npm/css.gg/icons/icons.svg
|
||||
```
|
||||
|
||||
##### 1.1. Example
|
||||
|
||||
```html
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="UTF-8" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
||||
<title>Document</title>
|
||||
</head>
|
||||
<body>
|
||||
<!-- First copy all.svg to your project directory -->
|
||||
<svg><use xlink:href="path/to/icons.svg# {ICONNAME} " /></svg>
|
||||
</body>
|
||||
</html>
|
||||
```
|
||||
|
||||
#### 2. SVG Single Icon - Download Path
|
||||
|
||||
```html
|
||||
<!-- css.gg -->
|
||||
https://css.gg/ {ICONNAME} .svg
|
||||
|
||||
<!-- UNPKG -->
|
||||
https://unpkg.com/css.gg/icons/svg/ {ICONNAME} .svg
|
||||
|
||||
<!-- JSDelivr -->
|
||||
https://cdn.jsdelivr.net/npm/css.gg/icons/svg/ {ICONNAME} .svg
|
||||
```
|
||||
|
||||
##### 2.1. Example - SVG Sprite
|
||||
|
||||
```html
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="UTF-8" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
||||
<title>Document</title>
|
||||
</head>
|
||||
<body>
|
||||
<!-- First copy all.svg to your project directory -->
|
||||
<svg><use xlink:href="path/to/icons.svg# {ICONNAME} " /></svg>
|
||||
</body>
|
||||
</html>
|
||||
```
|
||||
|
||||
##### 2.2. Example - Inline SVG Sprite/Symbol
|
||||
|
||||
You can add as symbol each or copy the entire file contents at one of the CDN alternatives as mentioned at 2.1
|
||||
|
||||
```html
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="UTF-8" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
||||
<title>Document</title>
|
||||
</head>
|
||||
<body>
|
||||
<svg xmlns="http://www.w3.org/2000/svg" style="display: none;">
|
||||
<symbol id="{ICONNAME}">
|
||||
<!-- here goes the icon path -->
|
||||
</symbol>
|
||||
</svg>
|
||||
|
||||
<!-- Afterward you can call the icons by id like this: -->
|
||||
<svg><use xlink:href="# {ICONNAME} " /></svg>
|
||||
</body>
|
||||
</html>
|
||||
```
|
||||
|
||||
#### 2.3. Example Single copy/paste icon
|
||||
|
||||
You can go to `https://css.gg/{ICONNAME}` and copy the SVG icon directy and paste it on your project. \
|
||||
You can also download a single icon by just visiting `https://css.gg/{ICONNAME}.svg`
|
||||
|
||||
```html
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="UTF-8" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
||||
<title>Document</title>
|
||||
</head>
|
||||
<body>
|
||||
<!-- Just paste it where you want the icon to be -->
|
||||
<svg
|
||||
width="24"
|
||||
height="24"
|
||||
viewBox="0 0 24 24"
|
||||
fill="none"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
>
|
||||
<path d="M9 13H15V17H9V13Z" fill="currentColor" fill-opacity="0.5" />
|
||||
<path d="M6 7H18V11H6V7Z" fill="currentColor" />
|
||||
</svg>
|
||||
</body>
|
||||
</html>
|
||||
```
|
||||
|
||||
#### 3. Encode SVG for CSS
|
||||
|
||||
You need to define width and height in order for this to work.
|
||||
Afterwards you can just create a div
|
||||
|
||||
```css
|
||||
.gg-{ICONNAME} {
|
||||
|
||||
background-image:
|
||||
url("data:image/svg+xml,<svg></svg>");
|
||||
|
||||
}
|
||||
```
|
||||
|
||||
> To encode use this tool \
|
||||
> https://yoksel.github.io/url-encoder/
|
||||
|
||||
#### 3.1. Example - Encoded SVG for CSS icon
|
||||
|
||||
```html
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="UTF-8" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
||||
<title>Document</title>
|
||||
</head>
|
||||
<body>
|
||||
<!-- Using i tag -->
|
||||
<i class="gg- {ICONNAME} "></i>
|
||||
|
||||
<!-- Using div tag -->
|
||||
<div class="gg- {ICONNAME} "></div>
|
||||
|
||||
<!-- Using custom tag -->
|
||||
<gg-icon class="gg- {ICONNAME} "></gg-icon>
|
||||
</body>
|
||||
</html>
|
||||
```
|
||||
|
||||
#### 4. Coloring a SVG icon
|
||||
|
||||
By default all colors use `currentColor` as value in order to inherit the color from the parent. \
|
||||
If you wish to change that color you can do the following.
|
||||
|
||||
#### 4.1. Directly on the icon
|
||||
|
||||
```html
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="UTF-8" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
||||
<title>Document</title>
|
||||
</head>
|
||||
<body>
|
||||
<svg><path fill=" {COLOR} " /></svg>
|
||||
</body>
|
||||
</html>
|
||||
```
|
||||
|
||||
#### 4.2. using class
|
||||
|
||||
```html
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="UTF-8" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
||||
<title>Document</title>
|
||||
|
||||
<style>
|
||||
/* 1. You define the CSS class like this: */
|
||||
|
||||
.custom__color path {
|
||||
color: teal;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<!-- 2. After that you have to apply the class to the icon -->
|
||||
<svg class="custom__color"><path /></svg>
|
||||
</body>
|
||||
</html>
|
||||
```
|
||||
|
||||
# JSON - paths
|
||||
|
||||
#### 1. All icons
|
||||
|
||||
```html
|
||||
<!-- All attributes -->
|
||||
https://css.gg/json
|
||||
|
||||
<!-- Only Style -->
|
||||
https://css.gg/json?=&op=css
|
||||
|
||||
<!-- Style & Markup -->
|
||||
https://css.gg/json?=&op=css+markup
|
||||
|
||||
<!-- UNPKG -->
|
||||
https://unpkg.com/css.gg/icons/icons.json
|
||||
|
||||
<!-- JSDelivr -->
|
||||
https://cdn.jsdelivr.net/npm/css.gg/icons/icons.json
|
||||
```
|
||||
|
||||
#### 2. Single icon
|
||||
|
||||
```html
|
||||
<!-- All attributes -->
|
||||
https://css.gg/json?= {ICONNAME}
|
||||
|
||||
<!-- Only Style -->
|
||||
https://css.gg/json?= {ICONNAME} &op=css
|
||||
|
||||
<!-- Style & Markup -->
|
||||
https://css.gg/json?= {ICONNAME} &op=css+markup
|
||||
|
||||
<!-- No CDN Alternatives -->
|
||||
```
|
||||
|
||||
#### 3. Collection
|
||||
|
||||
```html
|
||||
<!-- All attributes -->
|
||||
https://css.gg/json?= {ICONNAME} | {ICONNAME}
|
||||
|
||||
<!-- Only Style -->
|
||||
https://css.gg/json?= {ICONNAME} | {ICONNAME} &op=css
|
||||
|
||||
<!-- Style & Markup -->
|
||||
https://css.gg/json?= {ICONNAME} | {ICONNAME} &op=css+markup
|
||||
|
||||
<!-- No CDN Alternatives -->
|
||||
```
|
||||
|
||||
# XML - paths
|
||||
|
||||
#### 1. All icons
|
||||
|
||||
```html
|
||||
<!-- All attributes -->
|
||||
https://css.gg/xml
|
||||
|
||||
<!-- Only Style -->
|
||||
https://css.gg/xml?=&op=css
|
||||
|
||||
<!-- Style & Markup -->
|
||||
https://css.gg/xml?=&op=css+markup
|
||||
|
||||
<!-- UNPKG -->
|
||||
https://unpkg.com/css.gg/icons/icons.xml
|
||||
|
||||
<!-- JSDelivr -->
|
||||
https://cdn.jsdelivr.net/npm/css.gg/icons/icons.xml
|
||||
```
|
||||
|
||||
#### 2. Single icon
|
||||
|
||||
```html
|
||||
<!-- All attributes -->
|
||||
https://css.gg/xml?= {ICONNAME}
|
||||
|
||||
<!-- Only Style -->
|
||||
https://css.gg/xml?= {ICONNAME} &op=css
|
||||
|
||||
<!-- Style & Markup -->
|
||||
https://css.gg/xml?= {ICONNAME} &op=css+markup
|
||||
|
||||
<!-- No CDN Alternatives -->
|
||||
```
|
||||
|
||||
#### 3. Collection
|
||||
|
||||
```html
|
||||
<!-- All attributes -->
|
||||
https://css.gg/xml?= {ICONNAME} | {ICONNAME}
|
||||
|
||||
<!-- Only Style -->
|
||||
https://css.gg/xml?= {ICONNAME} | {ICONNAME} &op=css
|
||||
|
||||
<!-- Style & Markup -->
|
||||
https://css.gg/xml?= {ICONNAME} | {ICONNAME} &op=css+markup
|
||||
|
||||
<!-- No CDN Alternatives -->
|
||||
```
|
||||
|
||||
# React
|
||||
|
||||
On a React project you can include a single icon as CSS, Styled Component, SCSS, SVG or call the contents using .json or .xml files.
|
||||
\
|
||||
Note that only `styled-components` icons can be called directly such as:
|
||||
|
||||
```js
|
||||
import { ICONNAME } from "css.gg";
|
||||
```
|
||||
|
||||
#### 1. Styled Components 💅
|
||||
|
||||
After you install the package by using `npm i css.gg` or `yarn add css.gg` you can add a single icon like this:
|
||||
|
||||
```js
|
||||
import React from "react";
|
||||
import { ICONNAME } from "css.gg";
|
||||
|
||||
export default function () {
|
||||
return (
|
||||
<div>
|
||||
<ICONNAME />
|
||||
</div>
|
||||
);
|
||||
}
|
||||
```
|
||||
|
||||
#### 2. Local Single Icon as `styled-component`
|
||||
|
||||
If you need to download a single `typescript` or `styled-componment` format icon without downloading the entire package just visit the link like this:
|
||||
|
||||
```html
|
||||
https://css.gg/{ICONNAME}.tsx
|
||||
```
|
||||
|
||||
#### 2.1. Copy directly from the page
|
||||
|
||||
If you don't want to download at all but just copy paste visit the icon page and you have a special tab for it.
|
||||
|
||||
```html
|
||||
https://css.gg/{ICONNAME}
|
||||
```
|
||||
|
||||
#### 2.2. Local Component Example
|
||||
|
||||
```js
|
||||
import React from "react";
|
||||
|
||||
// local path
|
||||
import { ICONNAME } from "./ {ICONNAME} ";
|
||||
|
||||
function App() {
|
||||
return (
|
||||
<div>
|
||||
<ICONNAME />
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
export default App;
|
||||
```
|
||||
|
||||
#### 3. SVG Sprite method
|
||||
|
||||
```js
|
||||
import React from "react";
|
||||
|
||||
// Import function from package
|
||||
import { SVG } from "css.gg";
|
||||
|
||||
function App() {
|
||||
return (
|
||||
<div>
|
||||
<svg width="24" height="24">
|
||||
<use xlinkHref={SVG + "#gg-ICONNAME"} />
|
||||
</svg>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
export default App;
|
||||
```
|
||||
|
||||
#### 4. All CSS icons
|
||||
|
||||
```js
|
||||
import React from 'react';
|
||||
|
||||
// Import function from package
|
||||
import { CSS } from 'css.gg'
|
||||
|
||||
function App() {
|
||||
return (
|
||||
<div>
|
||||
|
||||
<!-- Using i tag -->
|
||||
<i className="gg- {ICONNAME} "></i>
|
||||
|
||||
<!-- Using div tag -->
|
||||
<div className="gg- {ICONNAME} "></div>
|
||||
|
||||
<!-- Using custom tag -->
|
||||
<gg-icon className="gg- {ICONNAME} "></gg-icon>
|
||||
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
export default App;
|
||||
```
|
||||
|
||||
#### 4.1. Single CSS icon
|
||||
|
||||
```js
|
||||
import React from 'react';
|
||||
|
||||
// Import path from package
|
||||
import 'css.gg/icons/css/ {ICONNAME} .css'
|
||||
|
||||
function App() {
|
||||
return (
|
||||
<div>
|
||||
|
||||
<!-- Using i tag -->
|
||||
<i className="gg- {ICONNAME} "></i>
|
||||
|
||||
<!-- Using div tag -->
|
||||
<div className="gg- {ICONNAME} "></div>
|
||||
|
||||
<!-- Using custom tag -->
|
||||
<gg-icon className="gg- {ICONNAME} "></gg-icon>
|
||||
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
export default App;
|
||||
```
|
||||
|
||||
#### 5. All SCSS icons
|
||||
|
||||
SCSS format to work you need to have `node-sass` installed `npm i node-sass`
|
||||
|
||||
```js
|
||||
import React from 'react';
|
||||
|
||||
// Import function from package
|
||||
import { SCSS } from 'css.gg'
|
||||
|
||||
function App() {
|
||||
return (
|
||||
<div>
|
||||
|
||||
<!-- Using i tag -->
|
||||
<i className="gg- {ICONNAME} "></i>
|
||||
|
||||
<!-- Using div tag -->
|
||||
<div className="gg- {ICONNAME} "></div>
|
||||
|
||||
<!-- Using custom tag -->
|
||||
<gg-icon className="gg- {ICONNAME} "></gg-icon>
|
||||
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
export default App;
|
||||
```
|
||||
|
||||
#### 5.1. Single SCSS icon
|
||||
|
||||
SCSS format to work you need to have `node-sass` installed `npm i node-sass`
|
||||
|
||||
```js
|
||||
import React from 'react';
|
||||
|
||||
// Import path from package
|
||||
import 'css.gg/icons/scss/ {ICONNAME} .scss'
|
||||
|
||||
function App() {
|
||||
return (
|
||||
<div>
|
||||
|
||||
<!-- Using i tag -->
|
||||
<i className="gg- {ICONNAME} "></i>
|
||||
|
||||
<!-- Using div tag -->
|
||||
<div className="gg- {ICONNAME} "></div>
|
||||
|
||||
<!-- Using custom tag -->
|
||||
<gg-icon className="gg- {ICONNAME} "></gg-icon>
|
||||
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
export default App;
|
||||
```
|
||||
|
||||
#### 6. Combined import SVG, CSS, SCSS etc.
|
||||
|
||||
```js
|
||||
import { SVG, CSS, SCSS, ICONNAME, ICONNAME } from "css.gg";
|
||||
```
|
||||
|
||||
# Design Tools
|
||||
|
||||
#### 1. Figma - https://css.gg/fig
|
||||
|
||||
All icons are available as components on assets from where you can search for a sigle icon or browse categories.
|
||||
|
||||
|
||||
#### 2. Adobe XD - https://css.gg/xd
|
||||
|
||||
All icons are available as components \
|
||||
|
||||
|
||||
# Contributors
|
||||
|
||||
1. [Astrit](https://github.com/astrit) - Author
|
||||
2. [JiangWeixian](https://github.com/jiangWeixian) - Styled Components
|
||||
3. [Lona](https://www.figma.com/@lona) - Figma/SVG Design
|
||||
|
||||
To become a contributor do a [new pull request](https://github.com/astrit/css.gg/pulls).
|
||||
|
||||
# Support
|
||||
|
||||
Discord - https://github.com/astrit/css.gg/discussions
|
||||
|
||||
# v.1.0.6 or older
|
||||
|
||||
In order to access older versions you can use one of the provided CDN Alternatives
|
||||
|
||||
```html
|
||||
<!-- UNPKG - v.1.0.6 -->
|
||||
https://unpkg.com/browse/css.gg@1.0.6/
|
||||
|
||||
<!-- JSDelivr - v.1.0.6 -->
|
||||
https://cdn.jsdelivr.net/npm/css.gg@1.0.6/
|
||||
```
|
||||
|
||||
# Contribute
|
||||
|
||||
If you would like to contribute feel free to do a [new pull request](https://github.com/astrit/css.gg/pulls).
|
||||
|
||||
# Activity
|
||||
|
||||
<img src="https://repobeats.axiom.co/api/embed/ad02742f5d2c375b5f15f6f3bb07489f774c1b52.svg" style="width:100%" />
|
||||
### [Github Sponsor — github.com/sponsors/astrit](https://github.com/sponsors/astrit)
|
||||
|
|
|
|||
|
|
@ -1,23 +0,0 @@
|
|||
.gg-abstract {
|
||||
box-sizing: border-box;
|
||||
position: relative;
|
||||
display: block;
|
||||
width: 14px;
|
||||
height: 14px;
|
||||
transform: scale(var(--ggs,1));
|
||||
border-right: 3px solid;
|
||||
border-top: 3px solid
|
||||
}
|
||||
|
||||
.gg-abstract::before {
|
||||
content: "";
|
||||
display: block;
|
||||
box-sizing: border-box;
|
||||
position: absolute;
|
||||
width: 10px;
|
||||
height: 10px;
|
||||
left: 0;
|
||||
bottom: 0;
|
||||
border: 3px solid;
|
||||
border-radius: 12px
|
||||
}
|
||||
|
|
@ -1,31 +0,0 @@
|
|||
.gg-add-r {
|
||||
box-sizing: border-box;
|
||||
position: relative;
|
||||
display: block;
|
||||
width: 22px;
|
||||
height: 22px;
|
||||
border: 2px solid;
|
||||
transform: scale(var(--ggs,1));
|
||||
border-radius: 4px
|
||||
}
|
||||
|
||||
.gg-add-r::after,
|
||||
.gg-add-r::before {
|
||||
content: "";
|
||||
display: block;
|
||||
box-sizing: border-box;
|
||||
position: absolute;
|
||||
width: 10px;
|
||||
height: 2px;
|
||||
background: currentColor;
|
||||
border-radius: 5px;
|
||||
top: 8px;
|
||||
left: 4px
|
||||
}
|
||||
|
||||
.gg-add-r::after {
|
||||
width: 2px;
|
||||
height: 10px;
|
||||
top: 4px;
|
||||
left: 8px
|
||||
}
|
||||
|
|
@ -1,31 +0,0 @@
|
|||
.gg-add {
|
||||
box-sizing: border-box;
|
||||
position: relative;
|
||||
display: block;
|
||||
width: 22px;
|
||||
height: 22px;
|
||||
border: 2px solid;
|
||||
transform: scale(var(--ggs,1));
|
||||
border-radius: 22px
|
||||
}
|
||||
|
||||
.gg-add::after,
|
||||
.gg-add::before {
|
||||
content: "";
|
||||
display: block;
|
||||
box-sizing: border-box;
|
||||
position: absolute;
|
||||
width: 10px;
|
||||
height: 2px;
|
||||
background: currentColor;
|
||||
border-radius: 5px;
|
||||
top: 8px;
|
||||
left: 4px
|
||||
}
|
||||
|
||||
.gg-add::after {
|
||||
width: 2px;
|
||||
height: 10px;
|
||||
top: 4px;
|
||||
left: 8px
|
||||
}
|
||||
|
|
@ -1,23 +0,0 @@
|
|||
.gg-adidas {
|
||||
position: relative;
|
||||
box-sizing: border-box;
|
||||
display: block;
|
||||
width: 23px;
|
||||
height: 15px;
|
||||
transform: scale(var(--ggs,1));
|
||||
overflow: hidden
|
||||
}
|
||||
|
||||
.gg-adidas::before {
|
||||
content: "";
|
||||
position: absolute;
|
||||
box-sizing: border-box;
|
||||
display: block;
|
||||
width: 5px;
|
||||
height: 18px;
|
||||
background: currentColor;
|
||||
transform: rotate(-30deg);
|
||||
left: 4px;
|
||||
bottom: -14px;
|
||||
box-shadow: 7px -2px,14px -4px
|
||||
}
|
||||
|
|
@ -1,50 +0,0 @@
|
|||
.gg-airplane {
|
||||
box-sizing: border-box;
|
||||
position: relative;
|
||||
display: block;
|
||||
width: 18px;
|
||||
height: 18px;
|
||||
transform: scale(var(--ggs,1));
|
||||
background:
|
||||
linear-gradient(
|
||||
to left,
|
||||
currentColor 22px,
|
||||
transparent 0
|
||||
) no-repeat center/16px 2px,
|
||||
radial-gradient(
|
||||
circle,
|
||||
currentColor 60%,
|
||||
transparent 40%
|
||||
) no-repeat right center/2px 2px
|
||||
}
|
||||
|
||||
.gg-airplane::after,
|
||||
.gg-airplane::before {
|
||||
content: "";
|
||||
display: block;
|
||||
position: absolute;
|
||||
box-sizing: border-box;
|
||||
width: 10px;
|
||||
height: 8px;
|
||||
border-right: 4px solid
|
||||
}
|
||||
|
||||
.gg-airplane::before {
|
||||
border-top-right-radius: 2px;
|
||||
top: 0;
|
||||
transform:
|
||||
perspective(10px)
|
||||
rotateX(10deg)
|
||||
skewX(30deg);
|
||||
box-shadow: -4px 3px 0 -2px
|
||||
}
|
||||
|
||||
.gg-airplane::after {
|
||||
border-bottom-right-radius: 2px;
|
||||
bottom: 0;
|
||||
transform:
|
||||
perspective(10px)
|
||||
rotateX(-10deg)
|
||||
skewX(-30deg);
|
||||
box-shadow: -4px -3px 0 -2px
|
||||
}
|
||||
|
|
@ -1,40 +0,0 @@
|
|||
.gg-alarm {
|
||||
background:
|
||||
linear-gradient( to left,
|
||||
currentColor 5px, transparent 0)
|
||||
no-repeat 4.5px 6px/5px 2px,
|
||||
linear-gradient( to left,
|
||||
currentColor 7px, transparent 0)
|
||||
no-repeat 4.5px 2px/2px 6px;
|
||||
box-sizing: border-box;
|
||||
position: relative;
|
||||
display: block;
|
||||
width: 16px;
|
||||
height: 16px;
|
||||
border-radius: 100%;
|
||||
border: 2px solid transparent;
|
||||
transform: scale(var(--ggs,1));
|
||||
box-shadow: 0 0 0 2px
|
||||
}
|
||||
|
||||
.gg-alarm::after,
|
||||
.gg-alarm::before {
|
||||
content: "";
|
||||
display: block;
|
||||
box-sizing: border-box;
|
||||
position: absolute;
|
||||
width: 6px;
|
||||
height: 2px;
|
||||
background: currentColor;
|
||||
top: -4px
|
||||
}
|
||||
|
||||
.gg-alarm::before {
|
||||
left: -5px;
|
||||
transform: rotate(-42deg)
|
||||
}
|
||||
|
||||
.gg-alarm::after {
|
||||
transform: rotate(42deg);
|
||||
right: -5px
|
||||
}
|
||||
|
|
@ -1,34 +0,0 @@
|
|||
.gg-album {
|
||||
box-sizing: border-box;
|
||||
position: relative;
|
||||
display: block;
|
||||
width: 18px;
|
||||
height: 18px;
|
||||
transform: scale(var(--ggs,1));
|
||||
border-left: 7px solid transparent;
|
||||
border-right: 3px solid transparent;
|
||||
border-bottom: 8px solid transparent;
|
||||
box-shadow: 0 0 0 2px,
|
||||
inset 6px 4px 0 -4px,
|
||||
inset -6px 4px 0 -4px;
|
||||
border-radius: 3px
|
||||
}
|
||||
|
||||
.gg-album::after,
|
||||
.gg-album::before {
|
||||
content: "";
|
||||
display: block;
|
||||
box-sizing: border-box;
|
||||
position: absolute;
|
||||
width: 2px;
|
||||
height: 5px;
|
||||
background: currentColor;
|
||||
transform: rotate(46deg);
|
||||
top: 5px;
|
||||
right: 4px
|
||||
}
|
||||
|
||||
.gg-album::after {
|
||||
transform: rotate(-46deg);
|
||||
right: 2px
|
||||
}
|
||||
|
|
@ -1,32 +0,0 @@
|
|||
.gg-align-bottom {
|
||||
box-sizing: border-box;
|
||||
position: relative;
|
||||
display: block;
|
||||
height: 12px;
|
||||
width: 12px;
|
||||
border-bottom: 2px solid;
|
||||
transform: scale(var(--ggs,1));
|
||||
margin-top: 4px
|
||||
}
|
||||
|
||||
.gg-align-bottom::after,
|
||||
.gg-align-bottom::before {
|
||||
content: "";
|
||||
display: block;
|
||||
box-sizing: border-box;
|
||||
position: absolute;
|
||||
width: 4px;
|
||||
background: currentColor;
|
||||
bottom: 2px
|
||||
}
|
||||
|
||||
.gg-align-bottom::before {
|
||||
left: 1px;
|
||||
height: 12px
|
||||
}
|
||||
|
||||
.gg-align-bottom::after {
|
||||
height: 6px;
|
||||
right: 1px;
|
||||
opacity: .5
|
||||
}
|
||||
|
|
@ -1,33 +0,0 @@
|
|||
.gg-align-center {
|
||||
box-sizing: border-box;
|
||||
position: relative;
|
||||
display: block;
|
||||
height: 12px;
|
||||
width: 12px;
|
||||
border-top: 2px solid transparent;
|
||||
transform: scale(var(--ggs,1));
|
||||
margin-left: -4px
|
||||
}
|
||||
|
||||
.gg-align-center::after,
|
||||
.gg-align-center::before {
|
||||
content: "";
|
||||
display: block;
|
||||
box-sizing: border-box;
|
||||
position: absolute;
|
||||
height: 4px;
|
||||
background: currentColor
|
||||
}
|
||||
|
||||
.gg-align-center::before {
|
||||
left: 2px;
|
||||
width: 12px;
|
||||
top: -2px
|
||||
}
|
||||
|
||||
.gg-align-center::after {
|
||||
width: 6px;
|
||||
right: 1px;
|
||||
top: 4px;
|
||||
opacity: .5
|
||||
}
|
||||
|
|
@ -1,29 +0,0 @@
|
|||
.gg-align-left {
|
||||
box-sizing: border-box;
|
||||
position: relative;
|
||||
display: block;
|
||||
height: 12px;
|
||||
width: 12px;
|
||||
border-left: 2px solid;
|
||||
transform: scale(var(--ggs,1));
|
||||
margin-left: -4px
|
||||
}
|
||||
|
||||
.gg-align-left::after,
|
||||
.gg-align-left::before {
|
||||
content: "";
|
||||
display: block;
|
||||
box-sizing: border-box;
|
||||
position: absolute;
|
||||
height: 4px;
|
||||
width: 12px;
|
||||
background: currentColor;
|
||||
left: 2px;
|
||||
top: 1px
|
||||
}
|
||||
|
||||
.gg-align-left::after {
|
||||
width: 6px;
|
||||
top: 7px;
|
||||
opacity: .5
|
||||
}
|
||||
|
|
@ -1,33 +0,0 @@
|
|||
.gg-align-middle {
|
||||
box-sizing: border-box;
|
||||
position: relative;
|
||||
display: block;
|
||||
height: 12px;
|
||||
width: 12px;
|
||||
transform: scale(var(--ggs,1));
|
||||
border-top: 2px solid transparent;
|
||||
margin-top: -8px
|
||||
}
|
||||
|
||||
.gg-align-middle::after,
|
||||
.gg-align-middle::before {
|
||||
content: "";
|
||||
display: block;
|
||||
box-sizing: border-box;
|
||||
position: absolute;
|
||||
width: 4px;
|
||||
background: currentColor
|
||||
}
|
||||
|
||||
.gg-align-middle::before {
|
||||
left: 1px;
|
||||
height: 12px;
|
||||
top: 2px
|
||||
}
|
||||
|
||||
.gg-align-middle::after {
|
||||
height: 6px;
|
||||
right: 1px;
|
||||
top: 5px;
|
||||
opacity: .5
|
||||
}
|
||||
|
|
@ -1,29 +0,0 @@
|
|||
.gg-align-right {
|
||||
box-sizing: border-box;
|
||||
position: relative;
|
||||
display: block;
|
||||
height: 12px;
|
||||
width: 12px;
|
||||
border-right: 2px solid;
|
||||
transform: scale(var(--ggs,1));
|
||||
margin-right: -4px
|
||||
}
|
||||
|
||||
.gg-align-right::after,
|
||||
.gg-align-right::before {
|
||||
content: "";
|
||||
display: block;
|
||||
box-sizing: border-box;
|
||||
position: absolute;
|
||||
height: 4px;
|
||||
width: 12px;
|
||||
background: currentColor;
|
||||
right: 2px;
|
||||
top: 1px
|
||||
}
|
||||
|
||||
.gg-align-right::after {
|
||||
width: 6px;
|
||||
top: 7px;
|
||||
opacity: .5
|
||||
}
|
||||
|
|
@ -1,32 +0,0 @@
|
|||
.gg-align-top {
|
||||
box-sizing: border-box;
|
||||
position: relative;
|
||||
display: block;
|
||||
height: 12px;
|
||||
width: 12px;
|
||||
border-top: 2px solid;
|
||||
transform: scale(var(--ggs,1));
|
||||
margin-top: -4px
|
||||
}
|
||||
|
||||
.gg-align-top::after,
|
||||
.gg-align-top::before {
|
||||
content: "";
|
||||
display: block;
|
||||
box-sizing: border-box;
|
||||
position: absolute;
|
||||
width: 4px;
|
||||
background: currentColor;
|
||||
top: 2px
|
||||
}
|
||||
|
||||
.gg-align-top::before {
|
||||
left: 1px;
|
||||
height: 12px
|
||||
}
|
||||
|
||||
.gg-align-top::after {
|
||||
height: 6px;
|
||||
right: 1px;
|
||||
opacity: .5
|
||||
}
|
||||
|
|
@ -1,36 +0,0 @@
|
|||
.gg-anchor {
|
||||
box-sizing: border-box;
|
||||
position: relative;
|
||||
display: block;
|
||||
transform: scale(var(--ggs,1));
|
||||
width: 2px;
|
||||
height: 14px;
|
||||
background: currentColor;
|
||||
border-radius: 8px
|
||||
}
|
||||
|
||||
.gg-anchor::after,
|
||||
.gg-anchor::before {
|
||||
content: "";
|
||||
display: block;
|
||||
box-sizing: border-box;
|
||||
position: absolute;
|
||||
height: 6px;
|
||||
border: 2px solid
|
||||
}
|
||||
|
||||
.gg-anchor::after {
|
||||
width: 12px;
|
||||
border-bottom-left-radius: 20px;
|
||||
border-bottom-right-radius: 20px;
|
||||
border-top-color: transparent;
|
||||
left: -5px;
|
||||
bottom: 2px
|
||||
}
|
||||
|
||||
.gg-anchor::before {
|
||||
width: 6px;
|
||||
border-radius: 8px;
|
||||
top: -4px;
|
||||
left: -2px
|
||||
}
|
||||
|
|
@ -1,40 +0,0 @@
|
|||
.gg-apple-watch {
|
||||
background:
|
||||
linear-gradient( to left,
|
||||
currentColor 5px,transparent 0)
|
||||
no-repeat 13px 4px/2px 4px;
|
||||
box-sizing: border-box;
|
||||
position: relative;
|
||||
display: block;
|
||||
width: 24px;
|
||||
height: 24px;
|
||||
border: 5px solid transparent;
|
||||
transform: scale(var(--ggs,1));
|
||||
border-radius: 9px;
|
||||
box-shadow: inset 0 0 0 2px
|
||||
}
|
||||
|
||||
.gg-apple-watch::after,
|
||||
.gg-apple-watch::before {
|
||||
content: "";
|
||||
display: block;
|
||||
box-sizing: border-box;
|
||||
position: absolute;
|
||||
border-radius: 3px;
|
||||
width: 10px;
|
||||
height: 5px;
|
||||
border: 2px solid;
|
||||
border-bottom: 0;
|
||||
border-bottom-left-radius: 0;
|
||||
border-bottom-right-radius: 0;
|
||||
left: 2px
|
||||
}
|
||||
|
||||
.gg-apple-watch::after {
|
||||
top: -3px
|
||||
}
|
||||
|
||||
.gg-apple-watch::before {
|
||||
transform: scaleY(-1);
|
||||
top: 12px
|
||||
}
|
||||
|
|
@ -1,31 +0,0 @@
|
|||
.gg-arrange-back {
|
||||
box-sizing: border-box;
|
||||
position: relative;
|
||||
transform: scale(var(--ggs,1));
|
||||
display: block;
|
||||
width: 18px;
|
||||
height: 18px
|
||||
}
|
||||
|
||||
.gg-arrange-back::after,
|
||||
.gg-arrange-back::before {
|
||||
content: "";
|
||||
display: block;
|
||||
box-sizing: border-box;
|
||||
position: absolute
|
||||
}
|
||||
|
||||
.gg-arrange-back::after {
|
||||
width: 10px;
|
||||
height: 10px;
|
||||
border: 2px solid;
|
||||
left: 4px;
|
||||
top: 4px
|
||||
}
|
||||
|
||||
.gg-arrange-back::before {
|
||||
width: 8px;
|
||||
height: 8px;
|
||||
background: currentColor;
|
||||
box-shadow: 10px 10px 0
|
||||
}
|
||||
|
|
@ -1,23 +0,0 @@
|
|||
.gg-arrange-front {
|
||||
box-sizing: border-box;
|
||||
position: relative;
|
||||
transform: scale(var(--ggs,1));
|
||||
display: block;
|
||||
width: 18px;
|
||||
height: 18px
|
||||
}
|
||||
|
||||
.gg-arrange-front::before {
|
||||
content: "";
|
||||
display: block;
|
||||
box-sizing: border-box;
|
||||
position: absolute;
|
||||
width: 10px;
|
||||
height: 10px;
|
||||
border: 2px solid;
|
||||
left: 4px;
|
||||
top: 4px;
|
||||
box-shadow:
|
||||
-5px -5px 0 -1px,
|
||||
5px 5px 0 -1px
|
||||
}
|
||||
|
|
@ -1,45 +0,0 @@
|
|||
.gg-arrow-align-h {
|
||||
box-sizing: border-box;
|
||||
position: relative;
|
||||
display: block;
|
||||
transform: scale(var(--ggs,1));
|
||||
width: 20px;
|
||||
height: 10px;
|
||||
background:
|
||||
linear-gradient(
|
||||
to left,
|
||||
currentColor 15px,transparent 0)
|
||||
no-repeat 2px 4px/6px 2px,
|
||||
linear-gradient(
|
||||
to left,
|
||||
currentColor 15px,transparent 0)
|
||||
no-repeat 12px 4px/6px 2px,
|
||||
linear-gradient(
|
||||
to left,
|
||||
currentColor 15px,transparent 0)
|
||||
no-repeat center/2px 10px
|
||||
}
|
||||
|
||||
.gg-arrow-align-h::after,
|
||||
.gg-arrow-align-h::before {
|
||||
content: "";
|
||||
display: block;
|
||||
box-sizing: border-box;
|
||||
position: absolute;
|
||||
width: 6px;
|
||||
height: 6px;
|
||||
transform: rotate(45deg);
|
||||
top: 2px
|
||||
}
|
||||
|
||||
.gg-arrow-align-h::after {
|
||||
border-bottom: 2px solid;
|
||||
border-left: 2px solid;
|
||||
left: 1px
|
||||
}
|
||||
|
||||
.gg-arrow-align-h::before {
|
||||
border-top: 2px solid;
|
||||
border-right: 2px solid;
|
||||
right: 1px
|
||||
}
|
||||
|
|
@ -1,45 +0,0 @@
|
|||
.gg-arrow-align-v {
|
||||
box-sizing: border-box;
|
||||
position: relative;
|
||||
display: block;
|
||||
transform: scale(var(--ggs,1));
|
||||
width: 10px;
|
||||
height: 20px;
|
||||
background:
|
||||
linear-gradient(
|
||||
to left,
|
||||
currentColor 15px,transparent 0)
|
||||
no-repeat 4px 2px/2px 6px,
|
||||
linear-gradient(
|
||||
to left,
|
||||
currentColor 15px,transparent 0)
|
||||
no-repeat 4px 12px/2px 6px,
|
||||
linear-gradient(
|
||||
to left,
|
||||
currentColor 15px,transparent 0)
|
||||
no-repeat center/10px 2px
|
||||
}
|
||||
|
||||
.gg-arrow-align-v::after,
|
||||
.gg-arrow-align-v::before {
|
||||
content: "";
|
||||
display: block;
|
||||
box-sizing: border-box;
|
||||
position: absolute;
|
||||
width: 6px;
|
||||
height: 6px;
|
||||
transform: rotate(-45deg);
|
||||
left: 2px
|
||||
}
|
||||
|
||||
.gg-arrow-align-v::after {
|
||||
border-bottom: 2px solid;
|
||||
border-left: 2px solid;
|
||||
bottom: 1px
|
||||
}
|
||||
|
||||
.gg-arrow-align-v::before {
|
||||
border-top: 2px solid;
|
||||
border-right: 2px solid;
|
||||
top: 1px
|
||||
}
|
||||
|
|
@ -1,35 +0,0 @@
|
|||
.gg-arrow-bottom-left-o {
|
||||
box-sizing: border-box;
|
||||
position: relative;
|
||||
display: block;
|
||||
width: 22px;
|
||||
height: 22px;
|
||||
border: 2px solid;
|
||||
transform: scale(var(--ggs,1));
|
||||
border-radius: 20px
|
||||
}
|
||||
|
||||
.gg-arrow-bottom-left-o::after,
|
||||
.gg-arrow-bottom-left-o::before {
|
||||
content: "";
|
||||
display: block;
|
||||
box-sizing: border-box;
|
||||
position: absolute;
|
||||
left: 4px
|
||||
}
|
||||
|
||||
.gg-arrow-bottom-left-o::after {
|
||||
width: 10px;
|
||||
height: 2px;
|
||||
background: currentColor;
|
||||
transform: rotate(-45deg);
|
||||
bottom: 8px
|
||||
}
|
||||
|
||||
.gg-arrow-bottom-left-o::before {
|
||||
width: 6px;
|
||||
height: 6px;
|
||||
bottom: 4px;
|
||||
border-bottom: 2px solid;
|
||||
border-left: 2px solid
|
||||
}
|
||||
|
|
@ -1,35 +0,0 @@
|
|||
.gg-arrow-bottom-left-r {
|
||||
box-sizing: border-box;
|
||||
position: relative;
|
||||
display: block;
|
||||
width: 22px;
|
||||
height: 22px;
|
||||
border: 2px solid;
|
||||
transform: scale(var(--ggs,1));
|
||||
border-radius: 4px
|
||||
}
|
||||
|
||||
.gg-arrow-bottom-left-r::after,
|
||||
.gg-arrow-bottom-left-r::before {
|
||||
content: "";
|
||||
display: block;
|
||||
box-sizing: border-box;
|
||||
position: absolute;
|
||||
left: 4px
|
||||
}
|
||||
|
||||
.gg-arrow-bottom-left-r::after {
|
||||
width: 10px;
|
||||
height: 2px;
|
||||
background: currentColor;
|
||||
transform: rotate(-45deg);
|
||||
bottom: 8px
|
||||
}
|
||||
|
||||
.gg-arrow-bottom-left-r::before {
|
||||
width: 6px;
|
||||
height: 6px;
|
||||
bottom: 4px;
|
||||
border-bottom: 2px solid;
|
||||
border-left: 2px solid
|
||||
}
|
||||
|
|
@ -1,23 +0,0 @@
|
|||
.gg-arrow-bottom-left {
|
||||
box-sizing: border-box;
|
||||
position: relative;
|
||||
display: block;
|
||||
width: 8px;
|
||||
height: 8px;
|
||||
border-bottom: 2px solid;
|
||||
transform: scale(var(--ggs,1));
|
||||
border-left: 2px solid
|
||||
}
|
||||
|
||||
.gg-arrow-bottom-left::after {
|
||||
content: "";
|
||||
display: block;
|
||||
box-sizing: border-box;
|
||||
position: absolute;
|
||||
width: 14px;
|
||||
height: 2px;
|
||||
background: currentColor;
|
||||
transform: rotate(-45deg);
|
||||
bottom: 3px;
|
||||
left: -3px
|
||||
}
|
||||
|
|
@ -1,35 +0,0 @@
|
|||
.gg-arrow-bottom-right-o {
|
||||
box-sizing: border-box;
|
||||
position: relative;
|
||||
display: block;
|
||||
width: 22px;
|
||||
height: 22px;
|
||||
border: 2px solid;
|
||||
transform: scale(var(--ggs,1));
|
||||
border-radius: 20px
|
||||
}
|
||||
|
||||
.gg-arrow-bottom-right-o::after,
|
||||
.gg-arrow-bottom-right-o::before {
|
||||
content: "";
|
||||
display: block;
|
||||
box-sizing: border-box;
|
||||
position: absolute;
|
||||
right: 4px
|
||||
}
|
||||
|
||||
.gg-arrow-bottom-right-o::after {
|
||||
width: 10px;
|
||||
height: 2px;
|
||||
background: currentColor;
|
||||
transform: rotate(45deg);
|
||||
bottom: 8px
|
||||
}
|
||||
|
||||
.gg-arrow-bottom-right-o::before {
|
||||
width: 6px;
|
||||
height: 6px;
|
||||
bottom: 4px;
|
||||
border-bottom: 2px solid;
|
||||
border-right: 2px solid
|
||||
}
|
||||
|
|
@ -1,35 +0,0 @@
|
|||
.gg-arrow-bottom-right-r {
|
||||
box-sizing: border-box;
|
||||
position: relative;
|
||||
display: block;
|
||||
width: 22px;
|
||||
height: 22px;
|
||||
border: 2px solid;
|
||||
transform: scale(var(--ggs,1));
|
||||
border-radius: 4px
|
||||
}
|
||||
|
||||
.gg-arrow-bottom-right-r::after,
|
||||
.gg-arrow-bottom-right-r::before {
|
||||
content: "";
|
||||
display: block;
|
||||
box-sizing: border-box;
|
||||
position: absolute;
|
||||
right: 4px
|
||||
}
|
||||
|
||||
.gg-arrow-bottom-right-r::after {
|
||||
width: 10px;
|
||||
height: 2px;
|
||||
background: currentColor;
|
||||
transform: rotate(45deg);
|
||||
bottom: 8px
|
||||
}
|
||||
|
||||
.gg-arrow-bottom-right-r::before {
|
||||
width: 6px;
|
||||
height: 6px;
|
||||
bottom: 4px;
|
||||
border-bottom: 2px solid;
|
||||
border-right: 2px solid
|
||||
}
|
||||
|
|
@ -1,23 +0,0 @@
|
|||
.gg-arrow-bottom-right {
|
||||
box-sizing: border-box;
|
||||
position: relative;
|
||||
display: block;
|
||||
width: 8px;
|
||||
height: 8px;
|
||||
border-bottom: 2px solid;
|
||||
transform: scale(var(--ggs,1));
|
||||
border-right: 2px solid
|
||||
}
|
||||
|
||||
.gg-arrow-bottom-right::after {
|
||||
content: "";
|
||||
display: block;
|
||||
box-sizing: border-box;
|
||||
position: absolute;
|
||||
width: 14px;
|
||||
height: 2px;
|
||||
background: currentColor;
|
||||
transform: rotate(45deg);
|
||||
bottom: 3px;
|
||||
right: -3px
|
||||
}
|
||||
|
|
@ -1,35 +0,0 @@
|
|||
.gg-arrow-down-o {
|
||||
box-sizing: border-box;
|
||||
position: relative;
|
||||
display: block;
|
||||
width: 22px;
|
||||
height: 22px;
|
||||
border: 2px solid;
|
||||
transform: scale(var(--ggs,1));
|
||||
border-radius: 20px
|
||||
}
|
||||
|
||||
.gg-arrow-down-o::after,
|
||||
.gg-arrow-down-o::before {
|
||||
content: "";
|
||||
display: block;
|
||||
box-sizing: border-box;
|
||||
position: absolute;
|
||||
bottom: 4px
|
||||
}
|
||||
|
||||
.gg-arrow-down-o::after {
|
||||
width: 6px;
|
||||
height: 6px;
|
||||
border-bottom: 2px solid;
|
||||
border-left: 2px solid;
|
||||
transform: rotate(-45deg);
|
||||
left: 6px
|
||||
}
|
||||
|
||||
.gg-arrow-down-o::before {
|
||||
width: 2px;
|
||||
height: 10px;
|
||||
left: 8px;
|
||||
background: currentColor
|
||||
}
|
||||
|
|
@ -1,35 +0,0 @@
|
|||
.gg-arrow-down-r {
|
||||
box-sizing: border-box;
|
||||
position: relative;
|
||||
display: block;
|
||||
width: 22px;
|
||||
height: 22px;
|
||||
border: 2px solid;
|
||||
transform: scale(var(--ggs,1));
|
||||
border-radius: 4px
|
||||
}
|
||||
|
||||
.gg-arrow-down-r::after,
|
||||
.gg-arrow-down-r::before {
|
||||
content: "";
|
||||
display: block;
|
||||
box-sizing: border-box;
|
||||
position: absolute;
|
||||
bottom: 4px
|
||||
}
|
||||
|
||||
.gg-arrow-down-r::after {
|
||||
width: 6px;
|
||||
height: 6px;
|
||||
border-bottom: 2px solid;
|
||||
border-left: 2px solid;
|
||||
transform: rotate(-45deg);
|
||||
left: 6px
|
||||
}
|
||||
|
||||
.gg-arrow-down-r::before {
|
||||
width: 2px;
|
||||
height: 10px;
|
||||
left: 8px;
|
||||
background: currentColor
|
||||
}
|
||||
|
|
@ -1,33 +0,0 @@
|
|||
.gg-arrow-down {
|
||||
box-sizing: border-box;
|
||||
position: relative;
|
||||
display: block;
|
||||
transform: scale(var(--ggs,1));
|
||||
width: 22px;
|
||||
height: 22px
|
||||
}
|
||||
|
||||
.gg-arrow-down::after,
|
||||
.gg-arrow-down::before {
|
||||
content: "";
|
||||
display: block;
|
||||
box-sizing: border-box;
|
||||
position: absolute;
|
||||
bottom: 4px
|
||||
}
|
||||
|
||||
.gg-arrow-down::after {
|
||||
width: 8px;
|
||||
height: 8px;
|
||||
border-bottom: 2px solid;
|
||||
border-left: 2px solid;
|
||||
transform: rotate(-45deg);
|
||||
left: 7px
|
||||
}
|
||||
|
||||
.gg-arrow-down::before {
|
||||
width: 2px;
|
||||
height: 16px;
|
||||
left: 10px;
|
||||
background: currentColor
|
||||
}
|
||||
|
|
@ -1,35 +0,0 @@
|
|||
.gg-arrow-left-o {
|
||||
box-sizing: border-box;
|
||||
position: relative;
|
||||
display: block;
|
||||
width: 22px;
|
||||
height: 22px;
|
||||
border: 2px solid;
|
||||
transform: scale(var(--ggs,1));
|
||||
border-radius: 22px
|
||||
}
|
||||
|
||||
.gg-arrow-left-o::after,
|
||||
.gg-arrow-left-o::before {
|
||||
content: "";
|
||||
display: block;
|
||||
box-sizing: border-box;
|
||||
position: absolute;
|
||||
left: 4px
|
||||
}
|
||||
|
||||
.gg-arrow-left-o::after {
|
||||
width: 6px;
|
||||
height: 6px;
|
||||
border-bottom: 2px solid;
|
||||
border-left: 2px solid;
|
||||
transform: rotate(45deg);
|
||||
bottom: 6px
|
||||
}
|
||||
|
||||
.gg-arrow-left-o::before {
|
||||
width: 10px;
|
||||
height: 2px;
|
||||
bottom: 8px;
|
||||
background: currentColor
|
||||
}
|
||||
|
|
@ -1,35 +0,0 @@
|
|||
.gg-arrow-left-r {
|
||||
box-sizing: border-box;
|
||||
position: relative;
|
||||
display: block;
|
||||
width: 22px;
|
||||
height: 22px;
|
||||
border: 2px solid;
|
||||
transform: scale(var(--ggs,1));
|
||||
border-radius: 4px
|
||||
}
|
||||
|
||||
.gg-arrow-left-r::after,
|
||||
.gg-arrow-left-r::before {
|
||||
content: "";
|
||||
display: block;
|
||||
box-sizing: border-box;
|
||||
position: absolute;
|
||||
left: 4px
|
||||
}
|
||||
|
||||
.gg-arrow-left-r::after {
|
||||
width: 6px;
|
||||
height: 6px;
|
||||
border-bottom: 2px solid;
|
||||
border-left: 2px solid;
|
||||
transform: rotate(45deg);
|
||||
bottom: 6px
|
||||
}
|
||||
|
||||
.gg-arrow-left-r::before {
|
||||
width: 10px;
|
||||
height: 2px;
|
||||
bottom: 8px;
|
||||
background: currentColor
|
||||
}
|
||||
|
|
@ -1,33 +0,0 @@
|
|||
.gg-arrow-left {
|
||||
box-sizing: border-box;
|
||||
position: relative;
|
||||
display: block;
|
||||
transform: scale(var(--ggs,1));
|
||||
width: 22px;
|
||||
height: 22px
|
||||
}
|
||||
|
||||
.gg-arrow-left::after,
|
||||
.gg-arrow-left::before {
|
||||
content: "";
|
||||
display: block;
|
||||
box-sizing: border-box;
|
||||
position: absolute;
|
||||
left: 3px
|
||||
}
|
||||
|
||||
.gg-arrow-left::after {
|
||||
width: 8px;
|
||||
height: 8px;
|
||||
border-bottom: 2px solid;
|
||||
border-left: 2px solid;
|
||||
transform: rotate(45deg);
|
||||
bottom: 7px
|
||||
}
|
||||
|
||||
.gg-arrow-left::before {
|
||||
width: 16px;
|
||||
height: 2px;
|
||||
bottom: 10px;
|
||||
background: currentColor
|
||||
}
|
||||
|
|
@ -1,39 +0,0 @@
|
|||
.gg-arrow-long-down-c {
|
||||
box-sizing: border-box;
|
||||
position: relative;
|
||||
display: block;
|
||||
transform: scale(var(--ggs,1));
|
||||
border-right: 2px solid transparent;
|
||||
border-left: 2px solid transparent;
|
||||
border-top: 4px solid transparent;
|
||||
box-shadow: inset 0 0 0 2px;
|
||||
height: 24px;
|
||||
width: 6px
|
||||
}
|
||||
|
||||
.gg-arrow-long-down-c::after,
|
||||
.gg-arrow-long-down-c::before {
|
||||
content: "";
|
||||
display: block;
|
||||
box-sizing: border-box;
|
||||
position: absolute
|
||||
}
|
||||
|
||||
.gg-arrow-long-down-c::after {
|
||||
width: 6px;
|
||||
height: 6px;
|
||||
border-bottom: 2px solid;
|
||||
border-right: 2px solid;
|
||||
transform: rotate(45deg);
|
||||
bottom: 0;
|
||||
left: -2px
|
||||
}
|
||||
|
||||
.gg-arrow-long-down-c::before {
|
||||
width: 6px;
|
||||
height: 6px;
|
||||
border: 2px solid;
|
||||
border-radius: 8px;
|
||||
top: -4px;
|
||||
left: -2px
|
||||
}
|
||||
|
|
@ -1,38 +0,0 @@
|
|||
.gg-arrow-long-down-e {
|
||||
box-sizing: border-box;
|
||||
position: relative;
|
||||
display: block;
|
||||
transform: scale(var(--ggs,1));
|
||||
border-right: 2px solid transparent;
|
||||
border-left: 2px solid transparent;
|
||||
border-top: 4px solid transparent;
|
||||
box-shadow: inset 0 0 0 2px;
|
||||
height: 24px;
|
||||
width: 6px
|
||||
}
|
||||
|
||||
.gg-arrow-long-down-e::after,
|
||||
.gg-arrow-long-down-e::before {
|
||||
content: "";
|
||||
display: block;
|
||||
box-sizing: border-box;
|
||||
position: absolute
|
||||
}
|
||||
|
||||
.gg-arrow-long-down-e::after {
|
||||
width: 6px;
|
||||
height: 6px;
|
||||
border-bottom: 2px solid;
|
||||
border-right: 2px solid;
|
||||
transform: rotate(45deg);
|
||||
bottom: 0;
|
||||
left: -2px
|
||||
}
|
||||
|
||||
.gg-arrow-long-down-e::before {
|
||||
width: 6px;
|
||||
height: 6px;
|
||||
border: 2px solid;
|
||||
top: -5px;
|
||||
left: -2px
|
||||
}
|
||||
|
|
@ -1,37 +0,0 @@
|
|||
.gg-arrow-long-down-l {
|
||||
box-sizing: border-box;
|
||||
position: relative;
|
||||
display: block;
|
||||
transform: scale(var(--ggs,1));
|
||||
border-right: 2px solid transparent;
|
||||
border-left: 2px solid transparent;
|
||||
box-shadow: inset 0 0 0 2px;
|
||||
height: 24px;
|
||||
width: 6px
|
||||
}
|
||||
|
||||
.gg-arrow-long-down-l::after,
|
||||
.gg-arrow-long-down-l::before {
|
||||
content: "";
|
||||
display: block;
|
||||
box-sizing: border-box;
|
||||
position: absolute
|
||||
}
|
||||
|
||||
.gg-arrow-long-down-l::after {
|
||||
width: 6px;
|
||||
height: 6px;
|
||||
border-bottom: 2px solid;
|
||||
border-right: 2px solid;
|
||||
transform: rotate(45deg);
|
||||
bottom: 0;
|
||||
left: -2px
|
||||
}
|
||||
|
||||
.gg-arrow-long-down-l::before {
|
||||
width: 6px;
|
||||
height: 2px;
|
||||
background: currentColor;
|
||||
top: -1px;
|
||||
left: -2px
|
||||
}
|
||||
|
|
@ -1,39 +0,0 @@
|
|||
.gg-arrow-long-down-r {
|
||||
box-sizing: border-box;
|
||||
position: relative;
|
||||
display: block;
|
||||
transform: scale(var(--ggs,1));
|
||||
border-right: 2px solid transparent;
|
||||
border-left: 2px solid transparent;
|
||||
border-top: 4px solid transparent;
|
||||
box-shadow: inset 0 0 0 2px;
|
||||
height: 24px;
|
||||
width: 6px
|
||||
}
|
||||
|
||||
.gg-arrow-long-down-r::after,
|
||||
.gg-arrow-long-down-r::before {
|
||||
content: "";
|
||||
display: block;
|
||||
box-sizing: border-box;
|
||||
position: absolute
|
||||
}
|
||||
|
||||
.gg-arrow-long-down-r::after {
|
||||
width: 6px;
|
||||
height: 6px;
|
||||
border-bottom: 2px solid;
|
||||
border-right: 2px solid;
|
||||
transform: rotate(45deg);
|
||||
bottom: 0;
|
||||
left: -2px
|
||||
}
|
||||
|
||||
.gg-arrow-long-down-r::before {
|
||||
width: 6px;
|
||||
height: 6px;
|
||||
border: 2px solid;
|
||||
transform: rotate(45deg);
|
||||
top: -5px;
|
||||
left: -2px
|
||||
}
|
||||
|
|
@ -1,25 +0,0 @@
|
|||
.gg-arrow-long-down {
|
||||
box-sizing: border-box;
|
||||
position: relative;
|
||||
display: block;
|
||||
transform: scale(var(--ggs,1));
|
||||
border-right: 2px solid transparent;
|
||||
border-left: 2px solid transparent;
|
||||
box-shadow: inset 0 0 0 2px;
|
||||
height: 24px;
|
||||
width: 6px
|
||||
}
|
||||
|
||||
.gg-arrow-long-down::after {
|
||||
content: "";
|
||||
display: block;
|
||||
box-sizing: border-box;
|
||||
position: absolute;
|
||||
width: 6px;
|
||||
height: 6px;
|
||||
border-bottom: 2px solid;
|
||||
border-right: 2px solid;
|
||||
transform: rotate(45deg);
|
||||
bottom: 0;
|
||||
left: -2px
|
||||
}
|
||||
|
|
@ -1,39 +0,0 @@
|
|||
.gg-arrow-long-left-c {
|
||||
box-sizing: border-box;
|
||||
position: relative;
|
||||
display: block;
|
||||
transform: scale(var(--ggs,1));
|
||||
border-top: 2px solid transparent;
|
||||
border-bottom: 2px solid transparent;
|
||||
border-right: 4px solid transparent;
|
||||
box-shadow: inset 0 0 0 2px;
|
||||
width: 24px;
|
||||
height: 6px
|
||||
}
|
||||
|
||||
.gg-arrow-long-left-c::after,
|
||||
.gg-arrow-long-left-c::before {
|
||||
content: "";
|
||||
display: block;
|
||||
box-sizing: border-box;
|
||||
position: absolute
|
||||
}
|
||||
|
||||
.gg-arrow-long-left-c::after {
|
||||
width: 6px;
|
||||
height: 6px;
|
||||
border-bottom: 2px solid;
|
||||
border-left: 2px solid;
|
||||
transform: rotate(45deg);
|
||||
left: 0;
|
||||
bottom: -2px
|
||||
}
|
||||
|
||||
.gg-arrow-long-left-c::before {
|
||||
width: 6px;
|
||||
height: 6px;
|
||||
border: 2px solid;
|
||||
border-radius: 8px;
|
||||
right: -4px;
|
||||
bottom: -2px
|
||||
}
|
||||
|
|
@ -1,38 +0,0 @@
|
|||
.gg-arrow-long-left-e {
|
||||
box-sizing: border-box;
|
||||
position: relative;
|
||||
display: block;
|
||||
transform: scale(var(--ggs,1));
|
||||
border-top: 2px solid transparent;
|
||||
border-bottom: 2px solid transparent;
|
||||
border-right: 4px solid transparent;
|
||||
box-shadow: inset 0 0 0 2px;
|
||||
width: 24px;
|
||||
height: 6px
|
||||
}
|
||||
|
||||
.gg-arrow-long-left-e::after,
|
||||
.gg-arrow-long-left-e::before {
|
||||
content: "";
|
||||
display: block;
|
||||
box-sizing: border-box;
|
||||
position: absolute
|
||||
}
|
||||
|
||||
.gg-arrow-long-left-e::after {
|
||||
width: 6px;
|
||||
height: 6px;
|
||||
border-bottom: 2px solid;
|
||||
border-left: 2px solid;
|
||||
transform: rotate(45deg);
|
||||
left: 0;
|
||||
bottom: -2px
|
||||
}
|
||||
|
||||
.gg-arrow-long-left-e::before {
|
||||
width: 6px;
|
||||
height: 6px;
|
||||
border: 2px solid;
|
||||
right: -4px;
|
||||
bottom: -2px
|
||||
}
|
||||
|
|
@ -1,37 +0,0 @@
|
|||
.gg-arrow-long-left-l {
|
||||
box-sizing: border-box;
|
||||
position: relative;
|
||||
display: block;
|
||||
transform: scale(var(--ggs,1));
|
||||
border-top: 2px solid transparent;
|
||||
border-bottom: 2px solid transparent;
|
||||
box-shadow: inset 0 0 0 2px;
|
||||
width: 24px;
|
||||
height: 6px
|
||||
}
|
||||
|
||||
.gg-arrow-long-left-l::after,
|
||||
.gg-arrow-long-left-l::before {
|
||||
content: "";
|
||||
display: block;
|
||||
box-sizing: border-box;
|
||||
position: absolute
|
||||
}
|
||||
|
||||
.gg-arrow-long-left-l::after {
|
||||
width: 6px;
|
||||
height: 6px;
|
||||
border-bottom: 2px solid;
|
||||
border-left: 2px solid;
|
||||
transform: rotate(45deg);
|
||||
left: 0;
|
||||
bottom: -2px
|
||||
}
|
||||
|
||||
.gg-arrow-long-left-l::before {
|
||||
width: 2px;
|
||||
height: 6px;
|
||||
background: currentColor;
|
||||
right: -1px;
|
||||
bottom: -2px
|
||||
}
|
||||
|
|
@ -1,39 +0,0 @@
|
|||
.gg-arrow-long-left-r {
|
||||
box-sizing: border-box;
|
||||
position: relative;
|
||||
display: block;
|
||||
transform: scale(var(--ggs,1));
|
||||
border-top: 2px solid transparent;
|
||||
border-bottom: 2px solid transparent;
|
||||
border-right: 4px solid transparent;
|
||||
box-shadow: inset 0 0 0 2px;
|
||||
width: 24px;
|
||||
height: 6px
|
||||
}
|
||||
|
||||
.gg-arrow-long-left-r::after,
|
||||
.gg-arrow-long-left-r::before {
|
||||
content: "";
|
||||
display: block;
|
||||
box-sizing: border-box;
|
||||
position: absolute
|
||||
}
|
||||
|
||||
.gg-arrow-long-left-r::after {
|
||||
width: 6px;
|
||||
height: 6px;
|
||||
border-bottom: 2px solid;
|
||||
border-left: 2px solid;
|
||||
transform: rotate(45deg);
|
||||
left: 0;
|
||||
bottom: -2px
|
||||
}
|
||||
|
||||
.gg-arrow-long-left-r::before {
|
||||
width: 6px;
|
||||
height: 6px;
|
||||
border: 2px solid;
|
||||
transform: rotate(45deg);
|
||||
right: -5px;
|
||||
bottom: -2px
|
||||
}
|
||||
|
|
@ -1,25 +0,0 @@
|
|||
.gg-arrow-long-left {
|
||||
box-sizing: border-box;
|
||||
position: relative;
|
||||
display: block;
|
||||
transform: scale(var(--ggs,1));
|
||||
border-top: 2px solid transparent;
|
||||
border-bottom: 2px solid transparent;
|
||||
box-shadow: inset 0 0 0 2px;
|
||||
width: 24px;
|
||||
height: 6px
|
||||
}
|
||||
|
||||
.gg-arrow-long-left::after {
|
||||
content: "";
|
||||
display: block;
|
||||
box-sizing: border-box;
|
||||
position: absolute;
|
||||
width: 6px;
|
||||
height: 6px;
|
||||
border-bottom: 2px solid;
|
||||
border-left: 2px solid;
|
||||
transform: rotate(45deg);
|
||||
left: 0;
|
||||
bottom: -2px
|
||||
}
|
||||
|
|
@ -1,39 +0,0 @@
|
|||
.gg-arrow-long-right-c {
|
||||
box-sizing: border-box;
|
||||
position: relative;
|
||||
display: block;
|
||||
transform: scale(var(--ggs,1));
|
||||
border-top: 2px solid transparent;
|
||||
border-bottom: 2px solid transparent;
|
||||
border-left: 4px solid transparent;
|
||||
box-shadow: inset 0 0 0 2px;
|
||||
width: 24px;
|
||||
height: 6px
|
||||
}
|
||||
|
||||
.gg-arrow-long-right-c::after,
|
||||
.gg-arrow-long-right-c::before {
|
||||
content: "";
|
||||
display: block;
|
||||
box-sizing: border-box;
|
||||
position: absolute
|
||||
}
|
||||
|
||||
.gg-arrow-long-right-c::after {
|
||||
width: 6px;
|
||||
height: 6px;
|
||||
border-top: 2px solid;
|
||||
border-right: 2px solid;
|
||||
transform: rotate(45deg);
|
||||
right: 0;
|
||||
bottom: -2px
|
||||
}
|
||||
|
||||
.gg-arrow-long-right-c::before {
|
||||
width: 6px;
|
||||
height: 6px;
|
||||
border: 2px solid;
|
||||
border-radius: 8px;
|
||||
left: -4px;
|
||||
bottom: -2px
|
||||
}
|
||||
|
|
@ -1,38 +0,0 @@
|
|||
.gg-arrow-long-right-e {
|
||||
box-sizing: border-box;
|
||||
position: relative;
|
||||
display: block;
|
||||
transform: scale(var(--ggs,1));
|
||||
border-top: 2px solid transparent;
|
||||
border-bottom: 2px solid transparent;
|
||||
border-left: 4px solid transparent;
|
||||
box-shadow: inset 0 0 0 2px;
|
||||
width: 24px;
|
||||
height: 6px
|
||||
}
|
||||
|
||||
.gg-arrow-long-right-e::after,
|
||||
.gg-arrow-long-right-e::before {
|
||||
content: "";
|
||||
display: block;
|
||||
box-sizing: border-box;
|
||||
position: absolute
|
||||
}
|
||||
|
||||
.gg-arrow-long-right-e::after {
|
||||
width: 6px;
|
||||
height: 6px;
|
||||
border-top: 2px solid;
|
||||
border-right: 2px solid;
|
||||
transform: rotate(45deg);
|
||||
right: 0;
|
||||
bottom: -2px
|
||||
}
|
||||
|
||||
.gg-arrow-long-right-e::before {
|
||||
width: 6px;
|
||||
height: 6px;
|
||||
border: 2px solid;
|
||||
left: -4px;
|
||||
bottom: -2px
|
||||
}
|
||||
|
|
@ -1,37 +0,0 @@
|
|||
.gg-arrow-long-right-l {
|
||||
box-sizing: border-box;
|
||||
position: relative;
|
||||
display: block;
|
||||
transform: scale(var(--ggs,1));
|
||||
border-top: 2px solid transparent;
|
||||
border-bottom: 2px solid transparent;
|
||||
box-shadow: inset 0 0 0 2px;
|
||||
width: 24px;
|
||||
height: 6px
|
||||
}
|
||||
|
||||
.gg-arrow-long-right-l::after,
|
||||
.gg-arrow-long-right-l::before {
|
||||
content: "";
|
||||
display: block;
|
||||
box-sizing: border-box;
|
||||
position: absolute
|
||||
}
|
||||
|
||||
.gg-arrow-long-right-l::after {
|
||||
width: 6px;
|
||||
height: 6px;
|
||||
border-top: 2px solid;
|
||||
border-right: 2px solid;
|
||||
transform: rotate(45deg);
|
||||
right: 0;
|
||||
bottom: -2px
|
||||
}
|
||||
|
||||
.gg-arrow-long-right-l::before {
|
||||
width: 2px;
|
||||
height: 6px;
|
||||
background: currentColor;
|
||||
left: -1px;
|
||||
bottom: -2px
|
||||
}
|
||||
|
|
@ -1,39 +0,0 @@
|
|||
.gg-arrow-long-right-r {
|
||||
box-sizing: border-box;
|
||||
position: relative;
|
||||
display: block;
|
||||
transform: scale(var(--ggs,1));
|
||||
border-top: 2px solid transparent;
|
||||
border-bottom: 2px solid transparent;
|
||||
border-left: 4px solid transparent;
|
||||
box-shadow: inset 0 0 0 2px;
|
||||
width: 24px;
|
||||
height: 6px
|
||||
}
|
||||
|
||||
.gg-arrow-long-right-r::after,
|
||||
.gg-arrow-long-right-r::before {
|
||||
content: "";
|
||||
display: block;
|
||||
box-sizing: border-box;
|
||||
position: absolute
|
||||
}
|
||||
|
||||
.gg-arrow-long-right-r::after {
|
||||
width: 6px;
|
||||
height: 6px;
|
||||
border-top: 2px solid;
|
||||
border-right: 2px solid;
|
||||
transform: rotate(45deg);
|
||||
right: 0;
|
||||
bottom: -2px
|
||||
}
|
||||
|
||||
.gg-arrow-long-right-r::before {
|
||||
width: 6px;
|
||||
height: 6px;
|
||||
border: 2px solid;
|
||||
transform: rotate(45deg);
|
||||
left: -5px;
|
||||
bottom: -2px
|
||||
}
|
||||
|
|
@ -1,25 +0,0 @@
|
|||
.gg-arrow-long-right {
|
||||
box-sizing: border-box;
|
||||
position: relative;
|
||||
display: block;
|
||||
transform: scale(var(--ggs,1));
|
||||
border-top: 2px solid transparent;
|
||||
border-bottom: 2px solid transparent;
|
||||
box-shadow: inset 0 0 0 2px;
|
||||
width: 24px;
|
||||
height: 6px
|
||||
}
|
||||
|
||||
.gg-arrow-long-right::after {
|
||||
content: "";
|
||||
display: block;
|
||||
box-sizing: border-box;
|
||||
position: absolute;
|
||||
width: 6px;
|
||||
height: 6px;
|
||||
border-top: 2px solid;
|
||||
border-right: 2px solid;
|
||||
transform: rotate(45deg);
|
||||
right: 0;
|
||||
bottom: -2px
|
||||
}
|
||||
|
|
@ -1,39 +0,0 @@
|
|||
.gg-arrow-long-up-c {
|
||||
box-sizing: border-box;
|
||||
position: relative;
|
||||
display: block;
|
||||
transform: scale(var(--ggs,1));
|
||||
border-right: 2px solid transparent;
|
||||
border-left: 2px solid transparent;
|
||||
border-bottom: 4px solid transparent;
|
||||
box-shadow: inset 0 0 0 2px;
|
||||
height: 24px;
|
||||
width: 6px
|
||||
}
|
||||
|
||||
.gg-arrow-long-up-c::after,
|
||||
.gg-arrow-long-up-c::before {
|
||||
content: "";
|
||||
display: block;
|
||||
box-sizing: border-box;
|
||||
position: absolute
|
||||
}
|
||||
|
||||
.gg-arrow-long-up-c::after {
|
||||
width: 6px;
|
||||
height: 6px;
|
||||
border-top: 2px solid;
|
||||
border-left: 2px solid;
|
||||
transform: rotate(45deg);
|
||||
top: 0;
|
||||
left: -2px
|
||||
}
|
||||
|
||||
.gg-arrow-long-up-c::before {
|
||||
width: 6px;
|
||||
height: 6px;
|
||||
border: 2px solid;
|
||||
border-radius: 8px;
|
||||
bottom: -4px;
|
||||
left: -2px
|
||||
}
|
||||
|
|
@ -1,38 +0,0 @@
|
|||
.gg-arrow-long-up-e {
|
||||
box-sizing: border-box;
|
||||
position: relative;
|
||||
display: block;
|
||||
transform: scale(var(--ggs,1));
|
||||
border-right: 2px solid transparent;
|
||||
border-left: 2px solid transparent;
|
||||
border-bottom: 4px solid transparent;
|
||||
box-shadow: inset 0 0 0 2px;
|
||||
height: 24px;
|
||||
width: 6px
|
||||
}
|
||||
|
||||
.gg-arrow-long-up-e::after,
|
||||
.gg-arrow-long-up-e::before {
|
||||
content: "";
|
||||
display: block;
|
||||
box-sizing: border-box;
|
||||
position: absolute
|
||||
}
|
||||
|
||||
.gg-arrow-long-up-e::after {
|
||||
width: 6px;
|
||||
height: 6px;
|
||||
border-top: 2px solid;
|
||||
border-left: 2px solid;
|
||||
transform: rotate(45deg);
|
||||
top: 0;
|
||||
left: -2px
|
||||
}
|
||||
|
||||
.gg-arrow-long-up-e::before {
|
||||
width: 6px;
|
||||
height: 6px;
|
||||
border: 2px solid;
|
||||
bottom: -5px;
|
||||
left: -2px
|
||||
}
|
||||
|
|
@ -1,37 +0,0 @@
|
|||
.gg-arrow-long-up-l {
|
||||
box-sizing: border-box;
|
||||
position: relative;
|
||||
display: block;
|
||||
transform: scale(var(--ggs,1));
|
||||
border-right: 2px solid transparent;
|
||||
border-left: 2px solid transparent;
|
||||
box-shadow: inset 0 0 0 2px;
|
||||
height: 24px;
|
||||
width: 6px
|
||||
}
|
||||
|
||||
.gg-arrow-long-up-l::after,
|
||||
.gg-arrow-long-up-l::before {
|
||||
content: "";
|
||||
display: block;
|
||||
box-sizing: border-box;
|
||||
position: absolute
|
||||
}
|
||||
|
||||
.gg-arrow-long-up-l::after {
|
||||
width: 6px;
|
||||
height: 6px;
|
||||
border-top: 2px solid;
|
||||
border-left: 2px solid;
|
||||
transform: rotate(45deg);
|
||||
top: 0;
|
||||
left: -2px
|
||||
}
|
||||
|
||||
.gg-arrow-long-up-l::before {
|
||||
width: 6px;
|
||||
height: 2px;
|
||||
background: currentColor;
|
||||
bottom: -1px;
|
||||
left: -2px
|
||||
}
|
||||
|
|
@ -1,39 +0,0 @@
|
|||
.gg-arrow-long-up-r {
|
||||
box-sizing: border-box;
|
||||
position: relative;
|
||||
display: block;
|
||||
transform: scale(var(--ggs,1));
|
||||
border-right: 2px solid transparent;
|
||||
border-left: 2px solid transparent;
|
||||
border-bottom: 4px solid transparent;
|
||||
box-shadow: inset 0 0 0 2px;
|
||||
height: 24px;
|
||||
width: 6px
|
||||
}
|
||||
|
||||
.gg-arrow-long-up-r::after,
|
||||
.gg-arrow-long-up-r::before {
|
||||
content: "";
|
||||
display: block;
|
||||
box-sizing: border-box;
|
||||
position: absolute
|
||||
}
|
||||
|
||||
.gg-arrow-long-up-r::after {
|
||||
width: 6px;
|
||||
height: 6px;
|
||||
border-top: 2px solid;
|
||||
border-left: 2px solid;
|
||||
transform: rotate(45deg);
|
||||
top: 0;
|
||||
left: -2px
|
||||
}
|
||||
|
||||
.gg-arrow-long-up-r::before {
|
||||
width: 6px;
|
||||
height: 6px;
|
||||
border: 2px solid;
|
||||
transform: rotate(45deg);
|
||||
bottom: -5px;
|
||||
left: -2px
|
||||
}
|
||||
|
|
@ -1,26 +0,0 @@
|
|||
.gg-arrow-long-up,
|
||||
.gg-arrow-long-up::after {
|
||||
display: block;
|
||||
box-sizing: border-box;
|
||||
width: 6px
|
||||
}
|
||||
|
||||
.gg-arrow-long-up {
|
||||
position: relative;
|
||||
transform: scale(var(--ggs,1));
|
||||
border-right: 2px solid transparent;
|
||||
border-left: 2px solid transparent;
|
||||
box-shadow: inset 0 0 0 2px;
|
||||
height: 24px
|
||||
}
|
||||
|
||||
.gg-arrow-long-up::after {
|
||||
content: "";
|
||||
position: absolute;
|
||||
height: 6px;
|
||||
border-top: 2px solid;
|
||||
border-left: 2px solid;
|
||||
transform: rotate(45deg);
|
||||
top: 0;
|
||||
left: -2px
|
||||
}
|
||||
|
|
@ -1,35 +0,0 @@
|
|||
.gg-arrow-right-o {
|
||||
box-sizing: border-box;
|
||||
position: relative;
|
||||
display: block;
|
||||
width: 22px;
|
||||
height: 22px;
|
||||
border: 2px solid;
|
||||
transform: scale(var(--ggs,1));
|
||||
border-radius: 20px
|
||||
}
|
||||
|
||||
.gg-arrow-right-o::after,
|
||||
.gg-arrow-right-o::before {
|
||||
content: "";
|
||||
display: block;
|
||||
box-sizing: border-box;
|
||||
position: absolute;
|
||||
right: 4px
|
||||
}
|
||||
|
||||
.gg-arrow-right-o::after {
|
||||
width: 6px;
|
||||
height: 6px;
|
||||
border-top: 2px solid;
|
||||
border-right: 2px solid;
|
||||
transform: rotate(45deg);
|
||||
bottom: 6px
|
||||
}
|
||||
|
||||
.gg-arrow-right-o::before {
|
||||
width: 10px;
|
||||
height: 2px;
|
||||
bottom: 8px;
|
||||
background: currentColor
|
||||
}
|
||||
|
|
@ -1,35 +0,0 @@
|
|||
.gg-arrow-right-r {
|
||||
box-sizing: border-box;
|
||||
position: relative;
|
||||
display: block;
|
||||
width: 22px;
|
||||
height: 22px;
|
||||
border: 2px solid;
|
||||
transform: scale(var(--ggs,1));
|
||||
border-radius: 4px
|
||||
}
|
||||
|
||||
.gg-arrow-right-r::after,
|
||||
.gg-arrow-right-r::before {
|
||||
content: "";
|
||||
display: block;
|
||||
box-sizing: border-box;
|
||||
position: absolute;
|
||||
right: 4px
|
||||
}
|
||||
|
||||
.gg-arrow-right-r::after {
|
||||
width: 6px;
|
||||
height: 6px;
|
||||
border-top: 2px solid;
|
||||
border-right: 2px solid;
|
||||
transform: rotate(45deg);
|
||||
bottom: 6px
|
||||
}
|
||||
|
||||
.gg-arrow-right-r::before {
|
||||
width: 10px;
|
||||
height: 2px;
|
||||
bottom: 8px;
|
||||
background: currentColor
|
||||
}
|
||||
|
|
@ -1,33 +0,0 @@
|
|||
.gg-arrow-right {
|
||||
box-sizing: border-box;
|
||||
position: relative;
|
||||
display: block;
|
||||
transform: scale(var(--ggs,1));
|
||||
width: 22px;
|
||||
height: 22px
|
||||
}
|
||||
|
||||
.gg-arrow-right::after,
|
||||
.gg-arrow-right::before {
|
||||
content: "";
|
||||
display: block;
|
||||
box-sizing: border-box;
|
||||
position: absolute;
|
||||
right: 3px
|
||||
}
|
||||
|
||||
.gg-arrow-right::after {
|
||||
width: 8px;
|
||||
height: 8px;
|
||||
border-top: 2px solid;
|
||||
border-right: 2px solid;
|
||||
transform: rotate(45deg);
|
||||
bottom: 7px
|
||||
}
|
||||
|
||||
.gg-arrow-right::before {
|
||||
width: 16px;
|
||||
height: 2px;
|
||||
bottom: 10px;
|
||||
background: currentColor
|
||||
}
|
||||
|
|
@ -1,36 +0,0 @@
|
|||
.gg-arrow-top-left-o {
|
||||
box-sizing: border-box;
|
||||
position: relative;
|
||||
display: block;
|
||||
width: 22px;
|
||||
height: 22px;
|
||||
border: 2px solid;
|
||||
transform: scale(var(--ggs,1));
|
||||
border-radius: 20px
|
||||
}
|
||||
|
||||
.gg-arrow-top-left-o::after,
|
||||
.gg-arrow-top-left-o::before {
|
||||
content: "";
|
||||
display: block;
|
||||
box-sizing: border-box;
|
||||
position: absolute
|
||||
}
|
||||
|
||||
.gg-arrow-top-left-o::after {
|
||||
width: 10px;
|
||||
height: 2px;
|
||||
background: currentColor;
|
||||
transform: rotate(45deg);
|
||||
bottom: 8px;
|
||||
right: 4px
|
||||
}
|
||||
|
||||
.gg-arrow-top-left-o::before {
|
||||
width: 6px;
|
||||
height: 6px;
|
||||
left: 4px;
|
||||
top: 4px;
|
||||
border-top: 2px solid;
|
||||
border-left: 2px solid
|
||||
}
|
||||
|
|
@ -1,35 +0,0 @@
|
|||
.gg-arrow-top-left-r {
|
||||
box-sizing: border-box;
|
||||
position: relative;
|
||||
display: block;
|
||||
width: 22px;
|
||||
height: 22px;
|
||||
border: 2px solid;
|
||||
transform: scale(var(--ggs,1));
|
||||
border-radius: 4px
|
||||
}
|
||||
|
||||
.gg-arrow-top-left-r::after,
|
||||
.gg-arrow-top-left-r::before {
|
||||
content: "";
|
||||
display: block;
|
||||
box-sizing: border-box;
|
||||
position: absolute;
|
||||
left: 4px
|
||||
}
|
||||
|
||||
.gg-arrow-top-left-r::after {
|
||||
width: 10px;
|
||||
height: 2px;
|
||||
background: currentColor;
|
||||
transform: rotate(45deg);
|
||||
bottom: 8px
|
||||
}
|
||||
|
||||
.gg-arrow-top-left-r::before {
|
||||
width: 6px;
|
||||
height: 6px;
|
||||
top: 4px;
|
||||
border-top: 2px solid;
|
||||
border-left: 2px solid
|
||||
}
|
||||
|
|
@ -1,23 +0,0 @@
|
|||
.gg-arrow-top-left {
|
||||
box-sizing: border-box;
|
||||
position: relative;
|
||||
display: block;
|
||||
width: 8px;
|
||||
height: 8px;
|
||||
transform: scale(var(--ggs,1));
|
||||
border-top: 2px solid;
|
||||
border-left: 2px solid
|
||||
}
|
||||
|
||||
.gg-arrow-top-left::after {
|
||||
content: "";
|
||||
display: block;
|
||||
box-sizing: border-box;
|
||||
position: absolute;
|
||||
width: 14px;
|
||||
height: 2px;
|
||||
background: currentColor;
|
||||
transform: rotate(45deg);
|
||||
top: 3px;
|
||||
left: -3px
|
||||
}
|
||||
|
|
@ -1,35 +0,0 @@
|
|||
.gg-arrow-top-right-o {
|
||||
box-sizing: border-box;
|
||||
position: relative;
|
||||
display: block;
|
||||
width: 22px;
|
||||
height: 22px;
|
||||
border: 2px solid;
|
||||
transform: scale(var(--ggs,1));
|
||||
border-radius: 20px
|
||||
}
|
||||
|
||||
.gg-arrow-top-right-o::after,
|
||||
.gg-arrow-top-right-o::before {
|
||||
content: "";
|
||||
display: block;
|
||||
box-sizing: border-box;
|
||||
position: absolute;
|
||||
right: 4px
|
||||
}
|
||||
|
||||
.gg-arrow-top-right-o::after {
|
||||
width: 10px;
|
||||
height: 2px;
|
||||
background: currentColor;
|
||||
transform: rotate(-45deg);
|
||||
bottom: 8px
|
||||
}
|
||||
|
||||
.gg-arrow-top-right-o::before {
|
||||
width: 6px;
|
||||
height: 6px;
|
||||
top: 4px;
|
||||
border-top: 2px solid;
|
||||
border-right: 2px solid
|
||||
}
|
||||
|
|
@ -1,35 +0,0 @@
|
|||
.gg-arrow-top-right-r {
|
||||
box-sizing: border-box;
|
||||
position: relative;
|
||||
display: block;
|
||||
width: 22px;
|
||||
height: 22px;
|
||||
border: 2px solid;
|
||||
transform: scale(var(--ggs,1));
|
||||
border-radius: 4px
|
||||
}
|
||||
|
||||
.gg-arrow-top-right-r::after,
|
||||
.gg-arrow-top-right-r::before {
|
||||
content: "";
|
||||
display: block;
|
||||
box-sizing: border-box;
|
||||
position: absolute;
|
||||
right: 4px
|
||||
}
|
||||
|
||||
.gg-arrow-top-right-r::after {
|
||||
width: 10px;
|
||||
height: 2px;
|
||||
background: currentColor;
|
||||
transform: rotate(-45deg);
|
||||
bottom: 8px
|
||||
}
|
||||
|
||||
.gg-arrow-top-right-r::before {
|
||||
width: 6px;
|
||||
height: 6px;
|
||||
top: 4px;
|
||||
border-top: 2px solid;
|
||||
border-right: 2px solid
|
||||
}
|
||||
|
|
@ -1,23 +0,0 @@
|
|||
.gg-arrow-top-right {
|
||||
box-sizing: border-box;
|
||||
position: relative;
|
||||
display: block;
|
||||
width: 8px;
|
||||
height: 8px;
|
||||
border-top: 2px solid;
|
||||
transform: scale(var(--ggs,1));
|
||||
border-right: 2px solid
|
||||
}
|
||||
|
||||
.gg-arrow-top-right::after {
|
||||
content: "";
|
||||
display: block;
|
||||
box-sizing: border-box;
|
||||
position: absolute;
|
||||
width: 14px;
|
||||
height: 2px;
|
||||
background: currentColor;
|
||||
transform: rotate(-45deg);
|
||||
top: 3px;
|
||||
right: -3px
|
||||
}
|
||||
|
|
@ -1,35 +0,0 @@
|
|||
.gg-arrow-up-o {
|
||||
box-sizing: border-box;
|
||||
position: relative;
|
||||
display: block;
|
||||
width: 22px;
|
||||
height: 22px;
|
||||
border: 2px solid;
|
||||
transform: scale(var(--ggs,1));
|
||||
border-radius: 20px
|
||||
}
|
||||
|
||||
.gg-arrow-up-o::after,
|
||||
.gg-arrow-up-o::before {
|
||||
content: "";
|
||||
display: block;
|
||||
box-sizing: border-box;
|
||||
position: absolute;
|
||||
top: 4px
|
||||
}
|
||||
|
||||
.gg-arrow-up-o::after {
|
||||
width: 6px;
|
||||
height: 6px;
|
||||
border-top: 2px solid;
|
||||
border-left: 2px solid;
|
||||
transform: rotate(45deg);
|
||||
left: 6px
|
||||
}
|
||||
|
||||
.gg-arrow-up-o::before {
|
||||
width: 2px;
|
||||
height: 10px;
|
||||
left: 8px;
|
||||
background: currentColor
|
||||
}
|
||||
|
|
@ -1,35 +0,0 @@
|
|||
.gg-arrow-up-r {
|
||||
box-sizing: border-box;
|
||||
position: relative;
|
||||
display: block;
|
||||
width: 22px;
|
||||
height: 22px;
|
||||
border: 2px solid;
|
||||
transform: scale(var(--ggs,1));
|
||||
border-radius: 4px
|
||||
}
|
||||
|
||||
.gg-arrow-up-r::after,
|
||||
.gg-arrow-up-r::before {
|
||||
content: "";
|
||||
display: block;
|
||||
box-sizing: border-box;
|
||||
position: absolute;
|
||||
top: 4px
|
||||
}
|
||||
|
||||
.gg-arrow-up-r::after {
|
||||
width: 6px;
|
||||
height: 6px;
|
||||
border-top: 2px solid;
|
||||
border-left: 2px solid;
|
||||
transform: rotate(45deg);
|
||||
left: 6px
|
||||
}
|
||||
|
||||
.gg-arrow-up-r::before {
|
||||
width: 2px;
|
||||
height: 10px;
|
||||
left: 8px;
|
||||
background: currentColor
|
||||
}
|
||||
|
|
@ -1,33 +0,0 @@
|
|||
.gg-arrow-up {
|
||||
box-sizing: border-box;
|
||||
position: relative;
|
||||
display: block;
|
||||
transform: scale(var(--ggs,1));
|
||||
width: 22px;
|
||||
height: 22px
|
||||
}
|
||||
|
||||
.gg-arrow-up::after,
|
||||
.gg-arrow-up::before {
|
||||
content: "";
|
||||
display: block;
|
||||
box-sizing: border-box;
|
||||
position: absolute;
|
||||
top: 4px
|
||||
}
|
||||
|
||||
.gg-arrow-up::after {
|
||||
width: 8px;
|
||||
height: 8px;
|
||||
border-top: 2px solid;
|
||||
border-left: 2px solid;
|
||||
transform: rotate(45deg);
|
||||
left: 7px
|
||||
}
|
||||
|
||||
.gg-arrow-up::before {
|
||||
width: 2px;
|
||||
height: 16px;
|
||||
left: 10px;
|
||||
background: currentColor
|
||||
}
|
||||
|
|
@ -1,48 +0,0 @@
|
|||
.gg-arrows-breake-h {
|
||||
box-sizing: border-box;
|
||||
position: relative;
|
||||
display: block;
|
||||
transform: scale(var(--ggs,1));
|
||||
width: 20px;
|
||||
height: 10px;
|
||||
background:
|
||||
linear-gradient(
|
||||
to left,currentColor 10px,
|
||||
transparent 0)
|
||||
no-repeat center left/8px 2px,
|
||||
linear-gradient(
|
||||
to left,currentColor 10px,
|
||||
transparent 0)
|
||||
no-repeat center right/8px 2px,
|
||||
linear-gradient(
|
||||
to left,currentColor 10px,
|
||||
transparent 0)
|
||||
no-repeat 7px center/2px 10px,
|
||||
linear-gradient(
|
||||
to left,currentColor 10px,
|
||||
transparent 0)
|
||||
no-repeat 11px center/2px 10px
|
||||
}
|
||||
|
||||
.gg-arrows-breake-h::after,
|
||||
.gg-arrows-breake-h::before {
|
||||
content: "";
|
||||
display: block;
|
||||
box-sizing: border-box;
|
||||
position: absolute;
|
||||
width: 6px;
|
||||
height: 6px;
|
||||
transform: rotate(45deg);
|
||||
top: 2px
|
||||
}
|
||||
|
||||
.gg-arrows-breake-h::after {
|
||||
border-left: 2px solid;
|
||||
border-bottom: 2px solid
|
||||
}
|
||||
|
||||
.gg-arrows-breake-h::before {
|
||||
border-right: 2px solid;
|
||||
border-top: 2px solid;
|
||||
right: 0
|
||||
}
|
||||
|
|
@ -1,48 +0,0 @@
|
|||
.gg-arrows-breake-v {
|
||||
box-sizing: border-box;
|
||||
position: relative;
|
||||
display: block;
|
||||
transform: scale(var(--ggs,1));
|
||||
width: 10px;
|
||||
height: 20px;
|
||||
background:
|
||||
linear-gradient(
|
||||
to left,currentColor 10px,
|
||||
transparent 0)
|
||||
no-repeat center top/2px 8px,
|
||||
linear-gradient(
|
||||
to left,currentColor 10px,
|
||||
transparent 0)
|
||||
no-repeat center bottom/2px 8px,
|
||||
linear-gradient(
|
||||
to left,currentColor 10px,
|
||||
transparent 0)
|
||||
no-repeat center 7px/10px 2px,
|
||||
linear-gradient(
|
||||
to left,currentColor 10px,
|
||||
transparent 0)
|
||||
no-repeat center 11px/10px 2px
|
||||
}
|
||||
|
||||
.gg-arrows-breake-v::after,
|
||||
.gg-arrows-breake-v::before {
|
||||
content: "";
|
||||
display: block;
|
||||
box-sizing: border-box;
|
||||
position: absolute;
|
||||
width: 6px;
|
||||
height: 6px;
|
||||
transform: rotate(45deg);
|
||||
left: 2px
|
||||
}
|
||||
|
||||
.gg-arrows-breake-v::after {
|
||||
border-left: 2px solid;
|
||||
border-top: 2px solid
|
||||
}
|
||||
|
||||
.gg-arrows-breake-v::before {
|
||||
border-right: 2px solid;
|
||||
border-bottom: 2px solid;
|
||||
bottom: 0
|
||||
}
|
||||
|
|
@ -1,33 +0,0 @@
|
|||
.gg-arrows-exchange-alt-v {
|
||||
box-sizing: border-box;
|
||||
position: relative;
|
||||
display: block;
|
||||
transform: scale(var(--ggs,1));
|
||||
width: 14px;
|
||||
height: 16px
|
||||
}
|
||||
|
||||
.gg-arrows-exchange-alt-v::after,
|
||||
.gg-arrows-exchange-alt-v::before {
|
||||
content: "";
|
||||
display: block;
|
||||
box-sizing: border-box;
|
||||
position: absolute;
|
||||
width: 2px;
|
||||
background: currentColor;
|
||||
border-radius: 4px
|
||||
}
|
||||
|
||||
.gg-arrows-exchange-alt-v::before {
|
||||
height: 6px;
|
||||
transform: rotate(-45deg);
|
||||
box-shadow: 13px -2px 0;
|
||||
top: 10px;
|
||||
left: 2px
|
||||
}
|
||||
|
||||
.gg-arrows-exchange-alt-v::after {
|
||||
height: 12px;
|
||||
box-shadow: -4px 4px 0;
|
||||
right: 4px
|
||||
}
|
||||
|
|
@ -1,33 +0,0 @@
|
|||
.gg-arrows-exchange-alt {
|
||||
box-sizing: border-box;
|
||||
position: relative;
|
||||
display: block;
|
||||
transform: scale(var(--ggs,1));
|
||||
width: 16px;
|
||||
height: 14px
|
||||
}
|
||||
|
||||
.gg-arrows-exchange-alt::after,
|
||||
.gg-arrows-exchange-alt::before {
|
||||
content: "";
|
||||
display: block;
|
||||
box-sizing: border-box;
|
||||
position: absolute;
|
||||
height: 2px;
|
||||
background: currentColor;
|
||||
border-radius: 4px
|
||||
}
|
||||
|
||||
.gg-arrows-exchange-alt::before {
|
||||
width: 6px;
|
||||
transform: rotate(-45deg);
|
||||
box-shadow: -2px -13px 0;
|
||||
right: 0;
|
||||
top: 10px
|
||||
}
|
||||
|
||||
.gg-arrows-exchange-alt::after {
|
||||
width: 12px;
|
||||
box-shadow: 4px 4px 0;
|
||||
top: 4px
|
||||
}
|
||||
|
|
@ -1,34 +0,0 @@
|
|||
.gg-arrows-exchange-v {
|
||||
box-sizing: border-box;
|
||||
position: relative;
|
||||
display: block;
|
||||
transform: scale(var(--ggs,1));
|
||||
width: 14px;
|
||||
height: 16px
|
||||
}
|
||||
|
||||
.gg-arrows-exchange-v::after,
|
||||
.gg-arrows-exchange-v::before {
|
||||
content: "";
|
||||
display: block;
|
||||
box-sizing: border-box;
|
||||
position: absolute;
|
||||
width: 2px;
|
||||
background: currentColor;
|
||||
border-radius: 4px
|
||||
}
|
||||
|
||||
.gg-arrows-exchange-v::before {
|
||||
height: 6px;
|
||||
transform: rotate(45deg);
|
||||
box-shadow: 7px -4px 0;
|
||||
top: 4px;
|
||||
left: 2px
|
||||
}
|
||||
|
||||
.gg-arrows-exchange-v::after {
|
||||
height: 12px;
|
||||
box-shadow: -4px 4px 0;
|
||||
right: 4px;
|
||||
bottom: 4px
|
||||
}
|
||||
|
|
@ -1,33 +0,0 @@
|
|||
.gg-arrows-exchange {
|
||||
box-sizing: border-box;
|
||||
position: relative;
|
||||
display: block;
|
||||
transform: scale(var(--ggs,1));
|
||||
width: 16px;
|
||||
height: 14px
|
||||
}
|
||||
|
||||
.gg-arrows-exchange::after,
|
||||
.gg-arrows-exchange::before {
|
||||
content: "";
|
||||
display: block;
|
||||
box-sizing: border-box;
|
||||
position: absolute;
|
||||
height: 2px;
|
||||
background: currentColor;
|
||||
border-radius: 4px
|
||||
}
|
||||
|
||||
.gg-arrows-exchange::before {
|
||||
width: 6px;
|
||||
transform: rotate(45deg);
|
||||
box-shadow: 2px -13px 0;
|
||||
top: 10px
|
||||
}
|
||||
|
||||
.gg-arrows-exchange::after {
|
||||
width: 12px;
|
||||
box-shadow: -4px 4px 0;
|
||||
left: 4px;
|
||||
top: 4px
|
||||
}
|
||||
|
|
@ -1,35 +0,0 @@
|
|||
.gg-arrows-expand-down-left {
|
||||
box-sizing: border-box;
|
||||
position: relative;
|
||||
display: block;
|
||||
transform: scale(var(--ggs,1));
|
||||
width: 16px;
|
||||
height: 16px;
|
||||
box-shadow: -6px 6px 0 -4px
|
||||
}
|
||||
|
||||
.gg-arrows-expand-down-left::before {
|
||||
content: "";
|
||||
display: block;
|
||||
box-sizing: border-box;
|
||||
position: absolute;
|
||||
width: 8px;
|
||||
height: 8px;
|
||||
border: 2px solid;
|
||||
border-radius: 1px;
|
||||
right: 0
|
||||
}
|
||||
|
||||
.gg-arrows-expand-down-left::after {
|
||||
content: "";
|
||||
display: block;
|
||||
box-sizing: border-box;
|
||||
position: absolute;
|
||||
background: currentColor;
|
||||
width: 2px;
|
||||
height: 10px;
|
||||
transform: rotate(45deg);
|
||||
top: 8px;
|
||||
left: 2px;
|
||||
border-radius: 4px
|
||||
}
|
||||
|
|
@ -1,35 +0,0 @@
|
|||
.gg-arrows-expand-down-right {
|
||||
box-sizing: border-box;
|
||||
position: relative;
|
||||
display: block;
|
||||
transform: scale(var(--ggs,1));
|
||||
width: 16px;
|
||||
height: 16px;
|
||||
box-shadow: 6px 6px 0 -4px
|
||||
}
|
||||
|
||||
.gg-arrows-expand-down-right::before {
|
||||
content: "";
|
||||
display: block;
|
||||
box-sizing: border-box;
|
||||
position: absolute;
|
||||
width: 8px;
|
||||
height: 8px;
|
||||
border: 2px solid;
|
||||
border-radius: 1px;
|
||||
left: 0
|
||||
}
|
||||
|
||||
.gg-arrows-expand-down-right::after {
|
||||
content: "";
|
||||
display: block;
|
||||
box-sizing: border-box;
|
||||
position: absolute;
|
||||
background: currentColor;
|
||||
width: 2px;
|
||||
height: 10px;
|
||||
transform: rotate(-45deg);
|
||||
top: 8px;
|
||||
right: 2px;
|
||||
border-radius: 4px
|
||||
}
|
||||
|
|
@ -1,38 +0,0 @@
|
|||
.gg-arrows-expand-left-alt {
|
||||
box-sizing: border-box;
|
||||
position: relative;
|
||||
display: block;
|
||||
transform: scale(var(--ggs,1));
|
||||
width: 14px;
|
||||
height: 14px;
|
||||
margin: 2px;
|
||||
box-shadow:
|
||||
6px 6px 0 -4px,
|
||||
-6px -6px 0 -4px
|
||||
}
|
||||
|
||||
.gg-arrows-expand-left-alt::after,
|
||||
.gg-arrows-expand-left-alt::before {
|
||||
content: "";
|
||||
display: block;
|
||||
box-sizing: border-box;
|
||||
position: absolute;
|
||||
transform: rotate(-45deg)
|
||||
}
|
||||
|
||||
.gg-arrows-expand-left-alt::before {
|
||||
width: 2px;
|
||||
height: 22px;
|
||||
top: -4px;
|
||||
left: 6px;
|
||||
border-top: 9px solid;
|
||||
border-bottom: 9px solid
|
||||
}
|
||||
|
||||
.gg-arrows-expand-left-alt::after {
|
||||
width: 8px;
|
||||
height: 2px;
|
||||
background: currentColor;
|
||||
top: 6px;
|
||||
left: 3px
|
||||
}
|
||||
|
|
@ -1,25 +0,0 @@
|
|||
.gg-arrows-expand-left {
|
||||
box-sizing: border-box;
|
||||
position: relative;
|
||||
display: block;
|
||||
transform: scale(var(--ggs,1));
|
||||
width: 14px;
|
||||
height: 14px;
|
||||
box-shadow:
|
||||
6px 6px 0 -4px,
|
||||
-6px -6px 0 -4px
|
||||
}
|
||||
|
||||
.gg-arrows-expand-left::before {
|
||||
content: "";
|
||||
display: block;
|
||||
box-sizing: border-box;
|
||||
position: absolute;
|
||||
width: 2px;
|
||||
height: 22px;
|
||||
top: -4px;
|
||||
left: 6px;
|
||||
transform: rotate(-45deg);
|
||||
border-top: 9px solid;
|
||||
border-bottom: 9px solid
|
||||
}
|
||||
|
|
@ -1,38 +0,0 @@
|
|||
.gg-arrows-expand-right-alt {
|
||||
box-sizing: border-box;
|
||||
position: relative;
|
||||
display: block;
|
||||
transform: scale(var(--ggs,1));
|
||||
width: 14px;
|
||||
height: 14px;
|
||||
margin: 2px;
|
||||
box-shadow:
|
||||
-6px 6px 0 -4px,
|
||||
6px -6px 0 -4px
|
||||
}
|
||||
|
||||
.gg-arrows-expand-right-alt::after,
|
||||
.gg-arrows-expand-right-alt::before {
|
||||
content: "";
|
||||
display: block;
|
||||
box-sizing: border-box;
|
||||
position: absolute;
|
||||
transform: rotate(45deg)
|
||||
}
|
||||
|
||||
.gg-arrows-expand-right-alt::before {
|
||||
width: 2px;
|
||||
height: 22px;
|
||||
top: -4px;
|
||||
left: 6px;
|
||||
border-top: 9px solid;
|
||||
border-bottom: 9px solid
|
||||
}
|
||||
|
||||
.gg-arrows-expand-right-alt::after {
|
||||
width: 8px;
|
||||
height: 2px;
|
||||
background: currentColor;
|
||||
top: 6px;
|
||||
left: 3px
|
||||
}
|
||||
|
|
@ -1,26 +0,0 @@
|
|||
.gg-arrows-expand-right {
|
||||
box-sizing: border-box;
|
||||
position: relative;
|
||||
display: block;
|
||||
transform: scale(var(--ggs,1));
|
||||
width: 14px;
|
||||
height: 14px;
|
||||
margin: 2px;
|
||||
box-shadow:
|
||||
-6px 6px 0 -4px,
|
||||
6px -6px 0 -4px
|
||||
}
|
||||
|
||||
.gg-arrows-expand-right::before {
|
||||
content: "";
|
||||
display: block;
|
||||
box-sizing: border-box;
|
||||
position: absolute;
|
||||
width: 2px;
|
||||
height: 22px;
|
||||
top: -4px;
|
||||
left: 6px;
|
||||
transform: rotate(45deg);
|
||||
border-top: 9px solid;
|
||||
border-bottom: 9px solid
|
||||
}
|
||||
|
|
@ -1,36 +0,0 @@
|
|||
.gg-arrows-expand-up-left {
|
||||
box-sizing: border-box;
|
||||
position: relative;
|
||||
display: block;
|
||||
transform: scale(var(--ggs,1));
|
||||
width: 16px;
|
||||
height: 16px;
|
||||
box-shadow: -6px -6px 0 -4px
|
||||
}
|
||||
|
||||
.gg-arrows-expand-up-left::before {
|
||||
content: "";
|
||||
display: block;
|
||||
box-sizing: border-box;
|
||||
position: absolute;
|
||||
width: 8px;
|
||||
height: 8px;
|
||||
border: 2px solid;
|
||||
border-radius: 1px;
|
||||
right: 0;
|
||||
bottom: 0
|
||||
}
|
||||
|
||||
.gg-arrows-expand-up-left::after {
|
||||
content: "";
|
||||
display: block;
|
||||
box-sizing: border-box;
|
||||
position: absolute;
|
||||
background: currentColor;
|
||||
width: 2px;
|
||||
height: 10px;
|
||||
transform: rotate(-45deg);
|
||||
bottom: 8px;
|
||||
left: 2px;
|
||||
border-radius: 4px
|
||||
}
|
||||
|
|
@ -1,36 +0,0 @@
|
|||
.gg-arrows-expand-up-right {
|
||||
box-sizing: border-box;
|
||||
position: relative;
|
||||
display: block;
|
||||
transform: scale(var(--ggs,1));
|
||||
width: 16px;
|
||||
height: 16px;
|
||||
box-shadow: 6px -6px 0 -4px
|
||||
}
|
||||
|
||||
.gg-arrows-expand-up-right::before {
|
||||
content: "";
|
||||
display: block;
|
||||
box-sizing: border-box;
|
||||
position: absolute;
|
||||
width: 8px;
|
||||
height: 8px;
|
||||
border: 2px solid;
|
||||
border-radius: 1px;
|
||||
left: 0;
|
||||
bottom: 0
|
||||
}
|
||||
|
||||
.gg-arrows-expand-up-right::after {
|
||||
content: "";
|
||||
display: block;
|
||||
box-sizing: border-box;
|
||||
position: absolute;
|
||||
background: currentColor;
|
||||
width: 2px;
|
||||
height: 10px;
|
||||
transform: rotate(45deg);
|
||||
bottom: 8px;
|
||||
right: 2px;
|
||||
border-radius: 4px
|
||||
}
|
||||
|
|
@ -1,34 +0,0 @@
|
|||
.gg-arrows-h-alt {
|
||||
box-sizing: border-box;
|
||||
position: relative;
|
||||
display: block;
|
||||
transform: scale(var(--ggs,1));
|
||||
width: 20px;
|
||||
height: 10px;
|
||||
background:
|
||||
linear-gradient(
|
||||
to left,
|
||||
currentColor 18px,transparent 0)
|
||||
no-repeat 2px 4px/16px 2px
|
||||
}
|
||||
.gg-arrows-h-alt::after,
|
||||
.gg-arrows-h-alt::before {
|
||||
content: "";
|
||||
display: block;
|
||||
box-sizing: border-box;
|
||||
position: absolute;
|
||||
width: 6px;
|
||||
height: 6px;
|
||||
transform: rotate(45deg);
|
||||
top: 2px
|
||||
}
|
||||
.gg-arrows-h-alt::after {
|
||||
border-bottom: 2px solid;
|
||||
border-left: 2px solid;
|
||||
left: 1px
|
||||
}
|
||||
.gg-arrows-h-alt::before {
|
||||
border-top: 2px solid;
|
||||
border-right: 2px solid;
|
||||
right: 1px
|
||||
}
|
||||
|
|
@ -1,38 +0,0 @@
|
|||
.gg-arrows-h {
|
||||
box-sizing: border-box;
|
||||
position: relative;
|
||||
display: block;
|
||||
transform: scale(var(--ggs,1));
|
||||
width: 20px;
|
||||
height: 10px;
|
||||
background:
|
||||
linear-gradient(
|
||||
to left,
|
||||
currentColor 15px,transparent 0)
|
||||
no-repeat 2px 4px/6px 2px,
|
||||
linear-gradient(
|
||||
to left,
|
||||
currentColor 15px,transparent 0)
|
||||
no-repeat 12px 4px/6px 2px
|
||||
}
|
||||
.gg-arrows-h::after,
|
||||
.gg-arrows-h::before {
|
||||
content: "";
|
||||
display: block;
|
||||
box-sizing: border-box;
|
||||
position: absolute;
|
||||
width: 6px;
|
||||
height: 6px;
|
||||
transform: rotate(45deg);
|
||||
top: 2px
|
||||
}
|
||||
.gg-arrows-h::after {
|
||||
border-bottom: 2px solid;
|
||||
border-left: 2px solid;
|
||||
left: 1px
|
||||
}
|
||||
.gg-arrows-h::before {
|
||||
border-top: 2px solid;
|
||||
border-right: 2px solid;
|
||||
right: 1px
|
||||
}
|
||||
|
|
@ -1,46 +0,0 @@
|
|||
.gg-arrows-merge-alt-h {
|
||||
box-sizing: border-box;
|
||||
position: relative;
|
||||
display: block;
|
||||
transform: scale(var(--ggs,1));
|
||||
width: 22px;
|
||||
height: 12px;
|
||||
background:
|
||||
linear-gradient(
|
||||
to left,currentColor 12px,
|
||||
transparent 0)
|
||||
no-repeat center left/8px 2px,
|
||||
linear-gradient(
|
||||
to left,currentColor 12px,
|
||||
transparent 0)
|
||||
no-repeat center right/8px 2px,
|
||||
linear-gradient(
|
||||
to left,currentColor 12px,
|
||||
transparent 0)
|
||||
no-repeat 20px center/2px 12px,
|
||||
linear-gradient(
|
||||
to left,currentColor 12px,
|
||||
transparent 0)
|
||||
no-repeat 0 center/2px 12px
|
||||
}
|
||||
.gg-arrows-merge-alt-h::after,
|
||||
.gg-arrows-merge-alt-h::before {
|
||||
content: "";
|
||||
display: block;
|
||||
box-sizing: border-box;
|
||||
position: absolute;
|
||||
width: 6px;
|
||||
height: 6px;
|
||||
transform: rotate(45deg);
|
||||
top: 3px
|
||||
}
|
||||
.gg-arrows-merge-alt-h::after {
|
||||
border-left: 2px solid;
|
||||
border-bottom: 2px solid;
|
||||
right: 3px;
|
||||
}
|
||||
.gg-arrows-merge-alt-h::before {
|
||||
border-right: 2px solid;
|
||||
border-top: 2px solid;
|
||||
left: 3px
|
||||
}
|
||||
|
|
@ -1,46 +0,0 @@
|
|||
.gg-arrows-merge-alt-v {
|
||||
box-sizing: border-box;
|
||||
position: relative;
|
||||
display: block;
|
||||
transform: scale(var(--ggs,1));
|
||||
width: 12px;
|
||||
height: 22px;
|
||||
background:
|
||||
linear-gradient(
|
||||
to left,currentColor 10px,
|
||||
transparent 0)
|
||||
no-repeat center top/2px 8px,
|
||||
linear-gradient(
|
||||
to left,currentColor 10px,
|
||||
transparent 0)
|
||||
no-repeat center bottom/2px 8px,
|
||||
linear-gradient(
|
||||
to left,currentColor 10px,
|
||||
transparent 0)
|
||||
no-repeat center 20px/10px 2px,
|
||||
linear-gradient(
|
||||
to left,currentColor 10px,
|
||||
transparent 0)
|
||||
no-repeat center 0/10px 2px
|
||||
}
|
||||
.gg-arrows-merge-alt-v::after,
|
||||
.gg-arrows-merge-alt-v::before {
|
||||
content: "";
|
||||
display: block;
|
||||
box-sizing: border-box;
|
||||
position: absolute;
|
||||
width: 6px;
|
||||
height: 6px;
|
||||
transform: rotate(45deg);
|
||||
left: 3px
|
||||
}
|
||||
.gg-arrows-merge-alt-v::after {
|
||||
border-left: 2px solid;
|
||||
border-top: 2px solid;
|
||||
bottom: 3px;
|
||||
}
|
||||
.gg-arrows-merge-alt-v::before {
|
||||
border-right: 2px solid;
|
||||
border-bottom: 2px solid;
|
||||
top: 3px
|
||||
}
|
||||
|
|
@ -1,31 +0,0 @@
|
|||
.gg-arrows-scroll-h {
|
||||
box-sizing: border-box;
|
||||
position: relative;
|
||||
display: block;
|
||||
transform: scale(var(--ggs,1));
|
||||
width: 16px;
|
||||
height: 6px
|
||||
}
|
||||
|
||||
.gg-arrows-scroll-h::after,
|
||||
.gg-arrows-scroll-h::before {
|
||||
content: "";
|
||||
display: block;
|
||||
box-sizing: border-box;
|
||||
position: absolute;
|
||||
width: 6px;
|
||||
height: 6px;
|
||||
transform: rotate(45deg)
|
||||
}
|
||||
|
||||
.gg-arrows-scroll-h::after {
|
||||
border-bottom: 2px solid;
|
||||
border-left: 2px solid;
|
||||
right: 0
|
||||
}
|
||||
|
||||
.gg-arrows-scroll-h::before {
|
||||
border-top: 2px solid;
|
||||
border-right: 2px solid;
|
||||
left: 0
|
||||
}
|
||||
|
|
@ -1,30 +0,0 @@
|
|||
.gg-arrows-scroll-v {
|
||||
box-sizing: border-box;
|
||||
position: relative;
|
||||
display: block;
|
||||
transform: scale(var(--ggs,1));
|
||||
width: 6px;
|
||||
height: 16px
|
||||
}
|
||||
|
||||
.gg-arrows-scroll-v::after,
|
||||
.gg-arrows-scroll-v::before {
|
||||
content: "";
|
||||
display: block;
|
||||
box-sizing: border-box;
|
||||
position: absolute;
|
||||
width: 6px;
|
||||
height: 6px;
|
||||
transform: rotate(-45deg)
|
||||
}
|
||||
|
||||
.gg-arrows-scroll-v::after {
|
||||
border-bottom: 2px solid;
|
||||
border-left: 2px solid
|
||||
}
|
||||
|
||||
.gg-arrows-scroll-v::before {
|
||||
border-top: 2px solid;
|
||||
border-right: 2px solid;
|
||||
bottom: 0
|
||||
}
|
||||
|
|
@ -1,42 +0,0 @@
|
|||
.gg-arrows-shrink-h {
|
||||
box-sizing: border-box;
|
||||
position: relative;
|
||||
display: block;
|
||||
transform: scale(var(--ggs,1));
|
||||
width: 20px;
|
||||
height: 10px;
|
||||
background:
|
||||
linear-gradient(
|
||||
to left,currentColor 10px,
|
||||
transparent 0)
|
||||
no-repeat center center/10px 2px,
|
||||
linear-gradient(
|
||||
to left,currentColor 10px,
|
||||
transparent 0)
|
||||
no-repeat 18px center/2px 10px,
|
||||
linear-gradient(
|
||||
to left,currentColor 10px,
|
||||
transparent 0)
|
||||
no-repeat 0px center/2px 10px
|
||||
}
|
||||
.gg-arrows-shrink-h::after,
|
||||
.gg-arrows-shrink-h::before {
|
||||
content: "";
|
||||
display: block;
|
||||
box-sizing: border-box;
|
||||
position: absolute;
|
||||
width: 6px;
|
||||
height: 6px;
|
||||
transform: rotate(45deg);
|
||||
top: 2px
|
||||
}
|
||||
.gg-arrows-shrink-h::after {
|
||||
border-left: 2px solid;
|
||||
border-bottom: 2px solid;
|
||||
left: 4px;
|
||||
}
|
||||
.gg-arrows-shrink-h::before {
|
||||
border-right: 2px solid;
|
||||
border-top: 2px solid;
|
||||
right: 4px
|
||||
}
|
||||
|
|
@ -1,42 +0,0 @@
|
|||
.gg-arrows-shrink-v {
|
||||
box-sizing: border-box;
|
||||
position: relative;
|
||||
display: block;
|
||||
transform: scale(var(--ggs,1));
|
||||
width: 10px;
|
||||
height: 20px;
|
||||
background:
|
||||
linear-gradient(
|
||||
to left,currentColor 10px,
|
||||
transparent 0)
|
||||
no-repeat center center/2px 10px,
|
||||
linear-gradient(
|
||||
to left,currentColor 10px,
|
||||
transparent 0)
|
||||
no-repeat center 18px/10px 2px,
|
||||
linear-gradient(
|
||||
to left,currentColor 10px,
|
||||
transparent 0)
|
||||
no-repeat center 0/10px 2px
|
||||
}
|
||||
.gg-arrows-shrink-v::after,
|
||||
.gg-arrows-shrink-v::before {
|
||||
content: "";
|
||||
display: block;
|
||||
box-sizing: border-box;
|
||||
position: absolute;
|
||||
width: 6px;
|
||||
height: 6px;
|
||||
transform: rotate(45deg);
|
||||
left: 2px
|
||||
}
|
||||
.gg-arrows-shrink-v::after {
|
||||
border-left: 2px solid;
|
||||
border-top: 2px solid;
|
||||
top: 4px;
|
||||
}
|
||||
.gg-arrows-shrink-v::before {
|
||||
border-right: 2px solid;
|
||||
border-bottom: 2px solid;
|
||||
bottom: 4px
|
||||
}
|
||||
|
|
@ -1,34 +0,0 @@
|
|||
.gg-arrows-v-alt {
|
||||
box-sizing: border-box;
|
||||
position: relative;
|
||||
display: block;
|
||||
transform: scale(var(--ggs,1));
|
||||
width: 10px;
|
||||
height: 20px;
|
||||
background:
|
||||
linear-gradient(
|
||||
to left,
|
||||
currentColor 16px,transparent 0)
|
||||
no-repeat 4px 2px/2px 16px
|
||||
}
|
||||
.gg-arrows-v-alt::after,
|
||||
.gg-arrows-v-alt::before {
|
||||
content: "";
|
||||
display: block;
|
||||
box-sizing: border-box;
|
||||
position: absolute;
|
||||
width: 6px;
|
||||
height: 6px;
|
||||
transform: rotate(-45deg);
|
||||
left: 2px
|
||||
}
|
||||
.gg-arrows-v-alt::after {
|
||||
border-bottom: 2px solid;
|
||||
border-left: 2px solid;
|
||||
bottom: 1px
|
||||
}
|
||||
.gg-arrows-v-alt::before {
|
||||
border-top: 2px solid;
|
||||
border-right: 2px solid;
|
||||
top: 1px
|
||||
}
|
||||
|
|
@ -1,38 +0,0 @@
|
|||
.gg-arrows-v {
|
||||
box-sizing: border-box;
|
||||
position: relative;
|
||||
display: block;
|
||||
transform: scale(var(--ggs,1));
|
||||
width: 10px;
|
||||
height: 20px;
|
||||
background:
|
||||
linear-gradient(
|
||||
to left,
|
||||
currentColor 15px,transparent 0)
|
||||
no-repeat 4px 2px/2px 6px,
|
||||
linear-gradient(
|
||||
to left,
|
||||
currentColor 15px,transparent 0)
|
||||
no-repeat 4px 12px/2px 6px
|
||||
}
|
||||
.gg-arrows-v::after,
|
||||
.gg-arrows-v::before {
|
||||
content: "";
|
||||
display: block;
|
||||
box-sizing: border-box;
|
||||
position: absolute;
|
||||
width: 6px;
|
||||
height: 6px;
|
||||
transform: rotate(-45deg);
|
||||
left: 2px
|
||||
}
|
||||
.gg-arrows-v::after {
|
||||
border-bottom: 2px solid;
|
||||
border-left: 2px solid;
|
||||
bottom: 1px
|
||||
}
|
||||
.gg-arrows-v::before {
|
||||
border-top: 2px solid;
|
||||
border-right: 2px solid;
|
||||
top: 1px
|
||||
}
|
||||
|
|
@ -1,26 +0,0 @@
|
|||
.gg-assign {
|
||||
box-sizing: border-box;
|
||||
position: relative;
|
||||
display: block;
|
||||
width: 6px;
|
||||
height: 6px;
|
||||
background: currentColor;
|
||||
transform: scale(var(--ggs,1));
|
||||
border-radius: 100px
|
||||
}
|
||||
|
||||
.gg-assign::before {
|
||||
content: "";
|
||||
display: block;
|
||||
box-sizing: border-box;
|
||||
position: absolute;
|
||||
width: 12px;
|
||||
height: 12px;
|
||||
box-shadow:
|
||||
-5px -5px 0 -3px,
|
||||
5px 5px 0 -3px,
|
||||
5px -5px 0 -3px,
|
||||
-5px 5px 0 -3px;
|
||||
left: -3px;
|
||||
top: -3px
|
||||
}
|
||||
|
|
@ -1,27 +0,0 @@
|
|||
.gg-asterisk {
|
||||
box-sizing: border-box;
|
||||
position: relative;
|
||||
display: block;
|
||||
transform: scale(var(--ggs,1));
|
||||
width: 12px;
|
||||
height: 12px;
|
||||
border-left: 5px solid transparent;
|
||||
border-right: 5px solid transparent;
|
||||
box-shadow: inset 0 0 0 2px
|
||||
}
|
||||
|
||||
.gg-asterisk::after,
|
||||
.gg-asterisk::before {
|
||||
content: "";
|
||||
display: block;
|
||||
position: absolute;
|
||||
box-sizing: border-box;
|
||||
width: 2px;
|
||||
height: 12px;
|
||||
background: currentColor;
|
||||
transform: rotate(55deg)
|
||||
}
|
||||
|
||||
.gg-asterisk::after {
|
||||
transform: rotate(-55deg)
|
||||
}
|
||||
|
|
@ -1,37 +0,0 @@
|
|||
.gg-atlasian {
|
||||
position: relative;
|
||||
box-sizing: border-box;
|
||||
display: block;
|
||||
width: 22px;
|
||||
height: 18px;
|
||||
transform: scale(var(--ggs,1));
|
||||
overflow: hidden
|
||||
}
|
||||
|
||||
.gg-atlasian::after,
|
||||
.gg-atlasian::before {
|
||||
content: "";
|
||||
display: block;
|
||||
box-sizing: border-box;
|
||||
position: absolute;
|
||||
width: 6px;
|
||||
background: currentColor;
|
||||
border-radius: 4px
|
||||
}
|
||||
|
||||
.gg-atlasian::before {
|
||||
height: 12px;
|
||||
border-top-right-radius: 10px;
|
||||
bottom: -4px;
|
||||
left: 3px;
|
||||
transform: rotate(30deg) skewY(35deg);
|
||||
opacity: .8
|
||||
}
|
||||
|
||||
.gg-atlasian::after {
|
||||
height: 24px;
|
||||
border-top-left-radius: 10px;
|
||||
bottom: -8px;
|
||||
right: 3px;
|
||||
transform: rotate(-30deg) skewY(-35deg)
|
||||
}
|
||||
|
|
@ -1,43 +0,0 @@
|
|||
.gg-attachment {
|
||||
box-sizing: border-box;
|
||||
position: relative;
|
||||
display: block;
|
||||
width: 14px;
|
||||
height: 14px;
|
||||
border: 2px solid;
|
||||
border-top: 0;
|
||||
border-bottom-left-radius: 100px;
|
||||
border-bottom-right-radius: 100px;
|
||||
transform: scale(var(--ggs,1));
|
||||
margin-top: 11px
|
||||
}
|
||||
|
||||
.gg-attachment::after,
|
||||
.gg-attachment::before {
|
||||
content: "";
|
||||
display: block;
|
||||
box-sizing: border-box;
|
||||
position: absolute;
|
||||
border-radius: 3px;
|
||||
border: 2px solid
|
||||
}
|
||||
|
||||
.gg-attachment::after {
|
||||
border-bottom: 0;
|
||||
border-top-left-radius: 100px;
|
||||
border-top-right-radius: 100px;
|
||||
right: -2px;
|
||||
width: 10px;
|
||||
height: 14px;
|
||||
bottom: 8px
|
||||
}
|
||||
|
||||
.gg-attachment::before {
|
||||
width: 6px;
|
||||
height: 12px;
|
||||
border-top: 0;
|
||||
border-bottom-left-radius: 100px;
|
||||
border-bottom-right-radius: 100px;
|
||||
left: 2px;
|
||||
bottom: 4px
|
||||
}
|
||||
|
|
@ -1,55 +0,0 @@
|
|||
.gg-attribution {
|
||||
display: block;
|
||||
box-sizing: border-box;
|
||||
transform: scale(var(--ggs,1));
|
||||
width: 16px;
|
||||
height: 18px;
|
||||
background:
|
||||
linear-gradient(
|
||||
to left,
|
||||
currentColor 14px,
|
||||
transparent 0
|
||||
) no-repeat 1px 2px/8px 2px,
|
||||
linear-gradient(
|
||||
to left,
|
||||
currentColor 14px,
|
||||
transparent 0
|
||||
) no-repeat 6px 14px/6px 2px,
|
||||
radial-gradient(
|
||||
circle,
|
||||
currentColor 60%,
|
||||
transparent 40%
|
||||
) no-repeat 10px 12px/6px 6px,
|
||||
radial-gradient(
|
||||
circle,
|
||||
currentColor 60%,
|
||||
transparent 40%
|
||||
) no-repeat 0 0/6px 6px
|
||||
}
|
||||
|
||||
.gg-attribution::after,
|
||||
.gg-attribution::before {
|
||||
content: "";
|
||||
display: block;
|
||||
box-sizing: border-box;
|
||||
position: absolute;
|
||||
width: 8px;
|
||||
height: 8px;
|
||||
border: 2px solid
|
||||
}
|
||||
|
||||
.gg-attribution::before {
|
||||
border-right: 0;
|
||||
border-top-left-radius: 10px;
|
||||
border-bottom-left-radius: 10px;
|
||||
top: 8px;
|
||||
left: 2px
|
||||
}
|
||||
|
||||
.gg-attribution::after {
|
||||
border-left: 0;
|
||||
border-top-right-radius: 10px;
|
||||
border-bottom-right-radius: 10px;
|
||||
right: 2px;
|
||||
top: 2px
|
||||
}
|
||||
|
|
@ -1,43 +0,0 @@
|
|||
.gg-awards {
|
||||
display: block;
|
||||
position: relative;
|
||||
transform: scale(var(--ggs,1));
|
||||
box-sizing: border-box;
|
||||
width: 16px;
|
||||
height: 20px;
|
||||
border: 4px solid transparent;
|
||||
border-top: 12px solid transparent;
|
||||
border-bottom: 0;
|
||||
box-shadow:
|
||||
inset 4px 0 0 -2px,
|
||||
inset -4px 0 0 -2px
|
||||
}
|
||||
|
||||
.gg-awards::after,
|
||||
.gg-awards::before {
|
||||
content: "";
|
||||
box-sizing: border-box;
|
||||
position: absolute;
|
||||
display: block;
|
||||
border: 2px solid
|
||||
}
|
||||
|
||||
.gg-awards::before {
|
||||
width: 14px;
|
||||
height: 14px;
|
||||
border-radius: 22px;
|
||||
top: -12px;
|
||||
left: -3px
|
||||
}
|
||||
|
||||
.gg-awards::after {
|
||||
width: 6px;
|
||||
height: 6px;
|
||||
border-right-color: transparent;
|
||||
border-bottom-color: transparent;
|
||||
border-bottom-left-radius: 1px;
|
||||
border-top-right-radius: 1px;
|
||||
transform: rotate(45deg);
|
||||
bottom: -3px;
|
||||
left: 1px
|
||||
}
|
||||
|
|
@ -1,46 +0,0 @@
|
|||
.gg-backspace {
|
||||
box-sizing: border-box;
|
||||
position: relative;
|
||||
display: block;
|
||||
width: 14px;
|
||||
height: 14px;
|
||||
transform: scale(var(--ggs,1));
|
||||
border: 2px solid;
|
||||
border-left: 0;
|
||||
border-top-right-radius: 2px;
|
||||
border-bottom-right-radius: 2px
|
||||
}
|
||||
|
||||
.gg-backspace::after,
|
||||
.gg-backspace::before {
|
||||
content: "";
|
||||
display: block;
|
||||
box-sizing: border-box;
|
||||
position: absolute
|
||||
}
|
||||
|
||||
.gg-backspace::before {
|
||||
background:
|
||||
linear-gradient( to left,
|
||||
currentColor 18px,transparent 0)
|
||||
no-repeat center center/10px 2px;
|
||||
border-right: 3px solid transparent;
|
||||
box-shadow: inset 0 0 0 2px;
|
||||
right: 2px;
|
||||
bottom: 1px;
|
||||
width: 8px;
|
||||
height: 8px;
|
||||
border-left: 3px solid transparent;
|
||||
transform: rotate(45deg)
|
||||
}
|
||||
|
||||
.gg-backspace::after {
|
||||
width: 10px;
|
||||
height: 10px;
|
||||
border-top: 2px solid;
|
||||
border-left: 2px solid;
|
||||
border-top-left-radius: 1px;
|
||||
transform: rotate(-45deg);
|
||||
top: 0;
|
||||
left: -5px
|
||||
}
|
||||
|
|
@ -1,42 +0,0 @@
|
|||
.gg-band-aid {
|
||||
box-sizing: border-box;
|
||||
position: relative;
|
||||
display: block;
|
||||
transform:
|
||||
rotate(-25deg)
|
||||
scale(var(--ggs,1));
|
||||
width: 24px;
|
||||
height: 12px;
|
||||
border: 2px solid;
|
||||
border-radius: 22px
|
||||
}
|
||||
|
||||
.gg-band-aid::after,
|
||||
.gg-band-aid::before {
|
||||
content: "";
|
||||
display: block;
|
||||
box-sizing: border-box;
|
||||
position: absolute
|
||||
}
|
||||
|
||||
.gg-band-aid::before {
|
||||
width: 12px;
|
||||
height: 10px;
|
||||
top: -2px;
|
||||
left: 4px;
|
||||
border-left: 2px solid;
|
||||
border-right: 2px solid
|
||||
}
|
||||
|
||||
.gg-band-aid::after {
|
||||
width: 2px;
|
||||
height: 2px;
|
||||
background: currentColor;
|
||||
box-shadow:
|
||||
0 4px 0,
|
||||
4px 0 0,
|
||||
4px 4px 0;
|
||||
border-radius: 22px;
|
||||
left: 7px;
|
||||
top: 1px
|
||||
}
|
||||
|
|
@ -1,24 +0,0 @@
|
|||
.gg-battery-empty {
|
||||
box-sizing: border-box;
|
||||
position: relative;
|
||||
display: block;
|
||||
width: 20px;
|
||||
height: 12px;
|
||||
transform: scale(var(--ggs,1));
|
||||
border: 2px solid;
|
||||
border-radius: 3px;
|
||||
margin-left: -3px
|
||||
}
|
||||
|
||||
.gg-battery-empty::before {
|
||||
content: "";
|
||||
display: block;
|
||||
box-sizing: border-box;
|
||||
position: absolute;
|
||||
border-radius: 3px;
|
||||
width: 4px;
|
||||
height: 6px;
|
||||
right: -4px;
|
||||
top: 1px;
|
||||
background: currentColor
|
||||
}
|
||||
|
|
@ -1,33 +0,0 @@
|
|||
.gg-battery-full {
|
||||
box-sizing: border-box;
|
||||
position: relative;
|
||||
display: block;
|
||||
width: 20px;
|
||||
height: 12px;
|
||||
transform: scale(var(--ggs,1));
|
||||
border: 2px solid;
|
||||
border-radius: 3px;
|
||||
margin-left: -3px
|
||||
}
|
||||
|
||||
.gg-battery-full::after,
|
||||
.gg-battery-full::before {
|
||||
content: "";
|
||||
display: block;
|
||||
box-sizing: border-box;
|
||||
position: absolute;
|
||||
height: 6px;
|
||||
background: currentColor;
|
||||
top: 1px
|
||||
}
|
||||
|
||||
.gg-battery-full::before {
|
||||
right: -4px;
|
||||
border-radius: 3px;
|
||||
width: 4px
|
||||
}
|
||||
|
||||
.gg-battery-full::after {
|
||||
width: 14px;
|
||||
left: 1px
|
||||
}
|
||||
Some files were not shown because too many files have changed in this diff Show More
Loading…
Reference in New Issue