WebSVN – SmartDukaan – Diff – /trunk/profitmandi-fofo/src/main/webapp/resources/css/style.css

 @import url(https://fonts.googleapis.com/css?family=Lato:400,300,300italic,400italic,600,600italic,700,700italic,800,800italic);
 @import url(line-icons.css);
 body {
-    color: #797979;
+    color: #4a4a4a;
     background: #eeeeee;
     font-family: "Helvetica Neue", Roboto, Arial, "Droid Sans", sans-serif;
     padding: 0px !important;
     margin: 0px !important;
     font-size: 14px !important;
 input:focus, textarea:focus {
     outline: none;
+}
 table tr th {
-    color: #688a7e;
+    color: #3a5a4e;
+}
 *:focus {
     outline: none;
+}
     width: 180px;
     height: 100%;
     position: fixed;
     background: #2A3F54;
     z-index: 999;
+    overflow-y: auto;
+    transition: transform 0.3s ease;
+}
+#sidebar::-webkit-scrollbar {
+    width: 4px;
+}
+#sidebar::-webkit-scrollbar-thumb {
+    background: rgba(255, 255, 255, 0.15);
+    border-radius: 2px;
+}
+#sidebar::-webkit-scrollbar-track {
+    background: transparent;
+}
 .nav-collapse.collapse {
     display: inline;
+}
 ul.sidebar-menu, ul.sidebar-menu li ul.sub {
-    margin: -2px 0 0;
+    margin: 0;
     padding: 0;
+    list-style: none;
+}
 ul.sidebar-menu {
     margin-top: 60px;
+}
-@media screen and (max-width: 992px) {
+@media screen and (max-width: 1024px) {
-    ul.sidebar-menu {
-        margin-top: 120px;
-    }
-}
-/* On screens that are 600px or less, set the background color to olive */
-@media screen and (max-width: 600px) {
-    ul.sidebar-menu {
-        margin-top: 180px;
-    }
-}
-@media screen and (max-width: 300px) {
     ul.sidebar-menu {
         margin-top: 180px;
+    }
+}
-@media screen and (max-width: 1024px) {
+@media screen and (max-width: 992px) {
     ul.sidebar-menu {
-        margin-top: 180px;
+        margin-top: 120px;
+    }
+}
 #sidebar > ul > li > ul.sub {
 #sidebar > ul > li.active > ul.sub, #sidebar > ul > li > ul.sub > li > a {
     display: block;
+}
 ul.sidebar-menu li ul.sub li {
-    background: #394a59;
+    background: rgba(0, 0, 0, 0.15);
-    margin-bottom: 0;
-    margin-left: 0;
-    margin-right: 0;
-}
-ul.sidebar-menu li ul.sub li:last-child {
-    border-radius: 0 0 4px 4px;
-    -webkit-border-radius: 0 0 4px 4px;
+}
 ul.sidebar-menu li ul.sub li a {
-    font-size: 12px;
-    padding: 0 0 0 24px;
-    line-height: 35px;
-    height: 35px;
-    -webkit-transition: all 0.3s ease;
-    -moz-transition: all 0.3s ease;
-    -o-transition: all 0.3s ease;
-    -ms-transition: all 0.3s ease;
-    transition: all 0.3s ease;
-    color: #d0d8df;
     font-size: 13px;
+    padding: 7px 12px 7px 34px;
+    line-height: 1.4;
+    transition: all 0.2s ease;
+    color: #cfd8dc;
+    border-left: 3px solid transparent;
+    overflow: hidden;
+    text-overflow: ellipsis;
+    white-space: nowrap;
+    position: relative;
+}
-ul.sidebar-menu li ul.sub li a:hover, ul.sidebar-menu li ul.sub li.active a {
+ul.sidebar-menu li ul.sub li a::before {
-    color: #fff;
+    content: '';
-    -webkit-transition: all 0.3s ease;
+    position: absolute;
+    left: 20px;
-    -moz-transition: all 0.3s ease;
+    top: 50%;
+    width: 5px;
+    height: 5px;
-    -o-transition: all 0.3s ease;
+    border-radius: 50%;
-    -ms-transition: all 0.3s ease;
+    background: #546e7a;
-    transition: all 0.3s ease;
+    transform: translateY(-50%);
-    display: block;
+    transition: background 0.2s ease;
+}
-ul.sidebar-menu li {
+ul.sidebar-menu li ul.sub li a:hover,
-    line-height: 20px !important;
+ul.sidebar-menu li ul.sub li.active a {
-    /*margin-bottom: 5px;
+    color: #fff;
-    margin-left:10px;
+    background: rgba(255, 255, 255, 0.08);
-    margin-right:10px;*/
+    border-left: 3px solid #D3181F;
+}
-/*ul.sidebar-menu li:hover{
+ul.sidebar-menu li ul.sub li a:hover::before,
+ul.sidebar-menu li ul.sub li.active a::before {
+    background: #D3181F;
+}
-    border-bottom: 1px solid #688a7e;
-}*/
-ul.sidebar-menu li.sub-menu {
+ul.sidebar-menu li {
-    line-height: 15px;
+    line-height: 20px;
-    font-size: 16px;
+}
 ul.sidebar-menu li a span {
     display: inline-block;
+    max-width: 110px;
+    overflow: hidden;
+    text-overflow: ellipsis;
+    white-space: nowrap;
+    vertical-align: middle;
+}
 ul.sidebar-menu li a {
-    color: #d0d8df;
+    color: #dee2e6;
     text-decoration: none;
     display: block;
-    padding: 15px 0 15px 10px;
+    padding: 10px 12px 10px 14px;
-    font-size: 16px;
+    font-size: 14px;
-    font-weight: 300;
+    font-weight: 400;
     outline: none;
-    -webkit-transition: all 0.3s ease;
-    -moz-transition: all 0.3s ease;
-    -o-transition: all 0.3s ease;
-    -ms-transition: all 0.3s ease;
-    transition: all 0.3s ease;
+    transition: all 0.2s ease;
-    border-right: 1px solid #D7D7D7;
+    border-left: 3px solid transparent;
-    border-bottom: 1px solid #D7D7D7;
-}
-/*ul.sidebar-menu li a i{
-    position: relative;
-    top: 2px;
-}*/
-ul.sidebar-menu li.active a, ul.sidebar-menu li a:hover, ul.sidebar-menu li a:focus {
-    background: #D3181F;
-    color: #fff;
-    display: block;
-    /*border-radius: 4px;
-    -webkit-border-radius: 4px;*/
-    -webkit-transition: all 0.3s ease;
-    -moz-transition: all 0.3s ease;
-    -o-transition: all 0.3s ease;
-    -ms-transition: all 0.3s ease;
-    transition: all 0.3s ease;
+}
 ul.sidebar-menu li a:hover, ul.sidebar-menu li a:focus {
-    /*border-bottom: 1px solid #d0d8df;*/
+    background: rgba(255, 255, 255, 0.08);
-    border-bottom: none;
+    color: #fff;
+}
-/*ul.sidebar-menu li.active a,*/
+ul.sidebar-menu li.active > a {
-ul.sidebar-menu .sub-menu li.active a {
+    background: rgba(255, 255, 255, 0.1);
+    color: #fff;
-    border-bottom: 1px solid #d0d8df;
+    border-left: 3px solid #D3181F;
+}
 ul.sidebar-menu li a i {
-    font-size: 18px;
+    font-size: 16px;
-    padding-right: 6px;
+    padding-right: 8px;
-    /*color: #688a7e;*/
+    width: 24px;
-}
-ul.sidebar-menu li a:hover i, ul.sidebar-menu li a:focus i {
-    color: #fff;
+    text-align: center;
+}
+ul.sidebar-menu li a:hover i, ul.sidebar-menu li a:focus i,
 ul.sidebar-menu li.active a i {
     color: #fff;
+}
-#sidebar ul > li > a .arrow {
-    border-bottom: 4px solid transparent;
-    border-left: 4px solid #A0A0A0;
-    border-top: 4px solid transparent;
-    float: right;
-    height: 0;
-    margin-right: 10px;
-    margin-top: 6px;
-    width: 0;
-}
 #sidebar ul > li > a .menu-arrow {
     float: right;
     margin-right: 8px;
-    margin-top: 6px;
-}
-#sidebar > ul > li > a .arrow.open {
-    border-left: 4px solid transparent;
-    border-right: 4px solid transparent;
-    border-top: 5px solid #A0A0A0;
-    float: right;
-    height: 0;
-    margin-right: 10px;
+    font-size: 14px;
-    margin-top: 8px;
-    width: 0;
-}
-#sidebar ul > li.active > a .arrow, #sidebar ul > li > a:hover .arrow, #sidebar ul > li > a:focus .arrow {
-    float: right;
+    color: #6c7a89;
-    margin-top: 6px;
-    margin-right: 10px;
-    width: 0;
-    height: 0;
-    border-left: 4px solid #d0d8df;
-    border-top: 4px solid transparent;
+    transition: color 0.2s ease;
-    border-bottom: 4px solid transparent;
+}
-#sidebar > ul > li.active > a .arrow.open, #sidebar > ul > li > a:hover .arrow.open,
+#sidebar ul > li > a:hover .menu-arrow,
-#sidebar > ul > li > a:focus .arrow.open {
+#sidebar ul > li.active > a .menu-arrow {
-    float: right;
+    color: #adb5bd;
-    margin-top: 8px;
-    margin-right: 10px;
-    width: 0;
-    height: 0;
-    border-top: 5px solid #d0d8df;
-    border-left: 4px solid transparent;
-    border-right: 4px solid transparent;
+}
 .mail-info, .mail-info:hover {
     margin: 3px 6px 0 0;
     font-size: 11px;
+}
 /*main content*/
 #main-content {
     margin-left: 180px;
