Fixed css class naming
This commit is contained in:
parent
75b44e28eb
commit
8986c4b762
4 changed files with 118 additions and 84 deletions
|
|
@ -73,7 +73,7 @@ h1, h2, h3, h4, h5{
|
|||
margin-top: var(--top-bar);
|
||||
}
|
||||
/* Screens */
|
||||
[data-screen="search"] .container-fluid > .row, [data-screen="profile"] .container-fluid > .row, [data-screen="invitations"] .container-fluid > .row{
|
||||
[data-screen="search"] .container-fluid > .row, [data-screen="profile"] .container-fluid > .row, [data-screen="invitations"] .container-fluid > .row, [data-screen="documents"] .container-fluid > .row{
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
|
|
@ -185,15 +185,15 @@ h1, h2, h3, h4, h5{
|
|||
.form-switch + a[data-bs-toggle="tooltip"]{
|
||||
margin-left: 0.25rem;
|
||||
}
|
||||
#tandem-meet .col{
|
||||
#tandemMeet .col{
|
||||
text-align: center;
|
||||
padding: 1.5rem;
|
||||
transition: all ease-out 0.3s;
|
||||
}
|
||||
#tandem-meet .col img{
|
||||
#tandemMeet .col img{
|
||||
margin-bottom: 1rem;
|
||||
}
|
||||
#tandem-meet .col label{
|
||||
#tandemMeet .col label{
|
||||
font-weight: initial;
|
||||
}
|
||||
#tandemExplanations{
|
||||
|
|
@ -256,10 +256,10 @@ article li:not(:first-of-type){
|
|||
color: darkgray;
|
||||
letter-spacing: .25em;
|
||||
}
|
||||
.profile .userAvatar{
|
||||
.profile .user-avatar{
|
||||
text-align: center;
|
||||
}
|
||||
.userAvatar img{
|
||||
.user-avatar img{
|
||||
width: 9rem;
|
||||
height: 9rem;
|
||||
object-fit: cover;
|
||||
|
|
@ -270,10 +270,10 @@ article li:not(:first-of-type){
|
|||
.profile .label, #signalModal label{
|
||||
font-weight: 700;
|
||||
}
|
||||
.userDescription{
|
||||
.user-description{
|
||||
margin-top: 1.5em;
|
||||
}
|
||||
.profileOptions{
|
||||
.profile-options{
|
||||
margin-top: 2em;
|
||||
justify-content: end;
|
||||
display: flex;
|
||||
|
|
@ -286,22 +286,22 @@ article li:not(:first-of-type){
|
|||
/* invitations */
|
||||
#invitationsResults ul{
|
||||
padding-left: 0;
|
||||
margin-bottom: 0
|
||||
}
|
||||
.invitation{
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 2rem;
|
||||
border-top: 1px solid var(--bs-gray-300);
|
||||
border-top: 1px dotted var(--bs-gray-400);
|
||||
padding-top: .75rem;
|
||||
}
|
||||
.invitation .userPseudo{
|
||||
.invitation .user-pseudo{
|
||||
margin-bottom: 0.125rem;
|
||||
}
|
||||
.invitation:not(:first-of-type){
|
||||
margin-top: .75rem;
|
||||
|
||||
}
|
||||
.invitation .userAvatar img{
|
||||
.invitation .user-avatar img{
|
||||
width: 3rem;
|
||||
height: 3rem;
|
||||
}
|
||||
|
|
@ -317,6 +317,15 @@ article li:not(:first-of-type){
|
|||
align-self: center;
|
||||
}
|
||||
|
||||
/* documents */
|
||||
#documentsResults ul{
|
||||
padding-left: 0;
|
||||
margin-bottom: 0;
|
||||
}
|
||||
#documentsResults ul li{
|
||||
list-style-type: none;
|
||||
}
|
||||
|
||||
/* search filters */
|
||||
#searchFilters{
|
||||
border: 1px solid white;
|
||||
|
|
@ -356,13 +365,22 @@ article li:not(:first-of-type){
|
|||
.btn-cta, .btn-primary, .btn-secondary, .btn-outline-primary, .btn-outline-secondary{
|
||||
font-size: 1em;
|
||||
}
|
||||
.btn-link, .text-link{
|
||||
.btn-link, .text-link, .btn-icon{
|
||||
color: var(--bs-link-color);
|
||||
text-decoration: none;
|
||||
}
|
||||
.btn-link{
|
||||
padding: .725rem 1rem;
|
||||
}
|
||||
.btn-icon{
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
.btn-icon .icon-ui{
|
||||
margin-right: 0.5rem;
|
||||
width: 1.5em;
|
||||
height: 1.5em;
|
||||
}
|
||||
.btn-link:focus-visible, .text-link:focus-visible{
|
||||
text-decoration: underline;
|
||||
color: var(--bs-link-color);
|
||||
|
|
@ -375,7 +393,7 @@ article li:not(:first-of-type){
|
|||
border-color: var(--bs-gray-500);
|
||||
}
|
||||
.btn-stack{
|
||||
display: flex;
|
||||
display: inline-flex;
|
||||
justify-content: flex-start;
|
||||
gap: 1rem;
|
||||
}
|
||||
|
|
@ -403,7 +421,6 @@ label[for="lang"]{
|
|||
margin-top: 0.25rem;
|
||||
background: var(--accent-light);
|
||||
border-radius: 0.25rem;
|
||||
|
||||
}
|
||||
.autocomplete-suggestion{
|
||||
padding: 1rem;
|
||||
|
|
@ -512,7 +529,7 @@ nav .icon-ui{
|
|||
margin-right: .75rem;
|
||||
}
|
||||
/* media queries */
|
||||
@media (width <= 576px) {
|
||||
@media only screen and (width <= 576px) {
|
||||
:root{
|
||||
--div-padding: 2em;
|
||||
--bottom-bar: 40px;
|
||||
|
|
@ -533,28 +550,25 @@ nav .icon-ui{
|
|||
.partners-logo-grid{
|
||||
grid-template-columns: repeat(auto-fit, minmax(6em, 1fr));
|
||||
}
|
||||
.userAvatar img{
|
||||
.user-avatar img{
|
||||
width: 6rem;
|
||||
height: 6rem;
|
||||
}
|
||||
.profile .userAvatar, .profile .userPseudo, .offcanvas .userAvatar{
|
||||
.profile .user-avatar, .profile .user-pseudo, .offcanvas .user-avatar{
|
||||
margin: 0 auto;
|
||||
text-align: center
|
||||
}
|
||||
.profile .userPseudo{
|
||||
.profile .user-pseudo{
|
||||
margin: .5em auto;
|
||||
}
|
||||
.invitation{
|
||||
gap: 1rem;
|
||||
}
|
||||
.invitation .userPseudo{
|
||||
.invitation .user-pseudo{
|
||||
text-align: left;
|
||||
}
|
||||
.invitation-options button span{
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
@media (width <= 992px) {
|
||||
@media only screen and (width <= 992px) {
|
||||
:root{
|
||||
--top-bar: 5rem;
|
||||
}
|
||||
|
|
@ -564,7 +578,7 @@ nav .icon-ui{
|
|||
#avatarContainer{
|
||||
text-align: center;
|
||||
}
|
||||
.profileOptions, .invitation-options{
|
||||
.profile-options, .invitation-options{
|
||||
display: grid;
|
||||
gap: 0 .5rem;
|
||||
width: fit-content;
|
||||
|
|
@ -573,11 +587,11 @@ nav .icon-ui{
|
|||
.invitation-options{
|
||||
margin: 0;
|
||||
}
|
||||
.offcanvas .userAvatar{
|
||||
.offcanvas .user-avatar{
|
||||
margin: 0 auto;
|
||||
text-align: center
|
||||
}
|
||||
.offcanvas .userAvatar img{
|
||||
.offcanvas .user-avatar img{
|
||||
width: 5rem;
|
||||
height: 5rem;
|
||||
}
|
||||
|
|
@ -618,7 +632,7 @@ nav .icon-ui{
|
|||
.offcanvas li:not(:first-child){
|
||||
margin-top: initial;
|
||||
}
|
||||
.offcanvas .userPseudo{
|
||||
.offcanvas .user-pseudo{
|
||||
font-weight: 700;
|
||||
margin-top: .5em;
|
||||
}
|
||||
|
|
@ -636,8 +650,14 @@ nav .icon-ui{
|
|||
.separator.menu-admin > .btn-link{
|
||||
padding: .725rem 1rem .725rem 0;
|
||||
}
|
||||
.invitation-options button span{
|
||||
display: none;
|
||||
}
|
||||
.invitation-options button .icon-ui{
|
||||
margin: 0;
|
||||
}
|
||||
}
|
||||
@media (576px <= width <= 992px) {
|
||||
@media only screen and (576px <= width <= 992px) {
|
||||
.btn-stack{
|
||||
justify-content: center;
|
||||
}
|
||||
|
|
@ -648,7 +668,7 @@ nav .icon-ui{
|
|||
text-align: left;
|
||||
}
|
||||
}
|
||||
@media (hover: hover) {
|
||||
@media only screen and (hover: hover) {
|
||||
.btn-cta:hover{
|
||||
background-color: var(--accent-normal);
|
||||
color: white;
|
||||
|
|
@ -664,15 +684,19 @@ nav .icon-ui{
|
|||
background-color: transparent;
|
||||
text-underline-offset: 0.375em;
|
||||
}
|
||||
#tandem-meet .col:hover{
|
||||
.btn-icon:hover{
|
||||
border: 1px solid var(--bs-link-color);
|
||||
color: var(--bs-link-color);
|
||||
background-color: transparent;
|
||||
}
|
||||
#tandemMeet .col:hover{
|
||||
background-color: var(--accent-light);
|
||||
border-radius: 0.5rem;
|
||||
transition: all ease-out 0.3s;
|
||||
}
|
||||
#tandem-meet .col:hover .form-check-input{
|
||||
#tandemMeet .col:hover .form-check-input{
|
||||
--bs-border-color: var(--primary);
|
||||
}
|
||||
|
||||
.side-menu .nav-link:not(.active):hover{
|
||||
color: black;
|
||||
background: #fdc314;
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue