diff --git a/static/css/style.css b/static/css/style.css index 9a2861c..67bd12e 100644 --- a/static/css/style.css +++ b/static/css/style.css @@ -1,131 +1,43 @@ -/* Dark mode */ -/* @media (prefers-color-scheme: dark) { */ - body { - background-color: #2d2a2e; - color: #f7f6f3; - } - - blockquote { - background: #2d2a2e; - } - - a { - color: #ac9c6d; - } - - header { - background: #2d2a2e; - border-bottom: 2px dotted #EBC3DB; - } - - .article-meta, .menu a { - background: #393E41; - color: white; - } - - table { - margin: auto; - border-top: 1px solid #666; - border-bottom: 1px solid #666; - } - table thead th { border-bottom: 1px solid #666; } - th, td { padding: 5px; } - tr:nth-child(even) { background: #666 } - -/* } */ - - -/* Light mode */ -/* @media (prefers-color-scheme: light) { */ - /* body { */ - /* background-color: #f7f6f3; */ - /* color: #2d2a2e; */ - /* } */ - - /* blockquote { */ - /* background: #f7f6f3; */ - /* } */ - - /* a { */ - /* color: #ac9c6d; */ - /* } */ - - /* header { */ - /* background: #f7f6f3; */ - /* border-bottom: 2px dotted #3d3a3e */ - /* } */ - - /* .article-meta, .menu a { */ - /* background: #E8DBC5; */ - /* color: #2d2a2e; */ - /* } */ - - /* table { */ - /* margin: auto; */ - /* border-top: 1px solid #666; */ - /* border-bottom: 1px solid #666; */ - /* } */ - /* table thead th { border-bottom: 1px solid #ddd; } */ - /* th, td { padding: 5px; } */ - /* tr:nth-child(even) { background: #eee } */ - -/* } */ +html{ + background-color: #2d2a2e; + color: #f7f6f3; +} body { max-width: 800px; margin: auto; padding: .2em; line-height: 1.5em; - font-size: 19px; - - background-color: #2d2a2e; - color: #f7f6f3; + font-size: 19px; } h1 { line-height: 1.5em; } -/* Table of Contents, if wanted - -Add to yaml: - -output: - blogdown::html_page: - toc: true - - */ - -#TableOfContents, #TOC { - border: 1px solid #eee; - border-radius: 5px; +ul { + list-style-type: none; } -/* Header and Footer */ -.menu li { display: inline-block; } -.article-meta, .menu a { - text-decoration: none; - padding: 5px; - border-radius: 5px; - border-style: dotted; - border-width: 1px; - margin: 20px 0px 20px 0px; +.menu{ + text-align: center; } -.terms { font-size: .9em; } -.menu, .article-meta, footer { text-align: center; } -.title { font-size: 1.1em; } -footer a { text-decoration: none; } +.menu li { + display: inline-block; +} .pull-left { float: left } + .pull-right { float: right } a { + color: #ac9c6d; text-decoration: none; } @@ -135,10 +47,20 @@ a:hover { /* Adjust background at your leisure! */ header { - position: relative; - width: 100%; - height: 1.75rem; - font-size: 1rem; + border-bottom: 2px dotted #f7f6f3; + position: relative; + width: 100%; + height: 1.75rem; + font-size: 1rem; +} + +.menu a { + text-decoration: none; + padding: 5px; + border-radius: 5px; + border-style: dotted; + border-width: 1px; + margin: 20px 0px 20px 0px; } header ul, @@ -152,15 +74,18 @@ header nav { } header a { - color: #fff; + color: #f7f6f3; line-height: 1.75rem; padding: 0 0.5rem } header a:hover, header .current a { - color: #fff + color: #f7f6f3 } +footer { + text-align: center; +} /* Code Boxes */ pre { border: 2px solid #EBC3DB; @@ -195,15 +120,11 @@ main { display: block; font-size: 1.1em; } + main a { font-weight: bold; } -blockquote { - border-left: 5px solid #ccc; - padding: 3px 1em 3px; -} - .content-wrapper { padding: 0px 12px 0px 12px; } @@ -216,33 +137,12 @@ blockquote { display: block; } -#table-of-contents { -} - -/* Small devices, phones */ +/* Small devices */ @media only screen and (min-width : 480px) { - #foxy { + #personal { min-width: 40px; float: center; padding: 10px 10px 10px 20px; display: block; } - } - -/* 在大屏幕上应用特定样式 */ -@media screen and (min-width: 768px) { - #table-of-contents { - position: fixed; /* 固定定位,使其悬浮在页面上 */ - top: 50%; /* 上边距为50% */ - right: 15px; /* 右边距为0,将其放在右侧 */ - transform: translateY(-50%); /* 使用transform来垂直居中 */ - background-color: #f0f0f0; /* 设置背景颜色 */ - padding: 10px; /* 添加一些内边距以增加可读性 */ - box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.2); /* 添加阴影效果 */ - width: 250px; /* 设置宽度 */ - max-height: 70vh; /* 设置最大高度为视口的70% */ - overflow-y: auto; /* 添加垂直滚动条 */ - } -} - diff --git a/static/css/theme-override.css b/static/css/theme-override.css index ac945bf..1e8f759 100644 --- a/static/css/theme-override.css +++ b/static/css/theme-override.css @@ -1,20 +1 @@ footer { font-size: 90%; } - -ul { - list-style-type: none; -} - -body { - background-color: #2d2a2e; - color: #f7f6f3; -} - -a { - color: #ac9c6d; -} - -header { - background: #2d2a2e; - border-bottom: 2px dotted #f7f6f3; -} -