kaui 3.0.9 → 4.0.0

data/app/assets/stylesheets/kaui/datatable.css

@@ -1,71 +1,129 @@
-.search table {
-  font-weight: 400; }
-  .search table th:first-of-type, .search table td:first-of-type {
-    padding-left: 60px; }
-    @media (max-width: 768px) {
-      .search table th:first-of-type, .search table td:first-of-type {
-        padding: 5px; } }
-.search table.table-small-padding th, .search table.table-small-padding td {
-  white-space: nowrap; }
-  .search table.table-small-padding th:first-of-type, .search table.table-small-padding td:first-of-type {
-    padding-left: 20px; }
-.search table.table-colored-rows tr.insert {
-  background-color: #dff0d8; }
-.search table.table-colored-rows tr.update {
-  background-color: #fcf8e3; }
-.search table.table-colored-rows tr.delete {
-  background-color: #f2dede; }
-.search table.table-colored-rows th:first-of-type, .search table.table-colored-rows td:first-of-type {
-  padding-left: 20px; }
-.search tr.disabled {
-  background-color: #f5f5f5; }
+/* 2. Table wrapper — white card with rounded corners & soft shadow */
+.dataTables_wrapper {
+  background: #fff;
+  margin-bottom: 2rem;
+}
+
+.dataTables_scroll {
+  margin-bottom: 1.5rem;
+}
+
+#accounts-table {
+  margin-top: 0rem !important;
+}
 
 table.dataTable {
-  padding: 0; }
+  width: 100% !important;
+  border-collapse: separate !important;
+  border-spacing: 0;
+  border-radius: 0.375rem;
+  overflow: hidden;
+  font-size: 0.95rem;
+  border: 0rem !important;
+}
+
+table.dataTable thead tr {
+  border: 0rem !important;
+}
+
+table.dataTable thead {
+  border: 0rem !important;
+}
+
+table th:first-of-type,
+.search table td:first-of-type {
+  padding-left: 1.25rem !important;
+  font-weight: 600 !important;
+  font-size: 0.875rem;
+  line-height: 1.25rem;
+  color: blue;
+}
+
+tbody tr td:first-of-type a {
+  color: #1570ef !important;
+  text-decoration: none;
+}
 
 table.dataTable thead th {
-  position: relative; }
+  background-color: #fafafa;
+  font-weight: 500 !important;
+  padding: 0.75rem;
+  border: 0rem !important;
+  font-size: 0.75rem;
+  line-height: 1.125rem;
+  color: #717680;
+  text-transform: capitalize;
+}
 
-table.dataTable thead th,
 table.dataTable tbody td {
-  vertical-align: middle; }
+  padding: 0.9375rem 0.75rem !important;
+  vertical-align: middle;
+  border-bottom: 0.0625rem solid #e9eaeb !important;
+  font-weight: 400 !important;
+  font-size: 0.875rem;
+  line-height: 1.25rem;
+  color: #535862;
+}
 
-table.dataTable thead th.sorting:after,
-table.dataTable thead th.sorting_asc:after,
-table.dataTable thead th.sorting_desc:after {
-  content: '' !important; }
-
-table.dataTable {
-  margin-top: 0 !important;
-  margin-bottom: 0 !important; }
-  @media (max-width: 768px) {
-    table.dataTable {
-      margin-bottom: 30px !important; } }
+table.dataTable tbody tr:hover {
+  background-color: #f5f7fa;
+}
 
-table.dataTable thead th,
-table.dataTable thead td {
-  font-size: 12px;
-  border-bottom: 0; }
+table.dataTable td input[type="checkbox"] {
+  margin: 0 auto;
+  display: block;
+}
 
