User:Aesulus/Membership box.css: Difference between revisions
Content added Content deleted
No edit summary |
(add .membership-header-sub class and borders for .membership-perks-description and .membership-header-sub elements) |
||
(One intermediate revision by the same user not shown) | |||
Line 4: | Line 4: | ||
.membership-icons { |
.membership-icons { |
||
display: flex; |
|||
flex-flow: row wrap; |
|||
padding: 0.5em 1em; |
|||
} |
} |
||
.membership-icons ul { |
.membership-icons ul { |
||
list-style-type: none; |
|||
margin: 0; |
|||
padding: 0; |
|||
} |
} |
||
.membership-icons li { |
.membership-icons li { |
||
display: inline; |
|||
} |
} |
||
/* Constrains height and width to 32x32px |
/* Constrains height and width to 32x32px |
||
.membership-icons img { |
.membership-icons img { |
||
width: 32px; |
|||
height: 32px; |
|||
} |
} |
||
*/ |
*/ |
||
.membership-table { |
.membership-table { |
||
display: flex; |
|||
flex-flow: row wrap; |
|||
⚫ | |||
⚫ | |||
} |
} |
||
.membership-table |
.membership-table > * { |
||
⚫ | |||
⚫ | |||
⚫ | |||
⚫ | |||
margin-left: -1px; |
margin-left: -1px; |
||
margin-top: -1px; |
margin-top: -1px; |
||
Line 42: | Line 39: | ||
} |
} |
||
.membership-header { |
.membership-header, .membership-header-sub { |
||
background: #ededed; |
background: #ededed; |
||
text-align: center; |
|||
font-weight: bold; |
|||
padding: 0.2em 0; |
|||
flex: 100% |
|||
⚫ | |||
⚫ | |||
margin: -1px; |
|||
border: 1px solid #a2a9b1; |
|||
} |
} |
||
.membership-badges-section { |
.membership-badges-section { |
||
flex: 1 300px |
|||
} |
} |
||
.membership-icon-label { |
.membership-icon-label { |
||
flex: 100%; |
|||
} |
} |
||
.membership-perks-section { |
.membership-perks-section { |
||
flex: 2 auto; |
|||
} |
} |
Latest revision as of 11:51, 28 April 2023
.membership-table {
background-color: #f8f9fa;
}
.membership-icons {
display: flex;
flex-flow: row wrap;
padding: 0.5em 1em;
}
.membership-icons ul {
list-style-type: none;
margin: 0;
padding: 0;
}
.membership-icons li {
display: inline;
}
/* Constrains height and width to 32x32px
.membership-icons img {
width: 32px;
height: 32px;
}
*/
.membership-table {
display: flex;
flex-flow: row wrap;
padding-left: 1px;
padding-top: 1px;
}
.membership-table > * {
margin-left: -1px;
margin-top: -1px;
border: 1px solid #a2a9b1;
}
.membership-header, .membership-header-sub {
background: #ededed;
text-align: center;
font-weight: bold;
padding: 0.2em 0;
flex: 100%
}
.membership-perks-description, .membership-header-sub {
margin: -1px;
border: 1px solid #a2a9b1;
}
.membership-badges-section {
flex: 1 300px
}
.membership-icon-label {
flex: 100%;
}
.membership-perks-section {
flex: 2 auto;
}