DAV-KA/django-dav-events
1
0
Fork 0
Code Issues 24 Pull Requests Actions Releases Wiki Activity

dav_base css: add colorful universal buttons and colored sport specific

Browse Source 
buttons
This commit is contained in:
heinzel
2023-02-19 19:21:23 +01:00
parent b95b33f995
commit 9abde3ca18
1 changed files with 200 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

200
dav_base/static/dav_base/css/local.css
View File

@@ -1,3 +1,19 @@
/*
* Colors
* color text focus bg focus btn focus border focus active function
* orange #f07d00 #bd6200 #f07d00 #bd6200 #f07d00 #bd6200 #d77000 #572d00 #995000 primary
* green #3c763d #2b542c #dff0d8 #c1e2b3 #58ab27 #43811e #4d9622 #182e0b #346417 success
* blue #31708f #245269 #d9edf7 #afd9ee #1d70b7 #16558b #1a63a1 #081f33 #11426c info
* yellow #8a6d3b #66512c #fcf8e3 #f7ecb5 #f9b000 #c68c00 #e09e00 #604400 #a27300 warning, Klettern
* red #a94442 #843534 #f2dede #e4b9b9 #be1621 #901119 #a7131d #350609 #700d14 danger
* mandarin #b43a12 #902c0e #f0ded8 #e1bcb0 #e84e1b #b43a12 #aa3711 #3c1306 #78250c
* lime #859201 #656e01 #eef0d8 #dde1b0 #bccf07 #859201 #7c8801 #2e3200 #4f5601 Bergsteigen
* cyan #54bbd9 #469db5 #d8ebf0 #a7d5e1 #86cfe4 #54bbd9 #4cb8d7 #17343c #3a8ea5 Ski
* caramel #9c5b22 #78461a #f0e3d8 #e1c6b0 #ce792d #9c5b22 #935720 #3c230d #613915 Wanderung
* purple #866dac #566088 #e1d8f0 #c2b0e1 #a694c2 #866dac #8067a8 #2f263c #5a4876 Mountainbike
* brown ??? ??? ??? ??? #925f36 ??? ??? ??? ???
*/
/*
* General elements
*/
@@ -256,3 +272,187 @@ thead input {
border-color: #aa3711;
color: #fff;
}
/*
* Elements for sport categories
*/
/*
* Bergsteigen: lime
*/
.btn-sport-B {
background-color: #bccf07;
border-color: #7c8801;
color: #fff;
}
.btn-sport-B.focus, .btn-sport-B:focus, .btn-sport-B:hover {
background-color: #859201;
border-color: #2e3200;
color: #fff;
}
/*
* Klettern: yellow
*/
.btn-sport-K {
background-color: #f9b000;
border-color: #e09e00;
color: #fff;
}
.btn-sport-K.focus, .btn-sport-K:focus, .btn-sport-K:hover {
background-color: #c68c00;
border-color: #604400;
color: #fff;
}
/*
* Mountainbike: purple
*/
.btn-sport-M {
background-color: #a694c2;
border-color: #8067a8;
color: #fff;
}
.btn-sport-M.focus, .btn-sport-M:focus, .btn-sport-M:hover {
background-color: #866dac;
border-color: #2f263c;
color: #fff;
}
/*
* Ski: cyan
*/
.btn-sport-S {
background-color: #86cfe4;
border-color: #4cb8d7;
color: #fff;
}
.btn-sport-S.focus, .btn-sport-S:focus, .btn-sport-S:hover {
background-color: #54bbd9;
border-color: #17343c;
color: #fff;
}
/*
* Wanderung: caramel
*/
.btn-sport-W {
background-color: #ce792d;
border-color: #935720;
color: #fff;
}
.btn-sport-W.focus, .btn-sport-W:focus, .btn-sport-W:hover {
background-color: #9c5b22;
border-color: #3c230d;
color: #fff;
}
/*
* Universal Buttons
*/
.btn-orange {
background-color: #f07d00;
border-color: #d77000;
color: #fff;
}
.btn-orange.focus, .btn-orange:focus, .btn-orange:hover {
background-color: #bd6200;
border-color: #572d00;
color: #fff;
}
.btn-green {
background-color: #58ab27;
border-color: #4d9622;
color: #fff;
}
.btn-green.focus, .btn-green:focus, .btn-green:hover {
background-color: #43811e;
border-color: #182e0b;
color: #fff;
}
.btn-blue {
background-color: #1d70b7;
border-color: #1a63a1;
color: #fff;
}
.btn-blue.focus, .btn-blue:focus, .btn-blue:hover {
background-color: #16558b;
border-color: #081f33;
color: #fff;
}
.btn-yellow {
background-color: #f9b000;
border-color: #e09e00;
color: #fff;
}
.btn-yellow.focus, .btn-yellow:focus, .btn-yellow:hover {
background-color: #c68c00;
border-color: #604400;
color: #fff;
}
.btn-red {
background-color: #be1621;
border-color: #a7131d;
color: #fff;
}
.btn-red.focus, .btn-red:focus, .btn-red:hover {
background-color: #901119;
border-color: #350609;
color: #fff;
}
.btn-mandarin {
background-color: #e84e1b;
border-color: #aa3711;
color: #fff;
}
.btn-mandarin.focus, .btn-mandarin:focus, .btn-mandarin:hover {
background-color: #b43a12;
border-color: #3c1306;
color: #fff;
}
.btn-lime {
background-color: #bccf07;
border-color: #7c8801;
color: #fff;
}
.btn-lime.focus, .btn-lime:focus, .btn-lime:hover {
background-color: #859201;
border-color: #2e3200;
color: #fff;
}
.btn-cyan {
background-color: #86cfe4;
border-color: #4cb8d7;
color: #fff;
}
.btn-cyan.focus, .btn-cyan:focus, .btn-cyan:hover {
background-color: #54bbd9;
border-color: #17343c;
color: #fff;
}
.btn-caramel {
background-color: #ce792d;
border-color: #935720;
color: #fff;
}
.btn-caramel.focus, .btn-caramel:focus, .btn-caramel:hover {
background-color: #9c5b22;
border-color: #3c230d;
color: #fff;
}
.btn-purple {
background-color: #a694c2;
border-color: #8067a8;
color: #fff;
}
.btn-purple.focus, .btn-purple:focus, .btn-purple:hover {
background-color: #866dac;
border-color: #2f263c;
color: #fff;
}
.btn-white {
background-color: #fff;
border-color: #ccc;
color: #333;
}
.btn-white.focus, .btn-white:focus, .btn-white:hover {
background-color: #e6e6e6;
border-color: #8c8c8c;
color: #333;
}