Merge branch 'modernize-css' into 'master'

CSS modernized

See merge request allianceauth/allianceauth!1448
This commit is contained in:
Ariel Rin 2022-09-07 06:21:15 +00:00
commit d2e494b9be
4 changed files with 64 additions and 72 deletions

View File

@ -6,24 +6,26 @@ CSS for allianceauth admin site
.img-circle {
border-radius: 50%;
}
.column-user_profile_pic {
width: 1px;
white-space: nowrap;
width: 1px;
}
/* tooltip */
.tooltip {
position: relative ;
position: relative;
}
.tooltip:hover::after {
content: attr(data-tooltip) ;
position: absolute ;
top: 1.1em ;
left: 1em ;
min-width: 200px ;
border: 1px #808080 solid ;
padding: 8px ;
color: black ;
background-color: rgb(255, 255, 204) ;
z-index: 1 ;
background-color: rgb(255 255 204);
border: 1px rgb(128 128 128) solid;
color: rgb(0 0 0);
content: attr(data-tooltip);
left: 1em;
min-width: 200px;
padding: 8px;
position: absolute;
top: 1.1em;
z-index: 1;
}

View File

@ -2,5 +2,10 @@
CSS for allianceauth admin site
*/
.img-circle { border-radius: 50%; }
.column-user_profile_pic { width: 50px; }
.img-circle {
border-radius: 50%;
}
.column-user_profile_pic {
width: 50px;
}

View File