+    transition: margin-left 0.3s ease;
+}
 .header, .footer {
     min-height: 60px;
     padding: 0 15px;
+}
+.header {
+    display: flex;
+    align-items: center;
+}
+.header .top-nav {
+    margin-left: auto;
+}
+.header .top-nav .top-menu {
+    display: flex;
+    align-items: center;
+    gap: 6px;
+    margin: 0;
+    padding: 0;
+    list-style: none;
+}
+.header-icon {
+    height: 32px;
+    vertical-align: middle;
+    margin-right: 4px;
+}
 .box1 {
     font-size: 16px;
     display: inline-block;
     width: 25%;
     padding: .25em .5em;
     padding: 15px;
     width: 100%;
+}
 a.logo {
-    font-size: 25px;
+    font-size: 18px;
-    font-weight: 400;
+    font-weight: 500;
     color: #D3181F;
-    float: left;
-    margin-top: 15px;
     text-transform: uppercase;
-    letter-spacing: 1px;
+    letter-spacing: 0.5px;
+    white-space: nowrap;
+}
 .samsung-bg {
     background-color: #1427a0;
+}
     background-color: #4c4b4b;
+}
 span.logo {
     font-size: 16px;
-    font-weight: 300;
+    font-weight: 400;
     color: #D3181F;
-    float: left;
-    margin-top: 15px;
     text-transform: uppercase;
-    letter-spacing: 1px;
+    letter-spacing: 0.5px;
+}
 a.logo:hover, a.logo:focus {
     text-decoration: none;
     outline: none;
     color: #688a7e;
+}
 /*notification*/
 #top_menu .nav > li, ul.top-menu > li {
