mirror of
https://github.com/zumbiepig/MineXLauncher.git
synced 2025-06-26 10:05:10 +00:00
clean up css, update b1.7.3
This commit is contained in:
zumbiepig
@@ -10,8 +10,8 @@ body {
|
||||
}
|
||||
|
||||
.title-bar,
|
||||
.top-bar,
|
||||
.top-menu {
|
||||
.top-title,
|
||||
.top-nav {
|
||||
background-color: #4a2f1b;
|
||||
color: #f5e0c3;
|
||||
box-shadow: 0 2px 4px rgba(0, 0, 0, 0.3);
|
||||
@@ -26,8 +26,8 @@ body {
|
||||
border-bottom: 1px solid #4a2f1b;
|
||||
}
|
||||
|
||||
.nav-item:hover,
|
||||
.nav-item.selected {
|
||||
.nav-bar .nav-item:hover,
|
||||
.nav-bar .nav-item.selected {
|
||||
background-color: #5a3a2a;
|
||||
}
|
||||
|
||||
@@ -36,11 +36,6 @@ body {
|
||||
background-color: #2b1b0f;
|
||||
}
|
||||
|
||||
.tabs .tab:hover,
|
||||
.tabs .tab.selected {
|
||||
color: #ffcc00;
|
||||
}
|
||||
|
||||
.installations {
|
||||
background-color: #3e2a1a;
|
||||
border-top: 1px solid #4a2f1b;
|
||||
@@ -103,10 +98,10 @@ body {
|
||||
background-color: #ff8533;
|
||||
}
|
||||
|
||||
.top-menu ul li {
|
||||
.top-nav ul li {
|
||||
color: #f5e0c3;
|
||||
}
|
||||
|
||||
.top-menu ul li.selected {
|
||||
.top-nav ul li.selected {
|
||||
color: #ffcc00;
|
||||
}
|
||||
|
||||
@@ -22,8 +22,8 @@ body {
|
||||
border-bottom: 1px solid #e0d1e3;
|
||||
}
|
||||
|
||||
.nav-item:hover,
|
||||
.nav-item.selected {
|
||||
.nav-bar .nav-item:hover,
|
||||
.nav-bar .nav-item.selected {
|
||||
background-color: #f4c6d0;
|
||||
}
|
||||
|
||||
@@ -31,26 +31,21 @@ body {
|
||||
background-color: #fef0f5;
|
||||
}
|
||||
|
||||
.top-bar {
|
||||
.top-title {
|
||||
background-color: #f6e7f3;
|
||||
color: #333;
|
||||
}
|
||||
|
||||
.top-menu {
|
||||
.top-nav {
|
||||
background-color: #f6e7f3;
|
||||
color: #333;
|
||||
}
|
||||
|
||||
.top-menu ul li {
|
||||
.top-nav ul li {
|
||||
color: #333;
|
||||
}
|
||||
|
||||
.top-menu ul li.selected {
|
||||
color: #e5a1b8;
|
||||
}
|
||||
|
||||
.tab:hover,
|
||||
.tab.selected {
|
||||
.top-nav ul li.selected {
|
||||
color: #e5a1b8;
|
||||
}
|
||||
|
||||
|
||||
@@ -73,7 +73,7 @@ body {
|
||||
font-size: 16px;
|
||||
}
|
||||
|
||||
nav {
|
||||
.nav-bar {
|
||||
list-style-type: none;
|
||||
padding: 0;
|
||||
margin: 0;
|
||||
@@ -83,7 +83,7 @@ nav {
|
||||
scrollbar-color: #555 #333;
|
||||
}
|
||||
|
||||
.nav-item {
|
||||
.nav-bar .nav-item {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
padding: 15px 20px;
|
||||
@@ -91,18 +91,18 @@ nav {
|
||||
transition: background-color 0.2s;
|
||||
}
|
||||
|
||||
.nav-item:hover,
|
||||
.nav-item.selected {
|
||||
.nav-bar .nav-item:hover,
|
||||
.nav-bar .nav-item.selected {
|
||||
background-color: #444;
|
||||
}
|
||||
|
||||
.nav-icon {
|
||||
.nav-bar .nav-item .nav-icon {
|
||||
width: 24px;
|
||||
height: 24px;
|
||||
margin-right: 15px;
|
||||
}
|
||||
|
||||
.nav-text {
|
||||
.nav-bar .nav-item .nav-text {
|
||||
font-size: 14px;
|
||||
}
|
||||
|
||||
@@ -113,7 +113,7 @@ nav {
|
||||
background-color: #202020;
|
||||
}
|
||||
|
||||
.top-bar {
|
||||
.top-title {
|
||||
background-color: #2c2c2c;
|
||||
padding: 15px 20px;
|
||||
display: flex;
|
||||
@@ -124,7 +124,12 @@ nav {
|
||||
flex-shrink: 0;
|
||||
}
|
||||
|
||||
.top-menu {
|
||||
.top-title span {
|
||||
font-size: 18px;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.top-nav {
|
||||
background-color: #2c2c2c;
|
||||
padding: 10px 20px;
|
||||
display: flex;
|
||||
@@ -135,14 +140,14 @@ nav {
|
||||
flex-shrink: 0;
|
||||
}
|
||||
|
||||
.top-menu ul {
|
||||
.top-nav ul {
|
||||
list-style-type: none;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
display: flex;
|
||||
}
|
||||
|
||||
.top-menu ul li {
|
||||
.top-nav ul li {
|
||||
margin-right: 20px;
|
||||
cursor: pointer;
|
||||
font-size: 16px;
|
||||
@@ -150,38 +155,15 @@ nav {
|
||||
transition: color 0.2s;
|
||||
}
|
||||
|
||||
.top-menu ul li.selected {
|
||||
.top-nav ul li.selected {
|
||||
color: #fff;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.top-menu ul li:hover {
|
||||
.top-nav ul li:hover {
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
.game-title {
|
||||
font-size: 18px;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.tabs {
|
||||
display: flex;
|
||||
}
|
||||
|
||||
.tab {
|
||||
margin-left: 20px;
|
||||
cursor: pointer;
|
||||
color: #888;
|
||||
text-transform: uppercase;
|
||||
font-size: 14px;
|
||||
transition: color 0.2s;
|
||||
}
|
||||
|
||||
.tab:hover,
|
||||
.tab.selected {
|
||||
color: #00cc00;
|
||||
}
|
||||
|
||||
.main-content {
|
||||
display: flex;
|
||||
flex: 1;
|
||||
@@ -435,7 +417,7 @@ nav {
|
||||
|
||||
.mod-list {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(3, 1fr);
|
||||
grid-template-columns: repeat(6, 1fr);
|
||||
gap: 10px;
|
||||
padding: 10px;
|
||||
text-align: center;
|
||||
@@ -644,8 +626,8 @@ nav {
|
||||
margin: 5px;
|
||||
}
|
||||
|
||||
#username-input,
|
||||
#theme-select {
|
||||
.settings-input,
|
||||
.settings-select {
|
||||
width: calc(100% - 22px);
|
||||
padding: 10px;
|
||||
margin-bottom: 10px;
|
||||
@@ -656,13 +638,13 @@ nav {
|
||||
appearance: none;
|
||||
}
|
||||
|
||||
#offline-checkbox {
|
||||
.settings-checkbox {
|
||||
padding: 10px;
|
||||
margin-bottom: 15px;
|
||||
}
|
||||
|
||||
#username-input:focus,
|
||||
#theme-select:focus {
|
||||
.settings-input:focus,
|
||||
.settings-select:focus {
|
||||
outline: none;
|
||||
}
|
||||
|
||||
@@ -694,7 +676,7 @@ nav {
|
||||
|
||||
.article-list {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(3, 1fr);
|
||||
grid-template-columns: repeat(6, 1fr);
|
||||
gap: 10px;
|
||||
padding: 10px;
|
||||
text-align: center;
|
||||
@@ -754,34 +736,6 @@ nav {
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
@keyframes article-open {
|
||||
0% {
|
||||
opacity: 0;
|
||||
scale: 0;
|
||||
}
|
||||
80% {
|
||||
scale: 1.1;
|
||||
}
|
||||
100% {
|
||||
opacity: 1;
|
||||
scale: 1;
|
||||
}
|
||||
}
|
||||
|
||||
@keyframes article-close {
|
||||
0% {
|
||||
opacity: 1;
|
||||
scale: 1;
|
||||
}
|
||||
20% {
|
||||
scale: 1.1;
|
||||
}
|
||||
100% {
|
||||
opacity: 0;
|
||||
scale: 0;
|
||||
}
|
||||
}
|
||||
|
||||
.article .article-content {
|
||||
background-color: #333;
|
||||
padding: 20px;
|
||||
@@ -817,3 +771,62 @@ nav {
|
||||
text-decoration: none;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
@media (max-width: 1750px) {
|
||||
.mod-list,
|
||||
.article-list {
|
||||
grid-template-columns: repeat(5, 1fr);
|
||||
}
|
||||
}
|
||||
@media (max-width: 1500px) {
|
||||
.mod-list,
|
||||
.article-list {
|
||||
grid-template-columns: repeat(4, 1fr);
|
||||
}
|
||||
}
|
||||
@media (max-width: 1250px) {
|
||||
.mod-list,
|
||||
.article-list {
|
||||
grid-template-columns: repeat(3, 1fr);
|
||||
}
|
||||
}
|
||||
@media (max-width: 1000px) {
|
||||
.mod-list,
|
||||
.article-list {
|
||||
grid-template-columns: repeat(2, 1fr);
|
||||
}
|
||||
}
|
||||
@media (max-width: 775px) {
|
||||
.mod-list,
|
||||
.article-list {
|
||||
grid-template-columns: repeat(1, 1fr);
|
||||
}
|
||||
}
|
||||
|
||||
@keyframes article-open {
|
||||
0% {
|
||||
opacity: 0;
|
||||
scale: 0;
|
||||
}
|
||||
80% {
|
||||
scale: 1.1;
|
||||
}
|
||||
100% {
|
||||
opacity: 1;
|
||||
scale: 1;
|
||||
}
|
||||
}
|
||||
|
||||
@keyframes article-close {
|
||||
0% {
|
||||
opacity: 1;
|
||||
scale: 1;
|
||||
}
|
||||
20% {
|
||||
scale: 1.1;
|
||||
}
|
||||
100% {
|
||||
opacity: 0;
|
||||
scale: 0;
|
||||
}
|
||||
}
|
||||
@@ -18,8 +18,8 @@ body {
|
||||
background-color: #262626;
|
||||
}
|
||||
|
||||
.nav-item:hover,
|
||||
.nav-item.selected {
|
||||
.nav-bar .nav-item:hover,
|
||||
.nav-bar .nav-item.selected {
|
||||
background-color: #333;
|
||||
}
|
||||
|
||||
@@ -27,13 +27,13 @@ body {
|
||||
background-color: #1e1e1e;
|
||||
}
|
||||
|
||||
.top-bar {
|
||||
.top-title {
|
||||
background-color: #1a1a1a;
|
||||
color: #e0e0e0;
|
||||
box-shadow: 0 2px 4px rgba(0, 0, 0, 0.5);
|
||||
}
|
||||
|
||||
.top-menu {
|
||||
.top-nav {
|
||||
background-color: #1a1a1a;
|
||||
color: #e0e0e0;
|
||||
box-shadow: 0 2px 4px rgba(0, 0, 0, 0.5);
|
||||
|
||||
@@ -8,7 +8,7 @@ body {
|
||||
box-shadow: 0 0 20px rgba(0, 0, 0, 0.1);
|
||||
}
|
||||
|
||||
.title-bar, .top-bar, .top-menu, .bottom-bar {
|
||||
.title-bar, .top-title, .top-nav, .bottom-bar {
|
||||
background-color: #e0e0e0;
|
||||
color: #333;
|
||||
box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
|
||||
@@ -23,11 +23,11 @@ body {
|
||||
border-bottom: 1px solid #ddd;
|
||||
}
|
||||
|
||||
.nav-item {
|
||||
.nav-bar .nav-item {
|
||||
color: #333;
|
||||
}
|
||||
|
||||
.nav-item:hover, .nav-item.selected {
|
||||
.nav-bar .nav-item:hover, .nav-bar .nav-item.selected {
|
||||
background-color: #ddd;
|
||||
}
|
||||
|
||||
@@ -102,10 +102,10 @@ body {
|
||||
background-color: #66bb6a;
|
||||
}
|
||||
|
||||
.top-menu ul li {
|
||||
.top-nav ul li {
|
||||
color: #666;
|
||||
}
|
||||
|
||||
.top-menu ul li.selected {
|
||||
.top-nav ul li.selected {
|
||||
color: #333;
|
||||
}
|
||||
@@ -9,8 +9,8 @@ body {
|
||||
}
|
||||
|
||||
.title-bar,
|
||||
.top-bar,
|
||||
.top-menu {
|
||||
.top-title,
|
||||
.top-nav {
|
||||
background-color: #4c2c2c;
|
||||
color: #ffcc00;
|
||||
box-shadow: 0 2px 4px rgba(255, 69, 0, 0.2);
|
||||
@@ -25,8 +25,8 @@ body {
|
||||
color: #ff4500;
|
||||
}
|
||||
|
||||
.nav-item:hover,
|
||||
.nav-item.selected {
|
||||
.nav-bar .nav-item:hover,
|
||||
.nav-bar .nav-item.selected {
|
||||
background-color: #5c3c3c;
|
||||
}
|
||||
|
||||
@@ -35,11 +35,6 @@ body {
|
||||
background-color: #2e1a1a;
|
||||
}
|
||||
|
||||
.tabs .tab:hover,
|
||||
.tabs .tab.selected {
|
||||
color: #ff4500;
|
||||
}
|
||||
|
||||
.installations {
|
||||
background-color: #4c2c2c;
|
||||
border-top: 1px solid #5c3c3c;
|
||||
@@ -107,10 +102,10 @@ body {
|
||||
background-color: #ff4500;
|
||||
}
|
||||
|
||||
.top-menu ul li {
|
||||
.top-nav ul li {
|
||||
color: #ffcc00;
|
||||
}
|
||||
|
||||
.top-menu ul li.selected {
|
||||
.top-nav ul li.selected {
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
@@ -9,8 +9,8 @@ body {
|
||||
}
|
||||
|
||||
.title-bar,
|
||||
.top-bar,
|
||||
.top-menu {
|
||||
.top-title,
|
||||
.top-nav {
|
||||
background-color: #4c6c4c;
|
||||
color: #00ff00;
|
||||
box-shadow: 0 2px 4px rgba(0, 255, 0, 0.2);
|
||||
@@ -25,8 +25,8 @@ body {
|
||||
color: #00ff00;
|
||||
}
|
||||
|
||||
.nav-item:hover,
|
||||
.nav-item.selected {
|
||||
.nav-bar .nav-item:hover,
|
||||
.nav-bar .nav-item.selected {
|
||||
background-color: #5c7c5c;
|
||||
}
|
||||
|
||||
@@ -35,11 +35,6 @@ body {
|
||||
background-color: #2e4e2e;
|
||||
}
|
||||
|
||||
.tabs .tab:hover,
|
||||
.tabs .tab.selected {
|
||||
color: #00ff00;
|
||||
}
|
||||
|
||||
.installations {
|
||||
background-color: #4c6c4c;
|
||||
border-top: 1px solid #5c7c5c;
|
||||
@@ -107,10 +102,10 @@ body {
|
||||
background-color: #00ff00;
|
||||
}
|
||||
|
||||
.top-menu ul li {
|
||||
.top-nav ul li {
|
||||
color: #00ff00;
|
||||
}
|
||||
|
||||
.top-menu ul li.selected {
|
||||
.top-nav ul li.selected {
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
@@ -12,8 +12,8 @@ body {
|
||||
}
|
||||
|
||||
.title-bar,
|
||||
.top-bar,
|
||||
.top-menu,
|
||||
.top-title,
|
||||
.top-nav,
|
||||
.bottom-bar {
|
||||
background-color: #222;
|
||||
color: #00ff00;
|
||||
@@ -26,7 +26,7 @@ body {
|
||||
}
|
||||
|
||||
.profile,
|
||||
.nav-item,
|
||||
.nav-bar .nav-item,
|
||||
.installations,
|
||||
.custom-select,
|
||||
.custom-options,
|
||||
@@ -38,10 +38,8 @@ body {
|
||||
color: #00ff00;
|
||||
}
|
||||
|
||||
.nav-item:hover,
|
||||
.nav-item.selected,
|
||||
.tab:hover,
|
||||
.tab.selected,
|
||||
.nav-bar .nav-item:hover,
|
||||
.nav-bar .nav-item.selected,
|
||||
.custom-option:hover,
|
||||
.play-button:hover,
|
||||
.minecraft-button:hover,
|
||||
|
||||
@@ -10,18 +10,16 @@ body {
|
||||
}
|
||||
|
||||
.title-bar,
|
||||
.top-bar,
|
||||
.top-menu,
|
||||
.top-title,
|
||||
.top-nav,
|
||||
.bottom-bar {
|
||||
background-color: rgba(0, 0, 0, 0.7);
|
||||
color: #fff;
|
||||
box-shadow: 0 2px 4px rgba(255, 255, 255, 0.2);
|
||||
}
|
||||
|
||||
.nav-item:hover,
|
||||
.nav-item.selected,
|
||||
.tab:hover,
|
||||
.tab.selected {
|
||||
.nav-bar .nav-item:hover,
|
||||
.nav-bar .nav-item.selected {
|
||||
background-color: rgba(255, 255, 255, 0.1);
|
||||
color: #00ccff;
|
||||
}
|
||||
|
||||
@@ -10,8 +10,8 @@ body {
|
||||
}
|
||||
|
||||
.title-bar,
|
||||
.top-bar,
|
||||
.top-menu,
|
||||
.top-title,
|
||||
.top-nav,
|
||||
.bottom-bar {
|
||||
background-color: #22004d;
|
||||
color: #e0d8ff;
|
||||
@@ -27,8 +27,8 @@ body {
|
||||
border-bottom: 1px solid #330066;
|
||||
}
|
||||
|
||||
.nav-item:hover,
|
||||
.nav-item.selected {
|
||||
.nav-bar .nav-item:hover,
|
||||
.nav-bar .nav-item.selected {
|
||||
background-color: #330066;
|
||||
}
|
||||
|
||||
@@ -37,11 +37,6 @@ body {
|
||||
background-color: #150033;
|
||||
}
|
||||
|
||||
.tabs .tab:hover,
|
||||
.tabs .tab.selected {
|
||||
color: #b300b3;
|
||||
}
|
||||
|
||||
.installations {
|
||||
background-color: #22004d;
|
||||
border-top: 1px solid #330066;
|
||||
@@ -103,8 +98,8 @@ body {
|
||||
background-color: #8000ff;
|
||||
}
|
||||
|
||||
.top-menu ul li:hover,
|
||||
.top-menu ul li.selected {
|
||||
.top-nav ul li:hover,
|
||||
.top-nav ul li.selected {
|
||||
color: #e0d8ff;
|
||||
}
|
||||
|
||||
|
||||
Reference in New Issue
Block a user