@ -2,17 +2,9 @@ body {
margin-bottom: 32px;
}
.gray-icon-color .fa {
color: #505050;
}
.notification-bell-color {
color: #a88f1e;
}
.navbar-brand {
height: 58px;
padding: 19px 19px;
padding: 19px;
}
.auth-navbar-top {
@ -48,36 +40,36 @@ ul.list-group.list-group-horizontal > li.list-group-item {
}
@media all {
/* style nav tabs in dark mode*/
/* style nav tabs in dark mode */
.template-dark-mode .nav-tabs > li.active > a {
background-color: rgb(70, 69, 69) !important;
color: rgb(255, 255, 255) !important;
background-color: rgb(70 69 69) !important;
color: rgb(255 255 255) !important;
}
.panel-tabs-aa {
border-top: none;
border-top-left-radius: 0%;
border-top-right-radius: 0%;
border-top-left-radius: 0;
border-top-right-radius: 0;
}
/* style group headers within a table */
.template-light-mode .tr-group {
background-color: #e6e6e6 !important;
background-color: rgb(230 230 230) !important;
font-weight: bold;
}
.template-dark-mode .tr-group {
background-color: rgb(105, 105, 105) !important;
background-color: rgb(105 105 105) !important;
font-weight: bold;
}
/* default style for tables */
.template-light-mode .table-aa > thead > tr > th {
border-bottom: 1px solid #f2f2f2;
border-bottom: 1px solid rgb(242 242 242);
}
.template-dark-mode .table-aa > thead > tr > th {
border-bottom: 1px solid rgb(70, 69, 69);
border-bottom: 1px solid rgb(70 69 69);
}
.table-aa > thead > tr > th {
@ -85,11 +77,11 @@ ul.list-group.list-group-horizontal > li.list-group-item {
}
.template-light-mode .table-aa > tbody > tr > td {
border-bottom: 1px solid #f2f2f2;
border-bottom: 1px solid rgb(242 242 242);
}
.template-dark-mode .table-aa > tbody > tr > td {
border-bottom: 1px solid rgb(70, 69, 69);
border-bottom: 1px solid rgb(70 69 69);
}
.table-aa > tbody > tr > td {
@ -101,8 +93,8 @@ ul.list-group.list-group-horizontal > li.list-group-item {
}
.task-status-progress-bar {
font-size: 15px!important;
line-height: normal!important;
font-size: 15px !important;
line-height: normal !important;
}
}
@ -110,11 +102,11 @@ ul.list-group.list-group-horizontal > li.list-group-item {
------------------------------------------------------------------------------------- */
@media all {
.template-light-mode .nav-pills > li > a.active {
background-color: rgb(236, 240, 241);
background-color: rgb(236 240 241);
}
.template-dark-mode .nav-pills > li > a.active {
background-color: rgb(48, 48, 48);
background-color: rgb(48 48 48);
}
}
@ -136,45 +128,41 @@ ul.list-group.list-group-horizontal > li.list-group-item {
.dropdown-menu > li > a {
clear: both;
color: rgb(123, 138, 139);
color: rgb(123 138 139);
display: block;
font-weight: 400;
line-height: 1.42857143;
line-height: 1.42857;
padding: 3px 20px;
white-space: nowrap;
}
.top-user-menu {
color: rgb(255, 255, 255);
color: rgb(255 255 255);
}
.top-menu-bar-language-select form {
border-bottom: 1px solid transparent;
border-top: 1px solid transparent;
-webkit-box-shadow: inset 0 1px 0 rgb(255 255 255), 0 1px 0 rgb(255 255 255);
box-shadow: inset 0 1px 0 rgb(255 255 255), 0 1px 0 rgb(255 255 255);
margin-bottom: 7.5px;
margin-left: 5px;
margin-right: 5px;
margin-top: 7.5px;
margin: 7.5px 5px;
padding: 10px 15px;
}
}
@media all and (max-width: 768px) {
.navbar-nav .open .dropdown-menu .dropdown-header, .navbar-nav .open .dropdown-menu > li > a {
.navbar-nav .open .dropdown-menu .dropdown-header,
.navbar-nav .open .dropdown-menu > li > a {
padding: 5px 15px 5px 25px;
}
}
@media all and (min-width: 768px) {
.top-user-menu {
color: rgb(123, 138, 139);
color: rgb(123 138 139);
}
.top-menu-bar-language-select form {
border: 0;
-webkit-box-shadow: none;
box-shadow: none;
margin-left: 0;
margin-right: 0;
@ -188,7 +176,7 @@ ul.list-group.list-group-horizontal > li.list-group-item {
------------------------------------------------------------------------------------- */
@media all {
.nav-item-eve-time .eve-time-wrapper {
color: rgb(255, 255, 255);
color: rgb(255 255 255);
display: block;
line-height: 21px;
padding: 10px 15px;
@ -207,14 +195,11 @@ ul.list-group.list-group-horizontal > li.list-group-item {
@media (min-width: 768px) {
/* class for vertically aligning columns in a bootstrap row */
.row.vertical-flexbox-row2 {
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
flex-wrap: wrap;
}
.row.vertical-flexbox-row2 > [class*='col-'] {
.row.vertical-flexbox-row2 > [class*="col-"] {
display: flex;
flex-direction: column;
}

View File

@ -1,20 +1,20 @@
.checkbox label:after,
.radio label:after {
content: '';
display: table;
.checkbox label::after,
.radio label::after {
clear: both;
content: "";
display: table;
}
.checkbox .cr,
.radio .cr {
position: relative;
border: 1px solid rgb(169 169 169);
border-radius: 0.25em;
display: inline-block;
border: 1px solid #a9a9a9;
border-radius: .25em;
width: 1.3em;
height: 1.3em;
float: left;
margin-right: .5em;
height: 1.3em;
margin-right: 0.5em;
position: relative;
width: 1.3em;
}
.radio .cr {
@ -23,11 +23,11 @@
.checkbox .cr .cr-icon,
.radio .cr .cr-icon {
position: absolute;
font-size: .8em;
line-height: 0;
top: 50%;
font-size: 0.8em;
left: 20%;
line-height: 0;
position: absolute;
top: 50%;
}
.radio .cr .cr-icon {
@ -41,18 +41,18 @@
.checkbox label input[type="checkbox"] + .cr > .cr-icon,
.radio label input[type="radio"] + .cr > .cr-icon {
transform: scale(3) rotateZ(-20deg);
opacity: 0;
transition: all .3s ease-in;
transform: scale(3) rotateZ(-20deg);
transition: all 0.3s ease-in;
}
.checkbox label input[type="checkbox"]:checked + .cr > .cr-icon,
.radio label input[type="radio"]:checked + .cr > .cr-icon {
transform: scale(1) rotateZ(0deg);
opacity: 1;
transform: scale(1) rotateZ(0deg);
}
.checkbox label input[type="checkbox"]:disabled + .cr,
.radio label input[type="radio"]:disabled + .cr {
opacity: .5;
opacity: 0.5;
}