fergalmoran/buttcord
1
0
Fork 0
mirror of https://github.com/fergalmoran/buttcord.git synced 2026-01-06 16:57:12 +00:00
Code Issues Packages Projects Releases Wiki Activity

Fixed up sidebar and added animation transitions

Browse Source
This commit is contained in:
Fergal Moran
2021-03-01 20:16:39 +00:00
parent 39340da5a0
commit b299042f9d
2 changed files with 27 additions and 10 deletions
Download Patch File Download Diff File Expand all files Collapse all files

33
static/style.css
View File

@@ -1,14 +1,33 @@
.circle-icon { .circle-icon {
background-color: #d1e6a1;
color: #e07969;
padding: 30px; padding: 30px;
border-radius: 50%; border-radius: 50%;
transition: 0.3s;
} }
.circle-icon:hover {
.pink-icon { border-radius: 15%;
} }
.list-group-item {
.orange-icon { background-color: transparent;
background: #ffcfc0; transition: 0.5s;
} }
.blue-icon { .list-group-item:hover {
border-left: blueviolet;
border-left-style: groove;
}
#buttons-pane {
background-color: #202225;
}
#channels-pane {
background-color: #2f3136;
color: white;
}
#main-pane {
background-color: #36393f;
color: white;
}
#friends-pane {
background-color: #2f3136;
color: white;
} }

4
templates/index.html
View File

@@ -3,8 +3,7 @@
<div class="container-fluid"> <div class="container-fluid">
<div class="row h-100"> <div class="row h-100">
<div id="buttons-pane" <div id="buttons-pane"
class="col-1 bg-dark pt-3"> class="col-1 pt-3">
<ul class="list-group"> <ul class="list-group">
<li class="list-group-item d-flex justify-content align-items-center"> <li class="list-group-item d-flex justify-content align-items-center">
<i class="fas fa-ambulance circle-icon pink-icon"></i> <i class="fas fa-ambulance circle-icon pink-icon"></i>
@@ -16,7 +15,6 @@
<i class="fas fa-ban circle-icon blue-icon"></i> <i class="fas fa-ban circle-icon blue-icon"></i>
</li> </li>
</ul> </ul>
</div> </div>
<div id="channels-pane" <div id="channels-pane"
class="col-2"> class="col-2">