-    float: left;
+    display: flex;
+    align-items: center;
+}
 .search-row {
     float: left;
     margin-top: 15px;
     margin-left: 16px;
+}
 .notification-row {
-    float: right;
-    margin-top: 15px;
+    display: flex;
-    margin-left: 65px;
+    align-items: center;
+}
 #task_notificatoin_bar, #mail_notificatoin_bar, #alert_notificatoin_bar,
 #cart_bar, #wallet_bar {
-    margin-top: 7px;
+}
 ul.top-menu > li > a {
     color: #D3181F;
-    font-size: 18px;
+    font-size: 16px;
-    padding: 2px 6px;
+    padding: 6px 8px;
+    display: flex;
-    margin-right: 15px;
+    align-items: center;
+}
 ul.top-menu > li > a:hover, ul.top-menu > li > a:focus {
     background: transparent !important;
     color: #D7D7D7 !important;
     display: block !important;
     font-size: 11px;
+}
 .top-nav {
-    margin-top: 7px;
+}
 .top-nav ul.top-menu > li .dropdown-menu.logout {
     width: 200px !important;
+}
     transition: all .3s ease;
     color: #c8c8c8;
     font-weight: 300;
+}
-/*--sidebar toggle---*/
 .toggle-nav {
-    float: left;
+    display: flex;
+    align-items: center;
     padding-right: 15px;
-    margin-top: 15px;
     color: #D3181F;
+}
 .toggle-nav .icon-reorder {
     cursor: pointer;
     display: inline-block;
-    font-size: 30px;
+    font-size: 24px;
-}
-.sidebar-closed > #sidebar > ul {
-    display: none;
+}
 .sidebar-closed #main-content {
-    margin-left: 0px;
+    margin-left: 0;
+}
 .sidebar-closed #sidebar {
