decorate.php 29 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794795796797798799800801802803804805806807808809810811812813814815816817818819820821822823824825826827828829830831832833834835836837838839840841842843844845846847848849850851852853854855856857858859860861862863864865866867868869870871872873874875876877878879880881882883884885886887888889890891892893894895896897898899900901902903904905906907908909910911912913914915916917918919920921922923924925926927928929930931932933934935936937938939940941942943944945946947948949950951952953954955956957958959960961962963964965966967968969970971972973974975976977978979980981982983984985986987988989990991992993994995996997998999100010011002100310041005100610071008100910101011101210131014101510161017101810191020102110221023102410251026102710281029103010311032103310341035103610371038103910401041104210431044104510461047104810491050105110521053105410551056105710581059106010611062106310641065106610671068106910701071107210731074107510761077107810791080108110821083108410851086108710881089109010911092109310941095109610971098109911001101110211031104110511061107110811091110111111121113111411151116111711181119112011211122112311241125112611271128112911301131113211331134113511361137113811391140114111421143114411451146114711481149115011511152115311541155115611571158115911601161116211631164116511661167116811691170117111721173117411751176117711781179118011811182118311841185118611871188118911901191119211931194119511961197119811991200120112021203120412051206120712081209121012111212121312141215121612171218121912201221122212231224122512261227122812291230123112321233123412351236123712381239124012411242124312441245124612471248124912501251125212531254125512561257125812591260126112621263126412651266126712681269127012711272127312741275
  1. <?php
  2. function customizer_css() { ?>
  3. <style>
  4. <?php // Style Settings
  5. if(iro_opt('nav_menu_display') == 'unfold'){ ?>
  6. .site-top .lower nav {display: block !important;}
  7. <?php } // Style Settings ?>
  8. <?php
  9. /**
  10. * theme-skin
  11. * */
  12. if (iro_opt('theme_skin')) { ?>
  13. :root{
  14. --theme-skin: <?=iro_opt('theme_skin'); ?>;
  15. --theme-skin-matching:<?=iro_opt('theme_skin_matching'); ?>;
  16. --homepage_widget_transparency:<?=iro_opt('homepage_widget_transparency'); ?>;
  17. --style_menu_selection_radius:<?=iro_opt('style_menu_selection_radius', ''); ?>px;
  18. --load_nextpage_svg:url("<?=iro_opt('load_nextpage_svg'); ?>");
  19. --style_menu_radius:<?=iro_opt('style_menu_radius', ''); ?>px;
  20. --friend-link-shadow: <?=iro_opt('friend_link_shadow_color'); ?>;
  21. --friend-link-title: <?=iro_opt('friend_link_title_matching_color'); ?>;
  22. --inline_code_background_color:<?=iro_opt('inline_code_background_color');?>;
  23. <?php //深色模式主题色 ?>
  24. --theme-skin-dark: <?=iro_opt('theme_skin_dark'); ?>;
  25. --global-font-weight:<?=iro_opt('global_font_weight');?>;
  26. --theme-dm-background_transparency:<?=iro_opt('theme_darkmode_background_transparency')?>;
  27. --exhibition_area_matching_color:<?=iro_opt('exhibition_area_matching_color');?>;
  28. --inline_code_background_color_in_dark_mode:<?=iro_opt('inline_code_background_color_in_dark_mode');?>;
  29. }
  30. <?php if (iro_opt('theme_commemorate_mode')) {?>
  31. html{
  32. filter: grayscale(100%) !important;
  33. }
  34. <?php } ?>
  35. .the-feature.from_left_and_right .info,.the-feature.from_left_and_right .info h3{background: <?=iro_opt('exhibition_background_color'); ?> ;}
  36. /*白猫样式Logo*/
  37. <?php if (iro_opt('mashiro_logo_option', 'true')) {
  38. $mashiro_logo = iro_opt('mashiro_logo');
  39. ?>
  40. .logolink{
  41. font-family: '<?= $mashiro_logo['font_name']; ?>','Noto Sans SC';
  42. }
  43. .logolink .sakuraso {
  44. background-color: rgba(255, 255, 255, .5);
  45. border-radius: 5px;
  46. color: <?=iro_opt('theme_skin'); ?>;
  47. height: auto;
  48. line-height: 25px;
  49. margin-right: 0;
  50. padding-bottom: 0px;
  51. padding-top: 1px;
  52. text-size-adjust: 100%;
  53. width: auto
  54. }
  55. .logolink a:hover .sakuraso {
  56. background-color: <?=iro_opt('theme_skin_matching'); ?>;
  57. color: #fff;
  58. }
  59. .logolink a:hover .shironeko,
  60. .logolink a:hover .no,
  61. .logolink a:hover rt {
  62. color: <?=iro_opt('theme_skin_matching'); ?>;
  63. }
  64. .logolink.moe-mashiro a {
  65. color: <?=iro_opt('theme_skin'); ?>;
  66. float: left;
  67. font-size: 25px;
  68. font-weight: 800;
  69. height: 50px;
  70. line-height: 40px;
  71. padding-left: 8px;
  72. padding-right: 8px;
  73. padding-top: 8px;
  74. text-decoration-line: none;
  75. }
  76. @media (max-width:860px) {
  77. .logolink.moe-mashiro a {
  78. color: <?=iro_opt('theme_skin'); ?>;
  79. float: left;
  80. font-size: 25px;
  81. font-weight: 800;
  82. height: 56px;
  83. line-height: 56px;
  84. padding-left: 6px;
  85. padding-right: 15px;
  86. padding-top: 11px;
  87. }
  88. }
  89. .logolink.moe-mashiro .sakuraso {
  90. font-size: 25px;
  91. padding-bottom: 4px;
  92. padding-left: 4px;
  93. padding-right: 4px;
  94. padding-top: 2px;
  95. }
  96. .logolink.moe-mashiro .no {
  97. font-size: 25px;
  98. padding-bottom: 4px;
  99. padding-top: 2px;
  100. }
  101. .logolink.moe-mashiro .no {
  102. font-size: 20px;
  103. display: inline-block;
  104. margin-left: 5px;
  105. }
  106. .logolink a:hover .no {
  107. -webkit-animation: spin 1.5s linear infinite;
  108. animation: spin 1.5s linear infinite;
  109. }
  110. .logolink ruby {
  111. ruby-position: under;
  112. -webkit-ruby-position: after;
  113. }
  114. .logolink ruby rt {
  115. font-size: 10px;
  116. letter-spacing:2px;
  117. transform: translateY(-6px);
  118. opacity: 0;
  119. transiton-property: opacity;
  120. transition-duration: 0.5s, 0.5s;
  121. }
  122. .logolink a:hover ruby rt {
  123. opacity: 1
  124. }
  125. <?php } ?>
  126. <?php $text_logo = iro_opt('text_logo'); ?>
  127. .center-text{
  128. color: <?=$text_logo['color']; ?> ;
  129. font-size: <?=$text_logo['size']; ?>px;
  130. }
  131. .Ubuntu-font,.center-text{
  132. font-family: <?= isset($text_logo['font']) ? $text_logo['font'] : 'Noto Serif SC'; ?> ;
  133. }
  134. .notice i ,
  135. .notice {
  136. color: <?=iro_opt('bulletin_text_color'); ?>;
  137. }
  138. .notice {
  139. border: 1px solid <?=iro_opt('bulletin_board_border_color'); ?>;
  140. }
  141. <?php if(iro_opt('entry_content_style') == "sakurairo"){ ?>
  142. .entry-content th {
  143. background-color: <?=iro_opt('theme_skin'); ?>
  144. }
  145. <?php } ?>
  146. <?php if(iro_opt('live_search')){ ?>
  147. .search-form--modal .search-form__inner {
  148. bottom: unset !important;
  149. top: 10% !important;
  150. }
  151. <?php } ?>
  152. <?php } // theme-skin ?>
  153. <?php // Custom style
  154. if ( iro_opt('site_custom_style') ) {
  155. echo iro_opt('site_custom_style');
  156. }
  157. // Custom style end ?>
  158. <?php
  159. //$image_api = 'background-image: url("'.rest_url('sakura/v1/image/cover').'");';
  160. $bg_style = iro_opt('cover_full_screen') ?'': 'background-position: center center;background-attachment: inherit;';
  161. ?>
  162. #centerbg{<?php
  163. echo $bg_style;
  164. echo iro_opt('site_bg_as_cover',false)? 'background:#0000;':'';
  165. ?>}
  166. /*预加载部分*/
  167. <?php if (iro_opt('preload_animation', 'true')): ?>
  168. #preload {
  169. position: fixed;
  170. width: 100%;
  171. height: 100%;
  172. top: 0;
  173. left: 0;
  174. background: #ffffff;
  175. z-index: 99999;
  176. }
  177. #preload li.active {
  178. position: absolute;
  179. top: 49%;
  180. left: 49%;
  181. list-style: none;
  182. }
  183. html {
  184. overflow-y: hidden;
  185. }
  186. #preloader_3 {
  187. position:relative;
  188. }
  189. #preloader_3:before {
  190. background:<?=iro_opt('preload_animation_color2'); ?>;
  191. -webkit-animation: preloader_3_before 1.5s infinite ease-in-out;
  192. -moz-animation: preloader_3_before 1.5s infinite ease-in-out;
  193. -ms-animation: preloader_3_before 1.5s infinite ease-in-out;
  194. animation: preloader_3_before 1.5s infinite ease-in-out;
  195. }
  196. #preloader_3:after {
  197. background:<?=iro_opt('preload_animation_color1'); ?>;
  198. left:22px;
  199. -webkit-animation: preloader_3_after 1.5s infinite ease-in-out;
  200. -moz-animation: preloader_3_after 1.5s infinite ease-in-out;
  201. -ms-animation: preloader_3_after 1.5s infinite ease-in-out;
  202. animation: preloader_3_after 1.5s infinite ease-in-out;
  203. }
  204. #preloader_3:before,#preloader_3:after {
  205. width:20px;
  206. height:20px;
  207. border-radius:20px;
  208. background:<?=iro_opt('preload_animation_color1'); ?>;
  209. position:absolute;
  210. content:'';
  211. }
  212. @-webkit-keyframes preloader_3_before {
  213. 0% {
  214. -webkit-transform: translateX(0px) rotate(0deg)
  215. }
  216. 50% {
  217. -webkit-transform: translateX(50px) scale(1.2) rotate(260deg);
  218. background:<?=iro_opt('preload_animation_color1'); ?>;
  219. border-radius:0px;
  220. }
  221. 100% {
  222. -webkit-transform: translateX(0px) rotate(0deg)
  223. }
  224. }
  225. @-webkit-keyframes preloader_3_after {
  226. 0% {
  227. -webkit-transform: translateX(0px)
  228. }
  229. 50% {
  230. -webkit-transform: translateX(-50px) scale(1.2) rotate(-260deg);
  231. background:<?=iro_opt('preload_animation_color2'); ?>;
  232. border-radius:0px;
  233. }
  234. 100% {
  235. -webkit-transform: translateX(0px)
  236. }
  237. }
  238. @-moz-keyframes preloader_3_before {
  239. 0% {
  240. -moz-transform: translateX(0px) rotate(0deg)
  241. }
  242. 50% {
  243. -moz-transform: translateX(50px) scale(1.2) rotate(260deg);
  244. background:<?=iro_opt('preload_animation_color1'); ?>;
  245. border-radius:0px;
  246. }
  247. 100% {
  248. -moz-transform: translateX(0px) rotate(0deg)
  249. }
  250. }
  251. @-moz-keyframes preloader_3_after {
  252. 0% {
  253. -moz-transform: translateX(0px)
  254. }
  255. 50% {
  256. -moz-transform: translateX(-50px) scale(1.2) rotate(-260deg);
  257. background:<?=iro_opt('preload_animation_color2'); ?>;
  258. border-radius:0px;
  259. }
  260. 100% {
  261. -moz-transform: translateX(0px)
  262. }
  263. }
  264. @-ms-keyframes preloader_3_before {
  265. 0% {
  266. -ms-transform: translateX(0px) rotate(0deg)
  267. }
  268. 50% {
  269. -ms-transform: translateX(50px) scale(1.2) rotate(260deg);
  270. background:<?=iro_opt('preload_animation_color1'); ?>;
  271. border-radius:0px;
  272. }
  273. 100% {
  274. -ms-transform: translateX(0px) rotate(0deg)
  275. }
  276. }
  277. @-ms-keyframes preloader_3_after {
  278. 0% {
  279. -ms-transform: translateX(0px)
  280. }
  281. 50% {
  282. -ms-transform: translateX(-50px) scale(1.2) rotate(-260deg);
  283. background:<?=iro_opt('preload_animation_color2'); ?>;
  284. border-radius:0px;
  285. }
  286. 100% {
  287. -ms-transform: translateX(0px)
  288. }
  289. }
  290. @keyframes preloader_3_before {
  291. 0% {
  292. transform: translateX(0px) rotate(0deg)
  293. }
  294. 50% {
  295. transform: translateX(50px) scale(1.2) rotate(260deg);
  296. background:<?=iro_opt('preload_animation_color1'); ?>;
  297. border-radius:0px;
  298. }
  299. 100% {
  300. transform: translateX(0px) rotate(0deg)
  301. }
  302. }
  303. @keyframes preloader_3_after {
  304. 0% {
  305. transform: translateX(0px)
  306. }
  307. 50% {
  308. transform: translateX(-50px) scale(1.2) rotate(-260deg);
  309. background:<?=iro_opt('preload_animation_color2'); ?>;
  310. border-radius:0px;
  311. }
  312. 100% {
  313. transform: translateX(0px)
  314. }
  315. }
  316. <?php endif; ?>
  317. /*深色模式*/
  318. /*可变项目*/
  319. /*深色模式控件透明度*/
  320. body.dark .header-info
  321. {color:#fff;background:rgba(51,51,51,<?=iro_opt('theme_darkmode_widget_transparency'); ?>);transition: all 0.6s ease-in-out;}
  322. body.dark .top-social img
  323. {background:rgba(51,51,51,<?=iro_opt('theme_darkmode_widget_transparency'); ?>);transition: all 0.6s ease-in-out;}
  324. body.dark .top-social_v2 i
  325. {color:#ababab;transition: all 0.6s ease-in-out;}
  326. body.dark .top-social i,body.dark .bg-switch
  327. {color:#ababab;background:rgba(51,51,51,<?=iro_opt('theme_darkmode_widget_transparency'); ?>);transition: all 0.6s ease-in-out;}
  328. body.dark .the-feature.from_left_and_right .info
  329. {background-color: rgba(51,51,51,<?=iro_opt('theme_darkmode_widget_transparency'); ?>);transition: all 0.6s ease-in-out;}
  330. body.dark .yya,
  331. body.dark input[type=submit]
  332. {background-color:rgba(38,38,38,<?=iro_opt('theme_darkmode_widget_transparency'); ?>) !important;transition: all 0.6s ease-in-out;}
  333. /*深色模式自定义颜色*/
  334. body.dark .headertop-down svg path
  335. {fill: <?=iro_opt('drop_down_arrow_dark_color'); ?> !important;transition: all 0.6s ease-in-out;}
  336. /*深色模式图像亮度*/
  337. body.dark img,
  338. body.dark .highlight-wrap,
  339. body.dark iframe,
  340. body.dark .entry-content .aplayer,
  341. body.dark .post-thumb video
  342. {filter:brightness(<?=iro_opt('theme_darkmode_img_bright'); ?>);}
  343. @media (max-width: 1200px){
  344. body.dark .site-top .lower nav.navbar ul
  345. {background: rgba(255,255,255,0);}
  346. }
  347. /*字体*/
  348. <?php if (iro_opt('reference_exter_font', 'true')) {
  349. $exter_font = iro_opt('exter_font');
  350. ?>
  351. @font-face {
  352. font-family: '<?php echo $exter_font['font1']; ?>';
  353. src : url('<?php echo $exter_font['link1']; ?>');
  354. }
  355. @font-face {
  356. font-family: '<?php echo $exter_font['font2']; ?>';
  357. src : url('<?php echo $exter_font['link2']; ?>');
  358. }
  359. <?php } ?>
  360. .serif{
  361. font-family:<?=iro_opt('global_default_font'); ?> !important ;
  362. font-size: <?=iro_opt('global_font_size'); ?>px;
  363. }
  364. body{
  365. font-family:<?=iro_opt('global_font_2'); ?> !important;
  366. font-size: <?=iro_opt('global_font_size'); ?>px;
  367. }
  368. .site-top ul li a,.header-user-name,.header-user-menu a {
  369. font-family:<?=iro_opt('nav_menu_font'); ?> !important;
  370. }
  371. <?php if (iro_opt('mashiro_logo')) {
  372. $mashiro_logo = iro_opt('mashiro_logo');
  373. ?>
  374. .site-title a{
  375. font-family: '<?php echo $mashiro_logo['font_name']; ?>';
  376. }
  377. <?php } ?>
  378. .site-info,.site-info a{
  379. font-family:<?=iro_opt('footer_text_font'); ?> !important;
  380. }
  381. .skin-menu p{
  382. font-family:<?=iro_opt('style_menu_font'); ?> !important;
  383. }
  384. h1.main-title,h1.fes-title{
  385. font-family:<?=iro_opt('area_title_font'); ?>;
  386. }
  387. .header-info p{
  388. font-family:<?=iro_opt('signature_font'); ?> !important;
  389. font-size: <?=iro_opt('signature_font_size'); ?>px;
  390. }
  391. .post-list-thumb .post-title h3{
  392. font-size: <?=iro_opt('post_title_font_size'); ?>px !important;
  393. }
  394. .pattern-center h1.cat-title,
  395. .pattern-center h1.entry-title {
  396. font-size: <?=iro_opt('page_temp_title_font_size'); ?>px ;
  397. }
  398. .pattern-center-sakura h1.cat-title,
  399. .pattern-center-sakura h1.entry-title {
  400. font-size: <?=iro_opt('page_temp_title_font_size'); ?>px !important;
  401. }
  402. .single-center .single-header h1.entry-title {
  403. font-size: <?=iro_opt('article_title_font_size'); ?>px ;
  404. }
  405. /*鼠标*/
  406. body{
  407. cursor: url(<?=iro_opt('cursor_nor'); ?>), auto;
  408. }
  409. .headertop-down,
  410. .aplayer svg,
  411. .aplayer.aplayer-narrow .aplayer-body,
  412. .aplayer.aplayer-narrow .aplayer-pic,
  413. #emotion-toggle,
  414. .emoji-item,
  415. .emotion-box,
  416. .emotion-item,
  417. .on-hover,
  418. .tieba-container span,
  419. #moblieGoTop,
  420. #changskin{
  421. cursor: url(<?=iro_opt('cursor_no'); ?>), auto;
  422. }
  423. a,
  424. .ins-section .ins-section-header,
  425. .font-family-controls button,
  426. .menu-list li,.ins-section .ins-search-item,
  427. .ins-section .ins-search-item .ins-search-preview{
  428. cursor: url(<?=iro_opt('cursor_ayu'); ?>), auto;
  429. }
  430. p,
  431. .highlight-wrap code,
  432. .highlight-wrap,
  433. .hljs-ln-code .hljs-ln-line{
  434. cursor: url(<?=iro_opt('cursor_text'); ?>), auto;
  435. }
  436. a:active{
  437. cursor: url(<?=iro_opt('cursor_work'); ?>), alias;
  438. }
  439. /*背景类*/
  440. .comment-respond textarea {
  441. background-image: url(<?=iro_opt('comment_area_image'); ?>);
  442. background-size: contain;
  443. background-repeat: no-repeat;
  444. background-position: right;
  445. }
  446. .search-form.is-visible{
  447. background-image: url(<?=iro_opt('search_area_background'); ?>);
  448. }
  449. .site-footer {
  450. background-color: rgba(255, 255, 255,<?=iro_opt('reception_background_transparency'); ?>);
  451. <?php if (iro_opt('reception_background_blur', 'false')): ?> backdrop-filter: saturate(180%) blur(10px); <?php endif; ?>
  452. <?php if (iro_opt('reception_background_blur', 'false')): ?> -webkit-backdrop-filter: saturate(180%) blur(10px); <?php endif; ?>
  453. }
  454. .wrapper {
  455. background-color: rgba(255, 255, 255,<?=iro_opt('reception_background_transparency'); ?>);
  456. <?php if (iro_opt('reception_background_blur', 'false')): ?> backdrop-filter: saturate(180%) blur(10px); <?php endif; ?>
  457. <?php if (iro_opt('reception_background_blur', 'false')): ?> -webkit-backdrop-filter: saturate(180%) blur(10px); <?php endif; ?>
  458. }
  459. /*首页圆角设置*/
  460. .header-info{
  461. border-radius: <?=iro_opt('signature_radius'); ?>px;
  462. }
  463. .focusinfo img{
  464. border-radius: <?=iro_opt('social_area_radius'); ?>px;
  465. }
  466. .focusinfo .header-tou img{
  467. border-radius: <?=iro_opt('avatar_radius'); ?>px;
  468. }
  469. /*标题横线动画*/
  470. <?php if (iro_opt('article_title_line', 'true')): ?>
  471. @media (min-width:860px) {
  472. .single-center .single-header h1.entry-title::after {
  473. content: '';
  474. position: absolute;
  475. top: 40%;
  476. left: 10%;
  477. border-radius: 10px;
  478. display: inline-block;
  479. width: 20%;
  480. height: 10px;
  481. z-index: 1;
  482. background-color: var(--article-theme-highlight,var(--theme-skin-matching));
  483. animation: lineWidth 2s <?=iro_opt('page_title_animation_time'); ?>s forwards;
  484. opacity: 0;
  485. }
  486. }
  487. @keyframes lineWidth {
  488. 0% {
  489. width: 0;
  490. opacity: 0;
  491. }
  492. 100% {
  493. width: 20%;
  494. opacity: 0.5;
  495. }
  496. }
  497. <?php endif; ?>
  498. /*标题动画*/
  499. <?php if (iro_opt('page_title_animation', 'true')): ?>
  500. .entry-title,.single-center .entry-census,.entry-census,.p-time{
  501. -moz-animation: homepage-load-animation <?=iro_opt('page_title_animation_time'); ?>s;
  502. -webkit-animation:homepage-load-animation <?=iro_opt('page_title_animation_time'); ?>s;
  503. animation: homepage-load-animation <?=iro_opt('page_title_animation_time'); ?>s;
  504. }
  505. @-moz-keyframes fadeInUp {
  506. 0% {
  507. -moz-transform: translateY(200%);
  508. transform: translateY(200%);
  509. opacity: 0
  510. }
  511. 50% {
  512. -moz-transform: translateY(200%);
  513. transform: translateY(200%);
  514. opacity: 0
  515. }
  516. 100% {
  517. -moz-transform: translateY(0%);
  518. transform: translateY(0%);
  519. opacity: 1
  520. }
  521. }
  522. @-webkit-keyframes fadeInUp {
  523. 0% {
  524. -webkit-transform: translateY(200%);
  525. transform: translateY(200%);
  526. opacity: 0
  527. }
  528. 50% {
  529. -webkit-transform: translateY(200%);
  530. transform: translateY(200%);
  531. opacity: 0
  532. }
  533. 100% {
  534. -webkit-transform: translateY(0%);
  535. transform: translateY(0%);
  536. opacity: 1
  537. }
  538. }
  539. @keyframes fadeInUp {
  540. 0% {
  541. -moz-transform: translateY(200%);
  542. -ms-transform: translateY(200%);
  543. -webkit-transform: translateY(200%);
  544. transform: translateY(200%);
  545. opacity: 0
  546. }
  547. 50% {
  548. -moz-transform: translateY(200%);
  549. -ms-transform: translateY(200%);
  550. -webkit-transform: translateY(200%);
  551. transform: translateY(200%);
  552. opacity: 0
  553. }
  554. 100% {
  555. -moz-transform: translateY(0%);
  556. -ms-transform: translateY(0%);
  557. -webkit-transform: translateY(0%);
  558. transform: translateY(0%);
  559. opacity: 1
  560. }
  561. }
  562. <?php endif; ?>
  563. /*首页封面动画*/
  564. <?php if (iro_opt('cover_animation', 'true')): ?>
  565. h1.main-title, h1.fes-title,.the-feature.from_left_and_right .info,
  566. .header-info p,.header-info,.focusinfo .header-tou img,.top-social img,.top-social i,.bg-switch,.center-text{
  567. -moz-animation: homepage-load-animation <?=iro_opt('cover_animation_time'); ?>s;
  568. -webkit-animation:homepage-load-animation <?=iro_opt('cover_animation_time'); ?>s;
  569. animation: homepage-load-animation <?=iro_opt('cover_animation_time'); ?>s;
  570. }
  571. <?php endif; ?>
  572. /*导航菜单动画*/
  573. <?php if (iro_opt('nav_menu_animation', 'true')): ?>
  574. .site-top ul {
  575. -moz-animation: fadeInLeft <?=iro_opt('nav_menu_animation_time'); ?>s;
  576. -webkit-animation:fadeInLeft <?=iro_opt('nav_menu_animation_time'); ?>s;
  577. animation: fadeInLeft <?=iro_opt('nav_menu_animation_time'); ?>s;
  578. max-width: 76vw;
  579. }
  580. @-moz-keyframes fadeInLeft {
  581. 0% {
  582. -moz-transform: translateX(100%);
  583. transform: translateX(100%);
  584. opacity: 0
  585. }
  586. 50% {
  587. -moz-transform: translateX(100%);
  588. transform: translateX(100%);
  589. opacity: 0
  590. }
  591. 100% {
  592. -moz-transform: translateX(0%);
  593. transform: translateX(0%);
  594. opacity: 1
  595. }
  596. }
  597. @-webkit-keyframes fadeInLeft {
  598. 0% {
  599. -webkit-transform: translateX(100%);
  600. transform: translateX(100%);
  601. opacity: 0
  602. }
  603. 50% {
  604. -webkit-transform: translateX(100%);
  605. transform: translateX(100%);
  606. opacity: 0
  607. }
  608. 100% {
  609. -webkit-transform: translateX(0%);
  610. transform: translateX(0%);
  611. opacity: 1
  612. }
  613. }
  614. @keyframes fadeInLeft {
  615. 0% {
  616. -moz-transform: translateX(100%);
  617. -ms-transform: translateX(100%);
  618. -webkit-transform: translateX(100%);
  619. transform: translateX(100%);
  620. opacity: 0
  621. }
  622. 50% {
  623. -moz-transform: translateX(100%);
  624. -ms-transform: translateX(100%);
  625. -webkit-transform: translateX(100%);
  626. transform: translateX(100%);
  627. opacity: 0
  628. }
  629. 100% {
  630. -moz-transform: translateX(0%);
  631. -ms-transform: translateX(0%);
  632. -webkit-transform: translateX(0%);
  633. transform: translateX(0%);
  634. opacity: 1
  635. }
  636. }
  637. <?php endif; ?>
  638. /*其他*/
  639. .headertop{
  640. border-radius: 0 0 <?=iro_opt('cover_radius', ''); ?>px <?=iro_opt('cover_radius', ''); ?>px;
  641. }
  642. <?php if (!iro_opt('author_profile_avatar', 'true')): ?>
  643. .author-profile .info {
  644. display:none;
  645. }
  646. <?php endif; ?>
  647. <?php if (!iro_opt('author_profile_name', 'true')): ?>
  648. .author-profile .meta {
  649. display:none;
  650. }
  651. <?php endif; ?>
  652. <?php if (!iro_opt('article_tag', 'true')): ?>
  653. .post-tags {
  654. display:none;
  655. }
  656. <?php endif; ?>
  657. <?php if (!iro_opt('article_modified_time', 'true')): ?>
  658. .post-modified-time {
  659. display:none;
  660. }
  661. <?php endif; ?>
  662. <?php if (!iro_opt('nav_menu_user_avatar', 'true')): ?>
  663. .header-user-avatar{
  664. display:none;
  665. }
  666. <?php endif; ?>
  667. <?php if (iro_opt('footer_sakura', 'true')): ?>
  668. @keyframes slow-rotate {
  669. from {
  670. transform: rotate(0deg);
  671. }
  672. to {
  673. transform: rotate(360deg);
  674. }
  675. }
  676. .sakura-icon{
  677. width:max-content;height:max-content;margin: auto;
  678. }
  679. .sakura-svg {
  680. animation: slow-rotate 10s linear infinite;
  681. }
  682. <?php endif; ?>
  683. <?php if (!iro_opt('drop_down_arrow_mobile', 'true')): ?>
  684. @media (max-width: 860px) {
  685. .headertop-down {
  686. display: none
  687. }
  688. }
  689. <?php endif; ?>
  690. <?php if (!iro_opt('chatgpt_article_summarize', 'true')): ?>
  691. .ai-excerpt,
  692. .ai-excerpt-tip {
  693. display: none;
  694. }
  695. <?php endif; ?>
  696. <?php if (!iro_opt('social_area', 'true')): ?>
  697. .top-social_v2,.top-social{
  698. display: none;
  699. }
  700. <?php endif; ?>
  701. <?php if(iro_opt('friend_link_align') == 'right'){ ?>
  702. span.sitename {
  703. margin-bottom: 0px;
  704. margin-top: 8px;
  705. }
  706. li.link-item {
  707. text-align: right;
  708. }
  709. .links ul li img{
  710. float:none;
  711. }
  712. <?php }else if(iro_opt('friend_link_align') == 'center'){ ?>
  713. span.sitename {
  714. margin-bottom: 0px;
  715. margin-top: 8px;
  716. }
  717. li.link-item {
  718. text-align: center;
  719. }
  720. .links ul li img{
  721. float:none;
  722. }
  723. <?php } ?>
  724. <?php if(iro_opt('page_style') == 'sakurairo'){ ?>
  725. .pattern-center::after {
  726. display:none;
  727. }
  728. .pattern-center-blank {
  729. display:none;
  730. }
  731. <?php }else if(iro_opt('page_style') == 'sakura'){ ?>
  732. .pattern-center {
  733. position: relative;
  734. top: 0;
  735. left: 0;
  736. width: 100%;
  737. overflow: hidden;
  738. }
  739. <?php } ?>
  740. <?php if(iro_opt('post_list_design') == 'ticket'){ ?>
  741. @media (min-width:768px) {
  742. .post-thumb {
  743. height: 100%;
  744. width: 80%;
  745. }
  746. .post-excerpt {
  747. top: 3%;
  748. width: 18.5%;
  749. left: 81%;
  750. max-height: 90%;
  751. letter-spacing: 1px;
  752. flex-direction: column;
  753. display: flex;
  754. position: relative;
  755. }
  756. .post-title {
  757. bottom: 6%;
  758. max-width: 70%;
  759. }
  760. .ai-excerpt-tip{
  761. margin-right: 40%;
  762. }
  763. .post-excerpt p {
  764. max-height: 90%;
  765. -webkit-line-clamp: 11;
  766. display: -webkit-box;
  767. -webkit-box-orient: vertical;
  768. overflow: hidden;
  769. position: relative;
  770. }
  771. .post-list-thumb:nth-child(2n) .post-thumb{
  772. right: 0;
  773. }
  774. .post-list-thumb:nth-child(2n) .post-excerpt{
  775. left: 1%;
  776. }
  777. .post-list-thumb:nth-child(2n) .post-title{
  778. left: 22%;
  779. }
  780. .post-list-thumb:nth-child(2n) .post-date{
  781. left: 21.3%;
  782. }
  783. .post-list-thumb:nth-child(2n) .post-meta{
  784. right: 1.3%;
  785. max-width: 59.5%;
  786. }
  787. }
  788. @media (min-width:860px) {
  789. .post-meta{
  790. right: 21.5%;
  791. max-width: 59.5%;
  792. }
  793. }
  794. @media (max-width:860px) {
  795. .post-meta{
  796. right: 10px;
  797. height: fit-content;
  798. width: fit-content;
  799. max-height: 32%;
  800. max-width: 32%;
  801. top: 10px;
  802. flex-direction: column;
  803. transition: all 0.6s ease-in-out;
  804. -webkit-transition: all 0.6s ease-in-out;
  805. }
  806. }
  807. @media (min-width: 768px) and (max-width: 860px) {
  808. .post-meta{
  809. right: 21.5%;
  810. height: fit-content;
  811. width: fit-content;
  812. max-height: 32%;
  813. max-width: 32%;
  814. top: 10px;
  815. flex-direction: column;
  816. transition: all 0.6s ease-in-out;
  817. -webkit-transition: all 0.6s ease-in-out;
  818. }
  819. }
  820. <?php } ?>
  821. <?php if(iro_opt('post_list_design') == 'ticket' && iro_opt('post_list_ticket_type') == 'non-card'){ ?>
  822. @media (min-width:768px) {
  823. .post-thumb:after{
  824. content: "";
  825. position: absolute;
  826. bottom:0;
  827. left:0;
  828. width:100%;
  829. height:81px;
  830. background:linear-gradient(
  831. #fff0,
  832. #000d
  833. );
  834. backdrop-filter: saturate(180%) blur(10px);
  835. }
  836. .post-title {
  837. background-color: transparent;
  838. border: none;
  839. backdrop-filter: none;
  840. -webkit-backdrop-filter: none;
  841. box-shadow: none;
  842. }
  843. body.dark .post-title {
  844. background-color: transparent;
  845. border: none;
  846. box-shadow: none;
  847. }
  848. .post-title:hover {
  849. background-color: transparent;
  850. border: none;
  851. backdrop-filter: none;
  852. -webkit-backdrop-filter: none;
  853. box-shadow: none;
  854. }
  855. body.dark .post-title:hover{
  856. background-color: transparent;
  857. border: none;
  858. box-shadow: none;
  859. }
  860. .post-list-thumb .post-title h3 {
  861. color: #EEE9E9;
  862. }
  863. }
  864. <?php } ?>
  865. <?php if(iro_opt('nav_menu_style') == 'sakurairo'){ ?>
  866. .yya {
  867. position: fixed;
  868. -webkit-transition: all 1s ease !important;
  869. transition: all 1s ease !important;
  870. border-radius: <?=iro_opt('nav_menu_radius', ''); ?>px !important;
  871. }
  872. .site-title img {
  873. margin-left: 10px;
  874. }
  875. .site-header {
  876. border-radius: <?=iro_opt('nav_menu_radius', ''); ?>px !important;
  877. }
  878. .header-user-menu {
  879. border-radius: <?=iro_opt('nav_menu_secondary_radius', ''); ?>px !important;
  880. }
  881. .lower li ul {
  882. border-radius: <?=iro_opt('nav_menu_secondary_radius', ''); ?>px !important;
  883. }
  884. @media (max-width:860px) {
  885. .openNav .icon {
  886. left: 5vw;
  887. }
  888. .site-header {
  889. width: 100%;
  890. height: 60px;
  891. top: 0;
  892. left: 0;
  893. background: 0 0;
  894. position: fixed;
  895. border-radius: 0 !important;
  896. }
  897. .yya {
  898. border-radius: 0 !important;
  899. }
  900. }
  901. <?php }if(iro_opt('nav_menu_style') == 'sakura'){ ?>
  902. .site-header {
  903. width: 100%;
  904. height: 75px;
  905. top: 0;
  906. left: 0;
  907. background: 0 0;
  908. -webkit-transition: all .4s ease;
  909. transition: all .4s ease;
  910. position: fixed;
  911. z-index: 999;
  912. border-radius: 0px;
  913. }
  914. .header-user-avatar {
  915. margin-top: 22px;
  916. }
  917. .site-branding {
  918. height: 75px;
  919. line-height: 75px;
  920. }
  921. .site-title img {
  922. margin-top: 17px;
  923. }
  924. .site-top .lower {
  925. margin: 15px 0 0 0;
  926. }
  927. .lower li ul {
  928. top: 46px;
  929. right: -24px;
  930. }
  931. .header-user-menu {
  932. right: -11px;
  933. top: 44px;
  934. }
  935. .logolink a {
  936. height: 56px;
  937. line-height: 56px;
  938. }
  939. .logolink.moe-mashiro a{
  940. line-height: 56px !important;
  941. }
  942. .searchbox.js-toggle-search{
  943. margin: 17px 0;
  944. margin-left: 15px;
  945. }
  946. @media (max-width:860px) {
  947. .site-header {
  948. height: 60px;
  949. }
  950. }
  951. <?php } ?>
  952. <?php if (!iro_opt('nav_menu_secondary_arrow', 'true')): ?>
  953. .header-user-menu::before {
  954. display: none;
  955. }
  956. .lower li ul::before {
  957. display: none;
  958. }
  959. <?php endif; ?>
  960. <?php if (iro_opt('exhibition_area_compat', 'true')): ?>
  961. .the-feature.from_left_and_right {
  962. position: relative;
  963. border-radius: <?=iro_opt('exhibition_radius', ''); ?>px;
  964. height: 160px;
  965. width: 258px;
  966. margin: 6px 6px 0 6px;
  967. }
  968. .the-feature img {
  969. height: 160px;
  970. width: 258px;
  971. }
  972. <?php endif; ?>
  973. <?php if (!iro_opt('article_meta_displays', 'true')): ?>
  974. .post-meta {
  975. display: none;
  976. }
  977. <?php endif; ?>
  978. .shuoshuo-item,
  979. .post-list-thumb {
  980. border-radius: <?=iro_opt('post_list_card_radius'); ?>px !important;
  981. }
  982. .post-date, .post-meta {
  983. border-radius: <?=iro_opt('post_meta_radius'); ?>px !important;
  984. }
  985. .post-title {
  986. border-radius: <?=iro_opt('post_list_title_radius'); ?>px !important;
  987. }
  988. <?php if (iro_opt('article_meta_background_compatible', 'true')): ?>
  989. .post-date, .post-meta {
  990. color: rgba(255, 255, 255, 0.8) !important;
  991. background-color: #33333360 !important;
  992. border: 1px solid #7d7d7d30 !important;
  993. transition: all 0.6s ease !important;
  994. -webkit-transition: all 0.6s ease !important;
  995. }
  996. .post-meta a {
  997. color: rgba(255, 255, 255, 0.8) !important;
  998. transition: all 0.6s ease !important;
  999. -webkit-transition: all 0.6s ease !important;
  1000. }
  1001. .post-list-thumb i{
  1002. color: rgba(255, 255, 255, 0.8);
  1003. transition: all 0.6s ease !important;
  1004. -webkit-transition: all 0.6s ease !important;
  1005. }
  1006. body.dark .post-date,
  1007. body.dark .post-meta {
  1008. color: rgba(255, 255, 255, 0.8) !important;
  1009. background-color: #33333360 !important;
  1010. border: 1px solid #7d7d7d30 !important;
  1011. transition: all 0.6s ease !important;
  1012. -webkit-transition: all 0.6s ease !important;
  1013. }
  1014. body.dark .post-meta a {
  1015. color: rgba(255, 255, 255, 0.8) !important;
  1016. transition: all 0.6s ease !important;
  1017. -webkit-transition: all 0.6s ease !important;
  1018. }
  1019. body.dark .post-list-thumb i{
  1020. color: rgba(255, 255, 255, 0.8);
  1021. transition: all 0.6s ease !important;
  1022. -webkit-transition: all 0.6s ease !important;
  1023. }
  1024. <?php endif; ?>
  1025. <?php if(iro_opt('bulletin_board_text_align') == 'center'){ ?>
  1026. .notice {
  1027. text-align: center;
  1028. }
  1029. <?php }if(iro_opt('bulletin_board_text_align') == 'right'){ ?>
  1030. .notice {
  1031. text-align: right;
  1032. }
  1033. <?php } ?>
  1034. <?php if(iro_opt('area_title_text_align') == 'center'){ ?>
  1035. h1.fes-title,
  1036. h1.main-title {
  1037. text-align: center;
  1038. }
  1039. <?php }else if(iro_opt('area_title_text_align') == 'right'){ ?>
  1040. h1.fes-title,
  1041. h1.main-title {
  1042. text-align: right;
  1043. }
  1044. <?php } ?>
  1045. <?php if(iro_opt('bulletin_board_style') == 'picture'){ ?>
  1046. .notice {
  1047. background-image:url(<?=iro_opt('bulletin_board_bg', ''); ?>);
  1048. background-repeat: round;
  1049. border: none;
  1050. box-shadow: 1px 1px 3px rgba(0, 0, 0, .3);
  1051. }
  1052. <?php }if(iro_opt('bulletin_board_style') == 'pure'){ ?>
  1053. .notice {
  1054. background: #fbfbfb50;
  1055. }
  1056. <?php }
  1057. ?>
  1058. <?php
  1059. if(iro_opt('cover_half_screen_curve',true)){
  1060. ?>
  1061. .headertop-bar::after {
  1062. content: '';
  1063. width: 150%;
  1064. height: 4.375rem;
  1065. background-color: rgba(255, 255, 255,<?=iro_opt('reception_background_transparency'); ?>);
  1066. <?php if (iro_opt('reception_background_blur', 'false')): ?> backdrop-filter: saturate(180%) blur(10px); <?php endif; ?>
  1067. <?php if (iro_opt('reception_background_blur', 'false')): ?> -webkit-backdrop-filter: saturate(180%) blur(10px); <?php endif; ?>
  1068. left: -25%;
  1069. bottom: -2.875rem;
  1070. border-radius: 100%;
  1071. position: absolute;
  1072. z-index: 4;
  1073. }
  1074. .headertop{
  1075. border-radius:0 !important;
  1076. }
  1077. .wrapper{
  1078. border-top:0 !important;
  1079. }
  1080. <?php
  1081. }
  1082. ?>
  1083. body{
  1084. background-size:<?=iro_opt(('reception_background_size'),'auto')
  1085. ?>;
  1086. }
  1087. #video-add{
  1088. background-image: url(<?=iro_opt('vision_resource_basepath', 'https://s.nmxc.ltd/sakurairo_vision/@2.7/')?>basic/add.svg);
  1089. }
  1090. @media (max-width:860px) {
  1091. .headertop.filter-dot::before {
  1092. background-image: url(<?=iro_opt('vision_resource_basepath', 'https://s.nmxc.ltd/sakurairo_vision/@2.7/')?>basic/grid.png);
  1093. }
  1094. }
  1095. .headertop.filter-grid::before {
  1096. background-image: url(<?=iro_opt('vision_resource_basepath', 'https://s.nmxc.ltd/sakurairo_vision/@2.7/')?>basic/grid.png);
  1097. }
  1098. .headertop.filter-dot::before {
  1099. background-image: url(<?=iro_opt('vision_resource_basepath', 'https://s.nmxc.ltd/sakurairo_vision/@2.7/')?>basic/dot.gif);
  1100. }
  1101. .loadvideo,.video-play {
  1102. background-image: url(<?=iro_opt('vision_resource_basepath', 'https://s.nmxc.ltd/sakurairo_vision/@2.7/')?>basic/play.svg);
  1103. }
  1104. .video-pause {
  1105. background-image: url(<?=iro_opt('vision_resource_basepath', 'https://s.nmxc.ltd/sakurairo_vision/@2.7/')?>basic/pause.svg);
  1106. }
  1107. #loading-comments {
  1108. background-image: url(<?=iro_opt('vision_resource_basepath', 'https://s.nmxc.ltd/sakurairo_vision/@2.7/')?>load_svg/ball.svg);
  1109. }
  1110. <?php if (iro_opt('wave_effects', 'true')): ?>
  1111. #banner_wave_1 {
  1112. background: url(<?=iro_opt('vision_resource_basepath', 'https://s.nmxc.ltd/sakurairo_vision/@2.7/')?>basic/wave1.png) repeat-x;
  1113. }
  1114. #banner_wave_2 {
  1115. background: url(<?=iro_opt('vision_resource_basepath', 'https://s.nmxc.ltd/sakurairo_vision/@2.7/')?>basic/wave2.png) repeat-x;
  1116. }
  1117. .headertop{
  1118. border-radius:0 !important;
  1119. }
  1120. <?php endif; ?>
  1121. </style>
  1122. <?php }
  1123. add_action('wp_head', 'customizer_css');