Project

General

Profile

Download (1.09 KB) Statistics
| Branch: | Tag: | Revision:

haketilo / html / back_button.css @ 2bd35bc4

1
/**
2
 * This file is part of Haketilo.
3
 *
4
 * Function: Style for a "back" button with a CSS arrow image.
5
 *
6
 * Copyright (C) 2021 Wojtek Kosior
7
 * Redistribution terms are gathered in the `copyright' file.
8
 */
9

    
10
.back_button {
11
    display: block;
12
    width: auto;
13
    height: auto;
14
    background-color: white;
15
    border: solid #454 0.4em;
16
    border-left: none;
17
    border-radius: 0 1.5em 1.5em 0;
18
    cursor: pointer;
19
}
20

    
21
.back_button:hover {
22
    box-shadow: 0 6px 8px 0 rgba(0,0,0,0.24), 0 17px 50px 0 rgba(0,0,0,0.19);
23
}
24

    
25
.back_button>div, .back_arrow {
26
    width: 2em;
27
    height: 0.5em;
28
    background-color: #4CAF50;
29
    border-radius: 0.3em;
30
    margin: 1.15em 0.4em;
31
}
32

    
33
.back_button>div::after, .back_arrow::after,
34
.back_button>div::before, .back_arrow::before {
35
    content: "";
36
    display: block;
37
    position: relative;
38
    background-color: inherit;
39
    width: 1.3em;
40
    height: 0.5em;
41
    transform: rotate(45deg);
42
    border-radius: 0.3em;
43
    top: 0.3em;
44
    right: 0.2em;
45
    margin: 0 -1.3em -0.5em 0;
46
}
47

    
48
.back_button>div::before, .back_arrow::before {
49
    transform: rotate(-45deg);
50
    top: -0.3em;
51
}
(3-3/14)