undo alphabetizing css classes
This commit is contained in:
parent
3130e73464
commit
e5158a41b3
1 changed files with 155 additions and 144 deletions
299
public/style.css
299
public/style.css
|
|
@ -1,35 +1,23 @@
|
||||||
a {
|
:root {
|
||||||
color: #f3bbae;
|
--size: calc(100vmin / 1.618033988749895);
|
||||||
transition: all 0.3s;
|
--primary-text-size: 12px;
|
||||||
}
|
}
|
||||||
|
|
||||||
p {
|
html,
|
||||||
|
body {
|
||||||
|
width: 100%;
|
||||||
|
height: 100vh;
|
||||||
|
overflow: hidden;
|
||||||
|
}
|
||||||
|
|
||||||
|
body {
|
||||||
margin: 0;
|
margin: 0;
|
||||||
font-size: var(--primary-text-size);
|
|
||||||
}
|
|
||||||
|
|
||||||
a {
|
|
||||||
display: flex;
|
|
||||||
justify-content: center;
|
|
||||||
align-items: center;
|
|
||||||
}
|
|
||||||
|
|
||||||
::-webkit-scrollbar {
|
|
||||||
height: 3px;
|
|
||||||
}
|
|
||||||
|
|
||||||
::-webkit-scrollbar-thumb {
|
|
||||||
background: #f3bbae;
|
|
||||||
}
|
|
||||||
|
|
||||||
::-webkit-scrollbar-track {
|
|
||||||
background: #241917;
|
background: #241917;
|
||||||
|
color: #f3bbae;
|
||||||
|
font-family: Monaco, monospace !important;
|
||||||
}
|
}
|
||||||
|
|
||||||
.alt-bullet {
|
body,
|
||||||
padding-left: 1rem !important;
|
|
||||||
}
|
|
||||||
|
|
||||||
.braille {
|
.braille {
|
||||||
display: flex;
|
display: flex;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
|
|
@ -45,27 +33,29 @@ a {
|
||||||
font: 12px/12px "Iosevka Web", monospace;
|
font: 12px/12px "Iosevka Web", monospace;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.braille>* {
|
||||||
|
white-space: pre;
|
||||||
|
}
|
||||||
|
|
||||||
.braille .hidden {
|
.braille .hidden {
|
||||||
position: fixed;
|
position: fixed;
|
||||||
bottom: 100%;
|
bottom: 100%;
|
||||||
right: 100%;
|
right: 100%;
|
||||||
}
|
}
|
||||||
|
|
||||||
.braille>* {
|
.globe-txt {
|
||||||
white-space: pre;
|
display: flex;
|
||||||
|
position: fixed;
|
||||||
|
right: 0;
|
||||||
}
|
}
|
||||||
|
|
||||||
.bullet-text {
|
@media only screen and (max-width: 625px) {
|
||||||
font-size: var(--primary-text-size);
|
.globe-txt {
|
||||||
text-align: left;
|
position: fixed;
|
||||||
z-index: 2;
|
right: 50%;
|
||||||
position: relative;
|
top: 50%;
|
||||||
}
|
transform: translate(50%, -50%);
|
||||||
|
}
|
||||||
.bullet::before {
|
|
||||||
content: "-";
|
|
||||||
display: inline-block;
|
|
||||||
width: 1em;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
.center-text {
|
.center-text {
|
||||||
|
|
@ -82,87 +72,29 @@ a {
|
||||||
left: 15%;
|
left: 15%;
|
||||||
}
|
}
|
||||||
|
|
||||||
.code {
|
@media only screen and (max-width: 625px) {
|
||||||
word-wrap: break-word;
|
.center-text {
|
||||||
display: block;
|
left: 15px;
|
||||||
font-size: var(--primary-text-size);
|
right: 15px;
|
||||||
background-color: #241917;
|
margin-left: 0;
|
||||||
color: #fff !important;
|
margin-top: 0;
|
||||||
border: 4px solid #f3bbae92;
|
max-width: 100vw;
|
||||||
padding: 5px;
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
.dashboard {
|
::-webkit-scrollbar {
|
||||||
display: flex;
|
height: 3px;
|
||||||
flex-direction: row;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
.globe-txt {
|
::-webkit-scrollbar-track {
|
||||||
display: flex;
|
|
||||||
position: fixed;
|
|
||||||
right: 0;
|
|
||||||
}
|
|
||||||
|
|
||||||
ul {
|
|
||||||
list-style-type: none;
|
|
||||||
}
|
|
||||||
|
|
||||||
ul.custom-bullet {
|
|
||||||
list-style-type: none;
|
|
||||||
}
|
|
||||||
|
|
||||||
ul.custom-bullet li {
|
|
||||||
position: relative;
|
|
||||||
}
|
|
||||||
|
|
||||||
ul.custom-bullet li::before {
|
|
||||||
content: "-";
|
|
||||||
position: absolute;
|
|
||||||
left: -15px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.links {
|
|
||||||
padding-left: 0;
|
|
||||||
}
|
|
||||||
|
|
||||||
.links a {
|
|
||||||
text-decoration-skip: spaces;
|
|
||||||
}
|
|
||||||
|
|
||||||
body {
|
|
||||||
width: 100%;
|
|
||||||
height: 100vh;
|
|
||||||
overflow: hidden;
|
|
||||||
}
|
|
||||||
|
|
||||||
body {
|
|
||||||
margin: 0;
|
|
||||||
background: #241917;
|
background: #241917;
|
||||||
color: #f3bbae;
|
|
||||||
font-family: Monaco, monospace !important;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
:root {
|
::-webkit-scrollbar-thumb {
|
||||||
--size: calc(100vmin / 1.618033988749895);
|
background: #f3bbae;
|
||||||
--primary-text-size: 12px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.tab-content {
|
|
||||||
display: none;
|
|
||||||
padding: 1rem;
|
|
||||||
}
|
|
||||||
|
|
||||||
.tab-content a[href]:hover {
|
|
||||||
color: #ffffff;
|
|
||||||
}
|
|
||||||
|
|
||||||
.tab-icon {
|
|
||||||
width: var(--primary-text-size);
|
|
||||||
color: #f3bbae;
|
|
||||||
fill: #f3bbae;
|
|
||||||
padding-left: 0.25rem;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.tab,
|
||||||
.tab-link {
|
.tab-link {
|
||||||
cursor: pointer;
|
cursor: pointer;
|
||||||
border-width: 0 4px 4px 0;
|
border-width: 0 4px 4px 0;
|
||||||
|
|
@ -183,10 +115,36 @@ body {
|
||||||
width: 12px;
|
width: 12px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.tab:hover label {
|
a {
|
||||||
background-color: #f3bbae92;
|
color: #f3bbae;
|
||||||
color: #241917;
|
transition: all 0.3s;
|
||||||
font-weight: 700;
|
}
|
||||||
|
|
||||||
|
p {
|
||||||
|
margin: 0;
|
||||||
|
font-size: var(--primary-text-size);
|
||||||
|
}
|
||||||
|
|
||||||
|
.tabbed {
|
||||||
|
overflow-x: hidden;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tabbed [type="radio"] {
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
ul.custom-bullet {
|
||||||
|
list-style-type: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
ul.custom-bullet li {
|
||||||
|
position: relative;
|
||||||
|
}
|
||||||
|
|
||||||
|
ul.custom-bullet li::before {
|
||||||
|
content: "-";
|
||||||
|
position: absolute;
|
||||||
|
left: -15px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.tab>label {
|
.tab>label {
|
||||||
|
|
@ -198,24 +156,65 @@ body {
|
||||||
transition: all 0.3s;
|
transition: all 0.3s;
|
||||||
}
|
}
|
||||||
|
|
||||||
.tabbed {
|
.tab:hover label {
|
||||||
overflow-x: hidden;
|
background-color: #f3bbae92;
|
||||||
|
color: #241917;
|
||||||
|
font-weight: 700;
|
||||||
}
|
}
|
||||||
|
|
||||||
.tabbed [type="radio"] {
|
.tab-content {
|
||||||
display: none;
|
display: none;
|
||||||
|
padding: 1rem;
|
||||||
}
|
}
|
||||||
|
|
||||||
.tabbed [type="radio"]:nth-of-type(4):checked~.tab-content:nth-of-type(4) {
|
.tabbed [type="radio"]:nth-of-type(1):checked~.tabs .tab:nth-of-type(1) label,
|
||||||
display: block;
|
.tabbed [type="radio"]:nth-of-type(2):checked~.tabs .tab:nth-of-type(2) label,
|
||||||
}
|
.tabbed [type="radio"]:nth-of-type(3):checked~.tabs .tab:nth-of-type(3) label,
|
||||||
|
.tabbed [type="radio"]:nth-of-type(4):checked~.tabs .tab:nth-of-type(4) label,
|
||||||
.tabbed [type="radio"]:nth-of-type(5):checked~.tabs .tab:nth-of-type(5) label {
|
.tabbed [type="radio"]:nth-of-type(5):checked~.tabs .tab:nth-of-type(5) label {
|
||||||
background-color: #f3bbae92;
|
background-color: #f3bbae92;
|
||||||
color: #241917;
|
color: #241917;
|
||||||
font-weight: 700;
|
font-weight: 700;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.tabbed [type="radio"]:nth-of-type(1):checked~.tab-content:nth-of-type(1),
|
||||||
|
.tabbed [type="radio"]:nth-of-type(2):checked~.tab-content:nth-of-type(2),
|
||||||
|
.tabbed [type="radio"]:nth-of-type(3):checked~.tab-content:nth-of-type(3),
|
||||||
|
.tabbed [type="radio"]:nth-of-type(4):checked~.tab-content:nth-of-type(4) {
|
||||||
|
display: block;
|
||||||
|
}
|
||||||
|
|
||||||
|
.code {
|
||||||
|
word-wrap: break-word;
|
||||||
|
display: block;
|
||||||
|
font-size: var(--primary-text-size);
|
||||||
|
background-color: #241917;
|
||||||
|
color: #fff !important;
|
||||||
|
border: 4px solid #f3bbae92;
|
||||||
|
padding: 5px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.bullet-text {
|
||||||
|
font-size: var(--primary-text-size);
|
||||||
|
text-align: left;
|
||||||
|
z-index: 2;
|
||||||
|
position: relative;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tab-content a[href]:hover {
|
||||||
|
color: #ffffff;
|
||||||
|
}
|
||||||
|
|
||||||
|
.visible {
|
||||||
|
z-index: 0;
|
||||||
|
position: absolute;
|
||||||
|
right: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
ul {
|
||||||
|
list-style-type: none;
|
||||||
|
}
|
||||||
|
|
||||||
.tabs {
|
.tabs {
|
||||||
display: flex;
|
display: flex;
|
||||||
align-items: stretch;
|
align-items: stretch;
|
||||||
|
|
@ -224,6 +223,30 @@ body {
|
||||||
padding: 0;
|
padding: 0;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.bullet::before {
|
||||||
|
content: "-";
|
||||||
|
display: inline-block;
|
||||||
|
width: 1em;
|
||||||
|
}
|
||||||
|
|
||||||
|
.alt-bullet {
|
||||||
|
padding-left: 1rem !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.links {
|
||||||
|
padding-left: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.links a {
|
||||||
|
text-decoration-skip: spaces;
|
||||||
|
}
|
||||||
|
|
||||||
|
.dashboard {
|
||||||
|
display: flex;
|
||||||
|
flex-direction: row;
|
||||||
|
}
|
||||||
|
|
||||||
|
.icon,
|
||||||
.text-icon {
|
.text-icon {
|
||||||
fill: #f3bbae;
|
fill: #f3bbae;
|
||||||
width: 12px;
|
width: 12px;
|
||||||
|
|
@ -233,27 +256,15 @@ body {
|
||||||
padding-left: 0.5rem;
|
padding-left: 0.5rem;
|
||||||
}
|
}
|
||||||
|
|
||||||
.visible {
|
.tab-icon {
|
||||||
z-index: 0;
|
width: var(--primary-text-size);
|
||||||
position: absolute;
|
color: #f3bbae;
|
||||||
right: 0;
|
fill: #f3bbae;
|
||||||
|
padding-left: 0.25rem;
|
||||||
}
|
}
|
||||||
|
|
||||||
@media only screen and (max-width: 625px) {
|
a {
|
||||||
.globe-txt {
|
display: flex;
|
||||||
position: fixed;
|
justify-content: center;
|
||||||
right: 50%;
|
align-items: center;
|
||||||
top: 50%;
|
}
|
||||||
transform: translate(50%, -50%);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
@media only screen and (max-width: 625px) {
|
|
||||||
.center-text {
|
|
||||||
left: 15px;
|
|
||||||
right: 15px;
|
|
||||||
margin-left: 0;
|
|
||||||
margin-top: 0;
|
|
||||||
max-width: 100vw;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
Loading…
Add table
Reference in a new issue