-table.dataTable.no-footer {
-  border-bottom: 1px solid #dddddd; }
+.dataTables_filter {
+  margin-bottom: 1rem;
+  text-align: right;
+}
 
-.info-wrapper table.dataTable.no-footer {
-  border-bottom: 0; }
+.dataTables_filter input {
+  border-radius: 0.5rem;
+  padding: 0.4rem 0.75rem;
+  border: 0.0625rem solid #ced4da;
+  font-size: 0.9rem;
+  width: auto;
+  display: inline-block;
+}
 
-#invoice-table tbody tr {
-  border-bottom: 1px solid #dddddd; }
+.dataTables_paginate {
+  margin-top: 1rem;
+  text-align: right;
+}
 
-@media (max-width: 768px) {
-  #accounts-table {
-    width: 100% !important; } }
+.paginate_button {
+  border: none !important;
+  margin: 0 0.1875rem !important;
+  border-radius: 0.375rem !important;
+  padding: 0.375rem 0.625rem !important;
+  font-size: 0.875rem !important;
+  font-weight: 500 !important;
+  line-height: 1.25rem !important;
+  color: #414651 !important;
+  border: 0.0625rem solid #d5d7da !important;
+}
 
-table.dataTable.table-condensed thead > tr > th {
-  border-right: 1px solid #c9c9c9; }
-  table.dataTable.table-condensed thead > tr > th:last-of-type {
-    border-right: 0; }
+.paginate_button.current,
+.paginate_button:hover {
+  background: #fff !important;
+  color: #414651 !important;
+  opacity: 0.6;
+  transition: opacity 0.2s ease-in-out;
+  -webkit-transition: opacity 0.2s ease-in-out;
+  -moz-transition: opacity 0.2s ease-in-out;
+  -o-transition: opacity 0.2s ease-in-out;
+  cursor: pointer;
+}
 
-.dataTables_paginate.paging_full_numbers {
-  padding-top: 30px; }
+.dataTables_processing {
+  padding: 6.25rem 0rem !important;
+}
 
-/*# sourceMappingURL=datatable.css.map */
+.dataTables_info {
+  font-size: 0.875rem !important;
+  font-weight: 400 !important;
+  line-height: 1.25rem !important;
+  color: #717680 !important;
+}

data/app/assets/stylesheets/kaui/header.css

@@ -2,128 +2,235 @@
  * Header Layout
  */
 header {
-  padding: 25px 0;
+  padding: 1.5625rem 0;
   background: #fff;
-  border-bottom: 1px solid #ccc;
-  margin-bottom: 40px; }
+  border-bottom: 0.0625rem solid #ccc;
+}
+header img {
+  vertical-align: middle;
+}
+@media (max-width: 48rem) {
   header img {
-    vertical-align: middle; }
-    @media (max-width: 768px) {
-      header img {
-        display: block;
-        margin: 0 auto 10px; } }
+    display: block;
+    margin: 0 auto 0.625rem;
+  }
+}
+header #searchform {
+  margin: 0 1.875rem;
+  vertical-align: middle;
+  position: relative;
+  display: inline-block;
+}
+@media (max-width: 48rem) {
   header #searchform {
-    margin: 0 30px;
-    vertical-align: middle;
-    position: relative;
-    display: inline-block; }
-    @media (max-width: 768px) {
-      header #searchform {
-        width: 185px;
-        display: block;
-        margin: 0 auto 10px; } }
-    header #searchform input[type="text"] {
-      padding-right: 28px; }
-      @media (max-width: 1024px) {
-        header #searchform input[type="text"] {
-          width: 100px; } }
-      @media (max-width: 768px) {
-        header #searchform input[type="text"] {
-          width: 100%; } }
-    header #searchform input[type="submit"] {
-      display: block;
-      width: 18px;
-      height: 15px;
-      position: absolute;
-      top: 7px;
-      right: 5px;
-      background: url("kaui/search.png") no-repeat top left;
-      border: 0;
-      text-indent: 999999px;
-      overflow: hidden;
-      outline: 0;
-      padding: 0; }
+    width: 11.5625rem;
+    display: block;
+    margin: 0 auto 0.625rem;
+  }
+}
+header #searchform input[type="text"] {
+  padding-right: 1.75rem;
+}
+@media (max-width: 64rem) {
+  header #searchform input[type="text"] {
+    width: 6.25rem;
+  }
+}
+@media (max-width: 48rem) {
+  header #searchform input[type="text"] {
+    width: 100%;
+  }
+}
+header #searchform input[type="submit"] {
+  display: block;
+  width: 1.125rem;
+  height: 0.9375rem;
+  position: absolute;
+  top: 0.4375rem;
+  right: 0.3125rem;
+  background: url("kaui/search.png") no-repeat top left;
+  border: 0;
+  text-indent: 999999px;
+  overflow: hidden;
+  outline: 0;
+  padding: 0;
+}
+header a {
+  font-size: 0.75rem;
+  text-transform: uppercase;
+}
+@media (max-width: 48rem) {
   header a {
-    font-size: 12px;
-    text-transform: uppercase; }
-    @media (max-width: 768px) {
-      header a {
-        text-align: center;
-        display: block; } }
-  @media (max-width: 768px) {
-    header nav {
-      text-align: center; } }
+    text-align: center;
+    display: block;
+  }
+}
+@media (max-width: 48rem) {
+  header nav {
+    text-align: center;
+  }
+}
+header nav ul {
+  padding: 0.375rem 0;
+  margin: 0;
+}
+@media (max-width: 64rem) {
   header nav ul {
-    padding: 6px 0;
-    margin: 0; }
-    @media (max-width: 1024px) {
-      header nav ul {
-        text-align: center; }
-        header nav ul.account-menu {
-          margin: -10px 0; } }
-    header nav ul li {
-      list-style: none;
-      display: inline-block;
-      vertical-align: middle; }
-      header nav ul li a {
-        color: #777777;
-        padding: 0 10px;
-        border-right: 1px solid #ccc; }
-        header nav ul li a:hover {
-          color: #000; }
-      header nav ul li:last-of-type a {
-        border: 0; }
+    text-align: center;
+  }
+  header nav ul.account-menu {
+    margin: -0.625rem 0;
+  }
+}
+header nav ul li {
+  list-style: none;
+  display: inline-block;
+  vertical-align: middle;
+}
+header nav ul li a {
+  color: #777777;
+  padding: 0 0.625rem;
+  border-right: 0.0625rem solid #ccc;
+}
+header nav ul li a:hover {
+  color: #000;
+}
+header nav ul li:last-of-type a {
+  border: 0;
+}
 
 .title-nav-area {
   background: #c7e4e7;
-  margin: 0 0 30px;
+  margin: 0 0 1.875rem;
   font-size: 0;
-  margin-top: -40px; }
-  @media (max-width: 768px) {
-    .title-nav-area .container {
-      text-align: center;
-      width: 100%;
-      padding: 0 15px; } }
-  .title-nav-area a, .title-nav-area p {
-    display: inline-block;
-    padding: 12px 40px;
-    font-size: 12px;
-    margin: 0;
-    line-height: 12px;
-    background: transparent;
-    vertical-align: top; }
-    @media (max-width: 768px) {
-      .title-nav-area a, .title-nav-area p {
-        width: 30%;
-        padding: 12px 0;
-        text-align: center;
-        border-bottom: 1px solid #fff; }
-        .title-nav-area a:nth-of-type(4), .title-nav-area a:nth-of-type(5), .title-nav-area p:nth-of-type(4), .title-nav-area p:nth-of-type(5) {
-          width: 45%; }
-        .title-nav-area a:nth-of-type(3), .title-nav-area a:nth-of-type(5), .title-nav-area p:nth-of-type(3), .title-nav-area p:nth-of-type(5) {
-          border-right: 1px solid #fff; } }
-    @media (max-width: 450px) {
-      .title-nav-area a, .title-nav-area p {
-        width: 50%;
-        border: 0; }
-        .title-nav-area a:nth-of-type(2), .title-nav-area a:nth-of-type(4), .title-nav-area a:nth-of-type(5), .title-nav-area p:nth-of-type(2), .title-nav-area p:nth-of-type(4), .title-nav-area p:nth-of-type(5) {
-          border-right: 1px solid #fff; }
-        .title-nav-area a:nth-of-type(3), .title-nav-area p:nth-of-type(3) {
-          border-right: 0; }
-        .title-nav-area a:nth-of-type(4), .title-nav-area p:nth-of-type(4) {
-          width: 50%; }
-        .title-nav-area a:nth-of-type(5), .title-nav-area p:nth-of-type(5) {
-          width: 100%; } }
-  .title-nav-area a {
-    color: #666666;
-    text-transform: uppercase;
-    border-left: 1px solid #fff; }
-    .title-nav-area a:hover, .title-nav-area a.current {
-      color: #fff;
-      background: #00919d; }
-    .title-nav-area a:last-of-type {
-      border-right: 1px solid #fff; }
+  margin-top: -2.5rem;
+}
+@media (max-width: 48rem) {
+  .title-nav-area .container {
+    text-align: center;
+    width: 100%;
+    padding: 0 0.9375rem;
+  }
+}
+.title-nav-area a,
+.title-nav-area p {
+  display: inline-block;
+  padding: 0.75rem 2.5rem;
+  font-size: 0.75rem;
+  margin: 0;
+  line-height: 0.75rem;
+  background: transparent;
+  vertical-align: top;
+}
+@media (max-width: 48rem) {
+  .title-nav-area a,
   .title-nav-area p {
-    font-weight: normal; }
+    width: 30%;
+    padding: 0.75rem 0;
+    text-align: center;
+    border-bottom: 0.0625rem solid #fff;
+  }
+  .title-nav-area a:nth-of-type(4),
+  .title-nav-area a:nth-of-type(5),
+  .title-nav-area p:nth-of-type(4),
+  .title-nav-area p:nth-of-type(5) {
+    width: 45%;
+  }
+  .title-nav-area a:nth-of-type(3),
+  .title-nav-area a:nth-of-type(5),
+  .title-nav-area p:nth-of-type(3),
+  .title-nav-area p:nth-of-type(5) {
+    border-right: 0.0625rem solid #fff;
+  }
+}
+@media (max-width: 28.125rem) {
+  .title-nav-area a,
+  .title-nav-area p {
+    width: 50%;
+    border: 0;
+  }
+  .title-nav-area a:nth-of-type(2),
+  .title-nav-area a:nth-of-type(4),
+  .title-nav-area a:nth-of-type(5),
+  .title-nav-area p:nth-of-type(2),
+  .title-nav-area p:nth-of-type(4),
+  .title-nav-area p:nth-of-type(5) {
+    border-right: 0.0625rem solid #fff;
+  }
+  .title-nav-area a:nth-of-type(3),
+  .title-nav-area p:nth-of-type(3) {
+    border-right: 0;
+  }
+  .title-nav-area a:nth-of-type(4),
+  .title-nav-area p:nth-of-type(4) {
+    width: 50%;
+  }
+  .title-nav-area a:nth-of-type(5),
+  .title-nav-area p:nth-of-type(5) {
+    width: 100%;
+  }
+}
+.title-nav-area a {
+  color: #666666;
+  text-transform: uppercase;
+  border-left: 0.0625rem solid #fff;
+}
+.title-nav-area a:hover,
+.title-nav-area a.current {
+  color: #fff;
+  background: #00919d;
+}
+.title-nav-area a:last-of-type {
+  border-right: 0.0625rem solid #fff;
+}
+.title-nav-area p {
+  font-weight: normal;
+}
 
-/*# sourceMappingURL=header.css.map */
+/* Updated */
+.search-container {
+  max-width: 40.625rem;
+  width: 100%;
+}
+.search-box {
+  position: relative;
+  display: inline-block;
+  width: 100%;
+  border-radius: 0.5rem;
+}
+.search-box input.form-control::-webkit-input-placeholder {
+  color: #717680;
+  font-weight: 400;
+  font-size: 1rem;
+  font-style: normal !important;
+  opacity: 1; /* required for Firefox */
+}
+.dropdown-menu {
+  padding: 0.75rem 0;
+  box-shadow: 0 0.375rem 1.5rem rgba(0, 0, 0, 0.08);
+  border-radius: 2rem;
+}
+ul.header-menu {
+}
+ul.header-menu li a {
+  height: 2.25rem;
+  padding: 0 1rem;
+}
+ul.header-menu li span {
+  text-transform: none;
+}
+.autocomplete-box {
+  z-index: 1050;
+  max-height: 26.25rem;
+  overflow-y: auto;
+}
+.header-tag {
+  border: 0.0625rem solid #ccc;
+}
+.header-tag a {
+  text-transform: none;
+  font-size: 1rem;
+}
+.header-tag:hover {
+  background-color: #fff !important;
+}

data/app/assets/stylesheets/kaui/home.css

@@ -2,71 +2,98 @@
  * Home Page
  */
 .home {
-  text-align: center; }
+  text-align: center;
+}
+
+.home #home_searchform {
+  padding-top: 9.375rem;
+}
+
+@media (max-width: 48rem) {
   .home #home_searchform {
-    padding-top: 150px; }
-    @media (max-width: 768px) {
-      .home #home_searchform {
-        padding-top: 50px; } }
-    .home #home_searchform #search {
-      line-height: 48px;
-      padding: 0 25px;
-      font-size: 18px;
-      width: 330px;
-      height: 50px; }
-      @media (max-width: 768px) {
-        .home #home_searchform #search {
-          line-height: 33px;
-          padding: 0 10px;
-          font-size: 16px;
-          width: 220px;
-          height: 35px; } }
-    .home #home_searchform input[type=submit] {
-      background: #00919d url("kaui/search_white.png") no-repeat center center;
-      height: 50px;
-      padding: 0 20px;
-      text-indent: 999999px;
-      overflow: hidden;
-      width: 82px;
-      border-radius: 25px;
-      vertical-align: top;
-      margin: 0 0 0 10px; }
-      @media (max-width: 768px) {
-        .home #home_searchform input[type=submit] {
-          height: 35px;
-          width: 42px;
-          border-radius: 15px;
-          background-size: 20px; } }
-  .home .legend {
-    margin-top: 40px; }
+    padding-top: 3.125rem;
+  }
+}
+
+.home #home_searchform #search {
+  line-height: 3rem;
+  padding: 0 1.5625rem;
+  font-size: 1.125rem;
+  width: 20.625rem;
+  height: 3.125rem;
+}
+
+@media (max-width: 48rem) {
+  .home #home_searchform #search {
+    line-height: 2.0625rem;
+    padding: 0 0.625rem;
+    font-size: 1rem;
+    width: 13.75rem;
+    height: 2.1875rem;
+  }
+}
+
+.home #home_searchform input[type="submit"] {
+  background: #00919d url("kaui/search_white.png") no-repeat center center;
+  height: 3.125rem;
+  padding: 0 1.25rem;
+  text-indent: 6249.99375rem;
+  overflow: hidden;
+  width: 5.125rem;
+  border-radius: 1.5625rem;
+  vertical-align: top;
+  margin: 0 0 0 0.625rem;
+}
+
+@media (max-width: 48rem) {
+  .home #home_searchform input[type="submit"] {
+    height: 2.1875rem;
+    width: 2.625rem;
+    border-radius: 0.9375rem;
+    background-size: 1.25rem;
+  }
+}
+
+.home .legend {
+  margin-top: 2.5rem;
+}
+
+.home .duck_help {
+  width: 22rem;
+  height: 16.25rem;
+  padding: 2.1875rem 7.5rem 6.25rem 1.875rem;
+  font-size: 1.125rem;
+  color: #666;
+  display: block;
+  position: fixed;
+  bottom: 0;
+  right: 20%;
+  background: url("kaui/duck.png") no-repeat center center;
+  text-align: center;
+}
+
+@media (max-width: 48rem) {
+  .home .duck_help {
+    position: relative;
+    right: initial;
+    bottom: initial;
+    width: 18.75rem;
+    background-size: 18.75rem auto;
+    font-size: 1rem;
+    padding: 1.25rem 7.5rem 6.875rem 2.5rem;
+    top: 3.125rem;
+    height: 13.75rem;
+    display: inline-block;
+  }
+}
+
+@media (min-height: 37.5rem) {
   .home .duck_help {
-    width: 352px;
-    height: 260px;
-    padding: 35px 120px 100px 30px;
-    font-size: 18px;
-    color: #666;
-    display: block;
     position: fixed;
+    top: auto;
     bottom: 0;
-    right: 20%;
-    background: url("kaui/duck.png") no-repeat center center;
-    text-align: center; }
-    @media (max-width: 768px) {
-      .home .duck_help {
-        position: relative;
-        right: initial;
-        bottom: initial;
-        width: 300px;
-        background-size: 300px auto;
-        font-size: 16px;
-        padding: 20px 120px 110px 40px;
-        top: 50px;
-        height: 220px;
-        display: inline-block; } }
-    @media (min-height: 600px) {
-      .home .duck_help {
-        position: fixed;
-        top: auto;
-        bottom: 0; } }
+  }
+}
+
 
 /*# sourceMappingURL=home.css.map */