Main Page/styles.css: Difference between revisions

No edit summary
No edit summary
 
(17 intermediate revisions by the same user not shown)
Line 2: Line 2:
font-size:1.6em;
font-size:1.6em;
font-weight: bold;
font-weight: bold;
text-shadow: rgba(150, 150, 150, 0.6) 2px 1px 2px;
}
}
.text-container {
.text-container {
Line 53: Line 54:
/*什么*/
/*什么*/
.textbox {
.textbox {
margin: 0 auto;
     max-width: 1320px;
     max-width: 1320px;
     height: auto;
     height: auto;
Line 59: Line 61:
     display: flex;
     display: flex;
     flex-wrap: wrap;
     flex-wrap: wrap;
    justify-content: center;
    box-shadow: 5px 5px 2px rgba(150, 150, 150, 0.6);
}
}
.left-child, .right-child {
.left-child, .right-child {
Line 75: Line 79:
     }
     }
     .left-child {
     .left-child {
         border-right: 1px solid black;
         border-left: 1px solid black;
         max-width:390px;
         max-width:390px;
     }
     }
Line 88: Line 92:
     flex-wrap: wrap;
     flex-wrap: wrap;
     width: 100%;
     width: 100%;
    justify-content: center;
}
}
.container p a.external:visited{
.container p * a{
color: white;
}
.container p a{
max-width:270px;
max-width:270px;
min-width:190px;
     flex: 1 1 calc(33.333% - 10px); /* 3 items per row with space for borders */
     flex: 1 1 calc(33.333% - 10px); /* 3 items per row with space for borders */
     height: 64px;
     height: 64px;
    background-color: rgba(0, 0, 255, 0.8); /* 80% transparent blue */
    border: 5px solid rgba(255, 0, 0, 0.8); /* 5px 80% transparent red */
     font-weight: bold;
     font-weight: bold;
     font-size:20px;
     font-size:20px;
Line 106: Line 107:
     margin: 5px; /* Space between items */
     margin: 5px; /* Space between items */
     text-decoration: none;
     text-decoration: none;
     transition: all 0.15s ease-in;
     transition: all 0.2s ease-in;
    box-shadow: 5px 5px 2px rgba(150, 150, 150, 0.6);
    border-width:5px;
    border-style: solid;
}
.container p * a:hover{
height: 72px;
box-shadow: 7px 7px 6px rgba(150, 150, 150, 0.6);
border-width:12px;
}
.container p * a.external{
background-image:none;
}
.container p .en a{
background-color: #012169; /* 80% transparent blue */
    border-color: #c8102e; /* 5px 80% transparent red */
    color: white;
}
.container p .en a.external:visited{
color: white;
}
.container p .zh a{
background-color: #ee1c25; /* 80% transparent blue */
    border-color: #ee1c25; /* 5px 80% transparent red */
    color: #ffff00;
}
.container p .zh a.external:visited{
color: #ffff00;
}
.container p .ja a{
background-color: white; /* 80% transparent blue */
    border-color: white; /* 5px 80% transparent red */
    color: #bd0029;
}
.container p .ja a.external:visited{
color: #bd0029;
}
.container p .ko a{
background-color: white; /* 80% transparent blue */
    border-color: #000000; /* 5px 80% transparent red */
    color: #CD2E3A;
}
.container p .ko a span{
    color: #0047A0;
}
.container p .ko a.external:visited{
color: #CD2E3A;
}
}