52 lines
1.3 KiB
Markdown
52 lines
1.3 KiB
Markdown
---
|
||
title: "Pure CSS icons for my Gitea theme"
|
||
author: ""
|
||
date: 2020-10-05T12:14:51+02:00
|
||
categories:
|
||
- gitea-theme
|
||
tags:
|
||
- webdesign
|
||
- code
|
||
|
||
draft: false
|
||
description: "I added two icons to my Gitea theme that I’ve created purely with CSS."
|
||
---
|
||
|
||
**Update (2021-02-28):** The code is no longer in use due to changes to Gitea.
|
||
|
||
I'm working on my gitea theme and just added a `$nojavascript` alternative for two icons with pure css. :)
|
||
|
||
|
||
|
||
# The Code
|
||
|
||
```scss
|
||
.svg {
|
||
&.octicon-file-directory,
|
||
&.octicon-file-submodule {
|
||
fill: rgb(255, 130, 130);
|
||
@if $nojavascript == true {
|
||
background: rgb(255, 130, 130);
|
||
border-radius: 0 1px 2px 2px;
|
||
box-shadow: -4px -7px 0px -4px rgb(255, 130, 130);
|
||
height: 10px;
|
||
margin-left: 5px !important;
|
||
margin-top: 4px;
|
||
width: 14px;
|
||
}
|
||
}
|
||
&.octicon-file {
|
||
fill: rgb(215, 215, 225);
|
||
@if $nojavascript == true {
|
||
border: 1px solid rgb(215, 215, 225);
|
||
border-radius: 0 5px 0 0;
|
||
height: 13px;
|
||
margin-left: 7px !important;
|
||
margin-right: 6px !important;
|
||
width: 10px;
|
||
}
|
||
}
|
||
}
|
||
```
|
||
|
||
~~A live version can be found on [code.cozy.town](https://code.cozy.town/vrifox/gitea-theme).~~
|