inital commit
This commit is contained in:
451
webroot/css/member_dashboard.css
Normal file
451
webroot/css/member_dashboard.css
Normal file
@@ -0,0 +1,451 @@
|
||||
/*
|
||||
To change this license header, choose License Headers in Project Properties.
|
||||
To change this template file, choose Tools | Templates
|
||||
and open the template in the editor.
|
||||
*/
|
||||
/*
|
||||
Created on : Jul 10, 2020, 11:12:29 AM
|
||||
Author : CHTL
|
||||
*/
|
||||
|
||||
.btn-blinking-off{
|
||||
background: green !important;
|
||||
}
|
||||
.add-notification{
|
||||
display: none;
|
||||
}
|
||||
|
||||
.bubble-hide{
|
||||
display: none;
|
||||
}
|
||||
|
||||
.notif-icon{
|
||||
padding: 4px;
|
||||
}
|
||||
.notif-icon a{}
|
||||
.notif-icon a i{
|
||||
font-size: 18px;
|
||||
}
|
||||
|
||||
.client-transaction-area{}
|
||||
.client-transaction-area .badge{
|
||||
background-color: #777;
|
||||
}
|
||||
|
||||
|
||||
.client-transaction-area a{
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
.client-transaction-area h3.member-name{
|
||||
text-align: center;
|
||||
font-weight: bold;
|
||||
word-break: break-all;
|
||||
}
|
||||
|
||||
|
||||
.client-transaction-area .transaction-label, .transaction-list-footer{
|
||||
padding: 20px;
|
||||
padding-bottom: 0;
|
||||
padding-left: 10px;
|
||||
padding-right: 0;
|
||||
}
|
||||
|
||||
.client-transaction-area ul.transaction-list{
|
||||
padding-top: 0px;
|
||||
max-height: 250px;
|
||||
border-bottom: 1px solid lightgray;
|
||||
padding-left: 10px;
|
||||
padding-bottom: 0;
|
||||
}
|
||||
|
||||
.client-transaction-area h3.table-head{
|
||||
font-size: initial;
|
||||
padding-left: 0;
|
||||
font-size: 20px;
|
||||
font-weight: bold;
|
||||
|
||||
}
|
||||
.table-head{
|
||||
color: #337ab7;
|
||||
text-align: center;
|
||||
|
||||
}
|
||||
.client-transaction-area .transaction-list-footer{
|
||||
padding-top: 10px;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.mid-container{}
|
||||
.mid-container h4.quick-link{
|
||||
padding-bottom:30px;
|
||||
text-transform: uppercase;
|
||||
font-weight: bold;
|
||||
}
|
||||
.mid-container a.setup-profile-btn{}
|
||||
.mid-container a.mid-btn-link{
|
||||
text-transform: uppercase;
|
||||
font-weight: bold;
|
||||
margin: 0 10px;
|
||||
width: 100%;
|
||||
padding: 6px;
|
||||
|
||||
}
|
||||
|
||||
.mid-container .withborder{
|
||||
border-left: 1px solid lightgray;
|
||||
border-right: 1px solid lightgray;
|
||||
}
|
||||
|
||||
|
||||
.welcome-box-area{
|
||||
margin-top: 40px;
|
||||
border: 2px solid lightgray;
|
||||
padding-bottom: 28px;
|
||||
}
|
||||
.welcome-box-area .icon-area{
|
||||
text-align: center;
|
||||
}
|
||||
.welcome-box-area .icon-area img{
|
||||
max-width: 220px;
|
||||
}
|
||||
|
||||
.welcome-box-area .first-part{
|
||||
padding: 10px;
|
||||
}
|
||||
|
||||
.next-step-link-area{}
|
||||
.next-step-link-area a{
|
||||
|
||||
}
|
||||
.next-step-link-area a span{
|
||||
font-weight: bold;
|
||||
}
|
||||
.media-heading span.text-normal{
|
||||
font-weight:normal;
|
||||
color: gray;
|
||||
}
|
||||
|
||||
.client-transaction-area .media-heading span.text-normal,.client-transaction-area .media-heading span.badge{
|
||||
margin-left: 5px;
|
||||
}
|
||||
|
||||
.total-client-text{}
|
||||
.total-client-text p{}
|
||||
.total-client-text p.label-text{
|
||||
margin-bottom: 0;
|
||||
font-size: 12px;
|
||||
}
|
||||
.total-client-text p.value{
|
||||
font-weight: bold;
|
||||
font-size:20px;
|
||||
}
|
||||
|
||||
.media-heading .media-annotation{
|
||||
margin-top: 3px;
|
||||
}
|
||||
.next-step-link-area a{}
|
||||
.next-step-link-area a i{
|
||||
color: #008d4c;
|
||||
}
|
||||
.next-step-link-area a span{
|
||||
color:#337ab7;
|
||||
}
|
||||
|
||||
.label-orange{
|
||||
color:#FF440A !important
|
||||
}
|
||||
|
||||
.btn-gray,.btn-gray:hover{
|
||||
background: darkgray;
|
||||
color:white;
|
||||
border-bottom-color: white;
|
||||
}
|
||||
|
||||
.quick-button{}
|
||||
.quick-button a{
|
||||
font-size: 12px;
|
||||
margin: 0 !important;
|
||||
}
|
||||
|
||||
.client-insystem{
|
||||
text-align: center;
|
||||
}
|
||||
.client-insystem .col-md-3{
|
||||
padding: 0 !important
|
||||
}
|
||||
|
||||
.right-list-dashboard{
|
||||
border-bottom: none !important;
|
||||
}
|
||||
|
||||
.right-label-dashboard{
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.right-dashboar-area{}
|
||||
.right-dashboar-area .table-head{
|
||||
border-bottom: none !important;
|
||||
}
|
||||
|
||||
.right-dashboar-area .dropdown-content-body{
|
||||
overflow-y: unset !important;
|
||||
}
|
||||
|
||||
.right-dashboar-list-area{
|
||||
max-height: 300px;
|
||||
overflow-y: auto;
|
||||
margin-bottom: 50px;
|
||||
}
|
||||
.right-dashboar-list-area ul{}
|
||||
|
||||
|
||||
/*
|
||||
circle css
|
||||
*/
|
||||
|
||||
.circle-area {
|
||||
margin: 30px 0px;
|
||||
padding-bottom: 0;
|
||||
z-index: 10000;
|
||||
}
|
||||
|
||||
.circle-area ul {
|
||||
list-style: none !important;
|
||||
margin-left: 0;
|
||||
padding-left: 0;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.circle-area ul li {
|
||||
background: lightgray;
|
||||
position: relative !important;
|
||||
display: inline-block;
|
||||
padding: 2px !important;
|
||||
border-radius: 50% !important;
|
||||
margin: 0 5px !important;
|
||||
font-size: 23px !important;
|
||||
width: 35px !important;
|
||||
text-align: center !important;
|
||||
color: white !important;
|
||||
font-weight: bold !important;
|
||||
/* z-index: 10000 !important;*/
|
||||
margin-left: 0;
|
||||
}
|
||||
|
||||
|
||||
.circle-green{
|
||||
background: green !important;
|
||||
}
|
||||
.circle-blue{
|
||||
background: #337ab7 !important;
|
||||
}
|
||||
|
||||
.day-date{
|
||||
color:black;
|
||||
|
||||
}
|
||||
.calender-noti td a{
|
||||
display: block;
|
||||
}
|
||||
td.btn-orange-color {
|
||||
border-color: #ffff !important;
|
||||
}
|
||||
td.btn-orange-color span.day-date{
|
||||
color: white !important;
|
||||
|
||||
}
|
||||
|
||||
.circle-area ul li.r::after{
|
||||
background: green !important;
|
||||
position: absolute !important;
|
||||
border-top: .5rem solid lightgrey;
|
||||
content: "";
|
||||
width: 37px !important;
|
||||
margin: 0 1rem !important;
|
||||
transform: translateY(-1rem) !important;
|
||||
top: 27px !important;
|
||||
z-index: 0 !important;
|
||||
left: 25px;
|
||||
|
||||
}
|
||||
|
||||
.circle-area ul li.v::after{
|
||||
background: green !important;
|
||||
position: absolute !important;
|
||||
border-top: .5rem solid lightgrey;
|
||||
content: "";
|
||||
width: 37px !important;
|
||||
margin: 0 1rem !important;
|
||||
transform: translateY(-1rem) !important;
|
||||
top: 27px !important;
|
||||
z-index: 0 !important;
|
||||
left: 25px;
|
||||
|
||||
}
|
||||
|
||||
/*
|
||||
blinking & bubble
|
||||
*/
|
||||
@-webkit-keyframes blinkingBg {
|
||||
0% { background-color: green; }
|
||||
49% { background-color: green; }
|
||||
50% { background-color: grey; }
|
||||
99% { background-color: grey; }
|
||||
100% { background-color: green; }
|
||||
}
|
||||
@-moz-keyframes blinkingBg {
|
||||
0% { background-color: green; }
|
||||
49% { background-color: green; }
|
||||
50% { background-color: grey; }
|
||||
99% { background-color: grey; }
|
||||
100% { background-color: green; }
|
||||
}
|
||||
@-ms-keyframes blinkingBg {
|
||||
0% { background-color: green; }
|
||||
49% { background-color: green; }
|
||||
50% { background-color: grey; }
|
||||
99% { background-color: grey; }
|
||||
100% { background-color: green; }
|
||||
}
|
||||
@-o-keyframes blinkingBg {
|
||||
0% { background-color: green; }
|
||||
49% { background-color: green; }
|
||||
50% { background-color: grey; }
|
||||
99% { background-color: grey; }
|
||||
100% { background-color: green; }
|
||||
}
|
||||
@keyframes blinkingBg {
|
||||
0% { background-color: green; }
|
||||
49% { background-color: green; }
|
||||
50% { background-color: grey; }
|
||||
99% { background-color: grey; }
|
||||
100% { background-color: green; }
|
||||
}
|
||||
.blinkingBtn {
|
||||
-webkit-animation: blinkingBg 0.5s linear infinite;
|
||||
-moz-animation: blinkingBg 0.5s linear infinite;
|
||||
-ms-animation: blinkingBg 0.5s linear infinite;
|
||||
-o-animation: blinkingBg 0.5s linear infinite;
|
||||
animation: blinkingBg 0.5s linear infinite;
|
||||
color: white !important;
|
||||
}
|
||||
|
||||
.wrap-btn-bbl {
|
||||
background-color: silver;
|
||||
position: relative;
|
||||
}
|
||||
.bubble {
|
||||
position: absolute;
|
||||
bottom: 8px;
|
||||
left: 350%;
|
||||
}
|
||||
|
||||
.fbubble {
|
||||
position: absolute;
|
||||
bottom: 5px;
|
||||
right: 20% !important;
|
||||
left: auto;
|
||||
}
|
||||
.talk-bubble {
|
||||
display: inline-block;
|
||||
position: relative;
|
||||
height: auto;
|
||||
background-color: #289AD9;
|
||||
color: white;
|
||||
}
|
||||
.round{
|
||||
border-radius: 30px;
|
||||
-webkit-border-radius: 30px;
|
||||
-moz-border-radius: 30px;
|
||||
}
|
||||
.tri-right.btm-left:after{
|
||||
content: ' ';
|
||||
position: absolute;
|
||||
width: 0;
|
||||
height: 0;
|
||||
left: 15px;
|
||||
right: auto;
|
||||
top: auto;
|
||||
bottom: -9px;
|
||||
border: 10px solid;
|
||||
border-color: transparent transparent transparent #289AD9;
|
||||
}
|
||||
|
||||
.fantastic.btm-left:after{
|
||||
content: ' ';
|
||||
position: absolute;
|
||||
width: 0;
|
||||
height: 0;
|
||||
left: auto;
|
||||
right: 8px;
|
||||
top: auto;
|
||||
bottom: -10px;
|
||||
border: 10px solid;
|
||||
border-color: transparent transparent transparent #289AD9;
|
||||
transform: rotate(180deg);
|
||||
}
|
||||
.talktext{
|
||||
padding: 2.2rem 1rem;
|
||||
text-align: left;
|
||||
line-height: 1.5rem;
|
||||
}
|
||||
.talktext p{
|
||||
-webkit-margin-before: 0em;
|
||||
-webkit-margin-after: 0em;
|
||||
padding: 2px 0;
|
||||
}
|
||||
|
||||
@media only screen and (max-width: 767px) {
|
||||
.mid-container a.mid-btn-link{
|
||||
width: 100%;
|
||||
margin-bottom: 10px !important;
|
||||
}
|
||||
.first-part{
|
||||
text-align: center;
|
||||
}
|
||||
.member-progress-area h4{
|
||||
text-align: center;
|
||||
}
|
||||
.mid-container .withborder{
|
||||
border: none;
|
||||
}
|
||||
.quick-button{
|
||||
padding-right: 20px;
|
||||
}
|
||||
|
||||
.circle-area{
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.circle-area ul li{
|
||||
margin: 0 24px !important;
|
||||
}
|
||||
.circle-area ul li.r::after, .circle-area ul li.v::after{
|
||||
width: 59px !important;
|
||||
}
|
||||
|
||||
.bubble{
|
||||
left:48%;
|
||||
}
|
||||
}
|
||||
|
||||
.soft-video-label-area{}
|
||||
.soft-video-label-area li{}
|
||||
.soft-video-label-area li i{
|
||||
padding: 10px;
|
||||
padding-left: 0;
|
||||
}
|
||||
.soft-video-label-area li a{
|
||||
font-weight: bold !important;
|
||||
}
|
||||
|
||||
.software-version-main-area{
|
||||
height: 310px;
|
||||
overflow-y: auto;
|
||||
}
|
||||
|
||||
.new-label{
|
||||
opacity: 0.7;
|
||||
font-size: 13px;
|
||||
}
|
||||
Reference in New Issue
Block a user