Difference between revisions of "WangYue.css"
| Line 101: | Line 101: | ||
.center { | .center { | ||
text-align: center; | text-align: center; | ||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
} | } | ||
| Line 123: | Line 116: | ||
.hooks-container { | .hooks-container { | ||
| − | |||
| − | |||
width: 94%; | width: 94%; | ||
padding: 1em 3%; | padding: 1em 3%; | ||
| Line 137: | Line 128: | ||
.contacts-container, .gallery-container, .logs-container { | .contacts-container, .gallery-container, .logs-container { | ||
| − | |||
| − | |||
width: 94%; | width: 94%; | ||
padding: 1em 3%; | padding: 1em 3%; | ||
| Line 155: | Line 144: | ||
.hook-table-label { | .hook-table-label { | ||
| − | |||
font-weight: 600; | font-weight: 600; | ||
padding-left: 0.5em; | padding-left: 0.5em; | ||
| Line 174: | Line 162: | ||
.contacts-container, .gallery-container { | .contacts-container, .gallery-container { | ||
| − | |||
| − | |||
width: 94%; | width: 94%; | ||
padding: 1em 3%; | padding: 1em 3%; | ||
| Line 183: | Line 169: | ||
.contacts-container a { | .contacts-container a { | ||
| − | color: | + | color: blue |
} | } | ||
.contacts-container a:visited { | .contacts-container a:visited { | ||
| − | color: | + | color: purple |
} | } | ||
| Line 199: | Line 185: | ||
.logs-container a { | .logs-container a { | ||
| − | color: | + | color: blue |
} | } | ||
.logs-container a:visited { | .logs-container a:visited { | ||
| − | color: | + | color: purple |
} | } | ||
| Line 224: | Line 210: | ||
.gallery-content a { | .gallery-content a { | ||
| − | color: | + | color: blue |
} | } | ||
.gallery-content a:visited { | .gallery-content a:visited { | ||
| − | color: | + | color: purple |
} | } | ||
Revision as of 18:21, 7 November 2024
.container { display: flex; justify-content: center; width: 100%; height: auto; margin: auto; display: flex; flex-direction: column; font-family: "Brush Script MT"; background-color: #F7F6f4; }
.top-section { display: flex; }
.header-container { width: 100%; display: flex; justify-content: center; padding: 2em 0; }
.header-title { width: 94%; font-size: 70px; letter-spacing: 2px; word-spacing: 2px; color: #000000; font-weight: 700; text-decoration: none; font-style: normal; font-variant: normal; text-transform: none; }
.left-panel { width: 30%; height: auto; font-size:1.7em; }
.right-panel { width: 70%; display: flex; flex-direction: column; justify-content: center; }
.portrait-image { width: 100%; }
.portrait-image img { width: 100%; height: auto; margin-bottom: 1em; }
.hr-image { width 100px; height: auto; text-align: center; }
.info-table { margin: auto; width: 30%; padding: 0 1em; }
.info-table-label { font-weight: 600; width: 50%; }
.icon { display: flex; justify-content: center; }
.photo-banner { width: 100%; }
.photo-banner img { width: 100%; height: auto; }
.mid-banner { margin-bottom: -1em; }
.biography-container { width: 94%; padding: 1em 3%; font-size: 1.7em; }
.center { text-align: center; }
.label { margin: 0.2em 0; font-size: 1.7em; font-weight: 600; font-style: italic; }
.white { color: lightgray; border-color: lightgray; }
.hooks-container { width: 94%; padding: 1em 3%; font-size: 1.7em; display: flex; flex-direction: column; }
.hooks-container, .contacts-container .label { margin-bottom: 1em; }
.contacts-container, .gallery-container, .logs-container { width: 94%; padding: 1em 3%; display: flex; flex-direction: column; }
.hooks-content { width: 100%; display: flex; }
.hooks-table { width: 70%; }
.hook-table-label { font-weight: 600; padding-left: 0.5em; }
.anim-gif { width: 30%; display: flex; flex-direction: column; justify-content: center; }
.anim-gif img { width: 100%; height: auto; border-radius: 30%; }
.contacts-container, .gallery-container { width: 94%; padding: 1em 3%; display: flex; flex-direction: column; }
.contacts-container a { color: blue }
.contacts-container a:visited { color: purple }
.contacts-container a:hover { color: darkred }
.logs-container { margin: 0 1em; }
.logs-container a { color: blue }
.logs-container a:visited { color: purple }
.logs-container a:hover { color: darkred }
.gallery-content ul { display: flex; flex-wrap: wrap; list-style-type: none; justify-content: center; }
.gallery-content img { height: 240px; width: 100%; max-width: 100%; }
.gallery-content a { color: blue }
.gallery-content a:visited { color: purple }
.gallery-content a:hover { color: darkred }
