intellihack_project/style.css at main · PinsaraPerera/intellihack_project · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
/* [data-testid="stAppViewContainer"]{
    background: rgb(22, 93, 69);
} */
[data-testid="stMarkdownContainer"]{
    color: rgb(220, 202, 202);
}
[kind="secondaryFormSubmit"]{
    background: rgba(138, 130, 130, 0);
    border: 1px solid black;
}
div.css-q8sbsg > p,
div.css-x78sv8 > p {
    font-size: 20px;
    font-weight: 700;
}
div.input{
    background: transparent;
}
/* .st-e5{
    background-color: rgb(41, 126, 20, 0.8);
} */
/* .st-e7{
    background-color: rgb(171, 29, 29, 0.8);
} */
/* .st-dg{
    background-color: rgb(38, 39, 48,0.4);
} */
.joy,.romance,.calm,.power,.sorrow{
    border: 1px white solid;
    padding-top: 10px;
    padding-bottom: 10px;
    border-radius: 10px;
}
.emotion{
    width: 150px;
    height: 150px;
    position: relative;
    align-items: center;
    justify-content: center;
}
.outer{
    height: 110px;
    width: 110px;
    border-radius: 50%;
    padding: 20px;
    box-shadow: 6px 6px 10px -1px rgba(0,0,0,0.15),
                -6px -6px 10px -1px rgba(120, 117, 117, 0.7);

}
.inner{
    height: 105px;
    width: 105px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: inset 4px 4px 6px -1px rgba(0,0,0,0.2),
                inset -4px -4px 6px -1px rgba(255,255,255,0.7),
                -0.5px -0.5px 0px rgba(255,255,255,1),
                0.5px 0.5px 0px rgba(0,0,0,0.15),
                0px 12px 10px -10px rgba(0,0,0,0.05);
}
#number{
    font-weight: 700;
    font-size: 20px;
    color: #ffffff;
}
circle{
    fill: none;
    stroke: url(#GradientColor);
    stroke-width: 20px;
    stroke-dasharray: 425;
    stroke-dashoffset: 425;
    animation: anim 2s linear forwards;
}
.icon{
    position: absolute;
    top: -7px;
    left: -7px;
}
.e1tzin5v2:nth-of-type(18){
    display: flex;
    align-items: center;
    justify-content: center;
}
button:hover{
    background-color: rgb(38, 39, 48,0.4);
}