-    margin-left: -180px;
+    transform: translateX(-180px);
+}
 /*state overview*/
 .state-overview .symbol, .state-overview .value {
     display: inline-block;
+}
 .dropdown-menu.typeadhead {
     max-height: 250px;
     overflow-y: auto;
+}
+/* --- admin dashboard --- */
+.select2-container {
+    display: block !important;
+}
+.loading {
+    display: none;
+}
+.breadcrumb {
+    padding: 0 15px;
+}
+.stars-outer {
+    display: inline-block;
+    position: relative;
+    font-family: 'Mukta', FontAwesome, Hind;
+}
+.stars-outer::before {
+    content: "\f006 \f006 \f006 \f006 \f006";
+}
+.stars-inner {
+    position: absolute;
+    top: 0;
+    left: 0;
+    white-space: nowrap;
+    overflow: hidden;
+    width: 0;
+}
+.stars-inner::before {
+    content: "\f005 \f005 \f005 \f005 \f005";
+    color: #f8ce0b;
+}
+.table-striped > tbody > tr:nth-child(odd) > td {
+    background-color: #dae5f4;
+}
+.table-striped > tbody > tr:nth-child(even) > td {
+    background-color: #b8d1f3;
+}
+.sale-details {
+    cursor: pointer;
+}
+.popover {
+    min-width: 18%;
+}
+.fa-2x {
+    font-size: 1.4em;
+}
+.cover {
+    object-fit: cover;
+    width: 100%;
+    height: 90px;
+    padding: 8px;
+}
+.info-box .notifications i {
+    display: inline-block;
+    margin-top: 0;
+    height: 25px;
+    font-size: 16px;
+    line-height: 25px;
+    width: 25px;
+    float: none;
+    text-align: center;
+    padding-right: 0;
+    color: #768399;
+}
+#preview {
+    position: relative;
+    color: #fff;
+    float: left;
+    width: 100%;
+    border-radius: 10px;
+    clear: both;
+}
+#canvas-preview {
+    width: 100%;
+    position: relative;
+    top: -15px;
+}
+#preview-textfield {
+    position: absolute;
+    top: -10px;
+    left: 0;
+    right: 0;
+    text-align: center;
+    font-size: 2em;
+    font-weight: bold;
+    color: white;
+    font-family: 'Amaranth', sans-serif, 'Mukta';
+}
+/* --- bulletin / team messages --- */
+.team-messages {
+    background: #fff;
+    padding: 10px;
+    margin-top: 10px;
+    border-radius: 8px;
+    margin-bottom: 4px;
+    border: 1px solid #dae4f5;
+}
+.team-messages p {
+    margin-bottom: 4px;
+}
+.tm-title {
+    font-size: 17px;
+    font-weight: 500;
+    margin: 5px;
+}
+.tm-subtitle {
+    font-size: 12px;
+    color: #888;
+    margin-bottom: 8px;
+}
+.timeline-wrapper {
+    position: relative;
+    padding-top: 5px;
+    height: 670px;
+    overflow: auto;
+}
+.timeline-row {
+    display: flex;
+    align-items: flex-start;
+    margin-bottom: 8px;
+}
+.timeline-time {
+    font-size: 10px;
+    color: #999;
+    text-align: right;
+    padding-right: 5px;
+    position: relative;
+    right: 10px;
+}
+.timeline-card {
+    background: #fff;
+    border: 1px solid #e7e2e2;
+    border-left: 2px solid #ba9b9b;
+    border-radius: 4px;
+    padding: 6px 8px;
+    padding-top: 2px;
+    width: 100%;
+    position: relative;
+    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.03);
+}
+.bulletin-attachments {
+    position: absolute;
+    bottom: 10px;
+    right: 12px;
+    font-size: 12px;
+}
+.bulletin-attachments a {
+    margin-left: 8px;
+    color: #007bff;
+    text-decoration: none;
+}
+.bulletin-attachments a:hover {
+    text-decoration: underline;
+}
+.bulletin-tabs {
+    display: flex;
+    list-style: none;
+    padding: 0;
+    border-bottom: 1px solid #ddd;
+}
+.bulletin-tabs li {
+    padding: 8px 14px;
+    cursor: pointer;
+    font-size: 13px;
+}
+.bulletin-tabs li.active {
+    font-weight: 600;
+    border-bottom: 2px solid #3b6cff;
+}
+.bulletin-tab-content {
+    display: none;
+}
+#bulletinDate {
+    border-radius: 20px;
+    padding: 4px 12px;
+    border: 1px solid #ddd;
+    background: #f5f7fb;
+    font-size: 12px;
+    position: relative;
+    bottom: 5px;
+}
+/* --- utility classes --- */
+.section-title {
+    font-size: 21px;
+    margin-top: 0;
+    margin-bottom: 12px;
+}
+.section-title strong {
+    font-weight: 600;
+}
+.mt-0 { margin-top: 0; }
+.mb-sm { margin-bottom: 4px; }
+.mb-md { margin-bottom: 12px; }
+.mb-lg { margin-bottom: 24px; }
+.pl-0 { padding-left: 0; }
+.ml-sm { margin-left: 5px; }
+.m-sm { margin: 5px; }
+body {
+    background-color: #f7f7f7;
+}
+.divider {
+    margin: 8px 0 15px 0;
+    border-top: 1px solid #dddcdc;
+}

Subversion Repositories SmartDukaan

(root)/trunk/profitmandi-fofo/src/main/webapp/resources/css/style.css – Rev 35726 → 36566