decorate.php 26 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794795796797798799800801802803804805806807808809810811812813814815816817818819820821822823824825826827828829830831832833834835836837838839840841842843844845846847848849850851852853854855856857858859860861862863864865866867868869870871872873874875876877878879880881882883884885886887888889890891892893894895896897898899900901902903904905906907908909910911912913914915916917918919920921922923924925926927928929930931932933934935936937938939940941942943944945946947948949950951952953954955956957958959960961962963964965966967968969970971972973974975976977978979980981982983984985986987988989990991992993994995996997998999100010011002100310041005100610071008100910101011101210131014101510161017101810191020102110221023102410251026102710281029103010311032103310341035103610371038103910401041104210431044104510461047104810491050105110521053105410551056105710581059106010611062106310641065106610671068106910701071107210731074107510761077107810791080108110821083108410851086108710881089109010911092
  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. --infor_bar_bgcolor:<?=iro_opt('infor_bar_bgcolor'); ?>;
  17. --style_menu_background_color:<?=iro_opt('style_menu_background_color'); ?>;
  18. --style_menu_selection_radius:<?=iro_opt('style_menu_selection_radius', ''); ?>px;
  19. --post_date_text_color:<?=iro_opt('post_date_text_color'); ?>;
  20. --load_nextpage_svg:url("<?=iro_opt('load_nextpage_svg'); ?>");
  21. --style_menu_radius:<?=iro_opt('style_menu_radius', ''); ?>px;
  22. --post-list-thumb: <?=iro_opt('post_border_shadow_color'); ?>;
  23. --style_menu_selection_color: <?=iro_opt('style_menu_selection_color'); ?>;
  24. --shuoshuo_background_color1:<?=iro_opt('shuoshuo_background_color1');?>;
  25. --shuoshuo_background_color2:<?=iro_opt('shuoshuo_background_color2');?>;
  26. <?php //深色模式主题色 ?>
  27. --theme-skin-dark: <?=iro_opt('theme_skin_dark'); ?>;
  28. --global-font-weight:<?=iro_opt('global_font_weight');?>;
  29. --theme-dm-background_transparency:<?=iro_opt('theme_darkmode_background_transparency')?>;
  30. --area_title_bottom_color:<?=iro_opt('area_title_bottom_color');?>;
  31. }
  32. <?php if (iro_opt('theme_commemorate_mode')) {?>
  33. html{
  34. filter: grayscale(100%) !important;
  35. }
  36. <?php } ?>
  37. .the-feature.from_left_and_right .info,.the-feature.from_left_and_right .info h3{background: <?=iro_opt('exhibition_background_color'); ?> ;}
  38. /*白猫样式Logo*/
  39. <?php if (iro_opt('mashiro_logo_option', 'true')) {
  40. $mashiro_logo = iro_opt('mashiro_logo');
  41. ?>
  42. .logolink{
  43. font-family: '<?= $mashiro_logo['font_name']; ?>', 'Merriweather Sans', Helvetica, Tahoma, Arial, 'PingFang SC', 'Hiragino Sans GB', 'Microsoft Yahei', 'WenQuanYi Micro Hei', sans-serif;
  44. }
  45. .logolink .sakuraso {
  46. background-color: rgba(255, 255, 255, .5);
  47. border-radius: 5px;
  48. color: <?=iro_opt('theme_skin'); ?>;
  49. height: auto;
  50. line-height: 25px;
  51. margin-right: 0;
  52. padding-bottom: 0px;
  53. padding-top: 1px;
  54. text-size-adjust: 100%;
  55. width: auto
  56. }
  57. .logolink a:hover .sakuraso {
  58. background-color: <?=iro_opt('theme_skin_matching'); ?>;
  59. color: #fff;
  60. }
  61. .logolink a:hover .shironeko,
  62. .logolink a:hover .no,
  63. .logolink a:hover rt {
  64. color: <?=iro_opt('theme_skin_matching'); ?>;
  65. }
  66. .logolink.moe-mashiro a {
  67. color: <?=iro_opt('theme_skin'); ?>;
  68. float: left;
  69. font-size: 25px;
  70. font-weight: 800;
  71. height: 56px;
  72. line-height: 56px;
  73. padding-left: 8px;
  74. padding-right: 8px;
  75. padding-top: 8px;
  76. text-decoration-line: none;
  77. }
  78. @media (max-width:860px) {
  79. .logolink.moe-mashiro a {
  80. color: <?=iro_opt('theme_skin'); ?>;
  81. float: left;
  82. font-size: 25px;
  83. font-weight: 800;
  84. height: 56px;
  85. line-height: 56px;
  86. padding-left: 6px;
  87. padding-right: 15px;
  88. padding-top: 11px;
  89. }
  90. }
  91. .logolink.moe-mashiro .sakuraso,.logolink.moe-mashiro .no {
  92. font-size: 25px;
  93. border-radius: 9px;
  94. padding-bottom: 2px;
  95. padding-top: 5px;
  96. }
  97. .logolink.moe-mashiro .no {
  98. font-size: 20px;
  99. display: inline-block;
  100. margin-left: 5px;
  101. }
  102. .logolink a:hover .no {
  103. -webkit-animation: spin 1.5s linear infinite;
  104. animation: spin 1.5s linear infinite;
  105. }
  106. .logolink ruby {
  107. ruby-position: under;
  108. -webkit-ruby-position: after;
  109. }
  110. .logolink ruby rt {
  111. font-size: 10px;
  112. letter-spacing:2px;
  113. transform: translateY(-15px);
  114. opacity: 0;
  115. transiton-property: opacity;
  116. transition-duration: 0.5s, 0.5s;
  117. }
  118. .logolink a:hover ruby rt {
  119. opacity: 1
  120. }
  121. <?php } ?>
  122. /*非全局色彩管理*/
  123. .post-date {
  124. background-color: <?=iro_opt('post_date_background_color'); ?>;
  125. }
  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: <?=$text_logo['font']; ?> ;
  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 // liststyle
  159. if ( iro_opt('post_list_akina_type') == 'square') { ?>
  160. .feature img{ border-radius: 0px !important; }
  161. .feature i { border-radius: 0px !important; }
  162. <?php } // liststyle ?>
  163. <?php
  164. //$image_api = 'background-image: url("'.rest_url('sakura/v1/image/cover').'");';
  165. $bg_style = iro_opt('cover_full_screen') ?'': 'background-position: center center;background-attachment: inherit;';
  166. ?>
  167. #centerbg{<?php
  168. echo $bg_style;
  169. echo iro_opt('site_bg_as_cover',false)? 'background:#0000;':'';
  170. ?>}
  171. /*预加载部分*/
  172. <?php if (iro_opt('preload_animation', 'true')): ?>
  173. #preload {
  174. position: fixed;
  175. width: 100%;
  176. height: 100%;
  177. top: 0;
  178. left: 0;
  179. background: #ffffff;
  180. z-index: 99999;
  181. }
  182. #preload li.active {
  183. position: absolute;
  184. top: 49%;
  185. left: 49%;
  186. list-style: none;
  187. }
  188. html {
  189. overflow-y: hidden;
  190. }
  191. #preloader_3 {
  192. position:relative;
  193. }
  194. #preloader_3:before {
  195. background:<?=iro_opt('preload_animation_color2'); ?>;
  196. -webkit-animation: preloader_3_before 1.5s infinite ease-in-out;
  197. -moz-animation: preloader_3_before 1.5s infinite ease-in-out;
  198. -ms-animation: preloader_3_before 1.5s infinite ease-in-out;
  199. animation: preloader_3_before 1.5s infinite ease-in-out;
  200. }
  201. #preloader_3:after {
  202. background:<?=iro_opt('preload_animation_color1'); ?>;
  203. left:22px;
  204. -webkit-animation: preloader_3_after 1.5s infinite ease-in-out;
  205. -moz-animation: preloader_3_after 1.5s infinite ease-in-out;
  206. -ms-animation: preloader_3_after 1.5s infinite ease-in-out;
  207. animation: preloader_3_after 1.5s infinite ease-in-out;
  208. }
  209. #preloader_3:before,#preloader_3:after {
  210. width:20px;
  211. height:20px;
  212. border-radius:20px;
  213. background:<?=iro_opt('preload_animation_color1'); ?>;
  214. position:absolute;
  215. content:'';
  216. }
  217. @-webkit-keyframes preloader_3_before {
  218. 0% {
  219. -webkit-transform: translateX(0px) rotate(0deg)
  220. }
  221. 50% {
  222. -webkit-transform: translateX(50px) scale(1.2) rotate(260deg);
  223. background:<?=iro_opt('preload_animation_color1'); ?>;
  224. border-radius:0px;
  225. }
  226. 100% {
  227. -webkit-transform: translateX(0px) rotate(0deg)
  228. }
  229. }
  230. @-webkit-keyframes preloader_3_after {
  231. 0% {
  232. -webkit-transform: translateX(0px)
  233. }
  234. 50% {
  235. -webkit-transform: translateX(-50px) scale(1.2) rotate(-260deg);
  236. background:<?=iro_opt('preload_animation_color2'); ?>;
  237. border-radius:0px;
  238. }
  239. 100% {
  240. -webkit-transform: translateX(0px)
  241. }
  242. }
  243. @-moz-keyframes preloader_3_before {
  244. 0% {
  245. -moz-transform: translateX(0px) rotate(0deg)
  246. }
  247. 50% {
  248. -moz-transform: translateX(50px) scale(1.2) rotate(260deg);
  249. background:<?=iro_opt('preload_animation_color1'); ?>;
  250. border-radius:0px;
  251. }
  252. 100% {
  253. -moz-transform: translateX(0px) rotate(0deg)
  254. }
  255. }
  256. @-moz-keyframes preloader_3_after {
  257. 0% {
  258. -moz-transform: translateX(0px)
  259. }
  260. 50% {
  261. -moz-transform: translateX(-50px) scale(1.2) rotate(-260deg);
  262. background:<?=iro_opt('preload_animation_color2'); ?>;
  263. border-radius:0px;
  264. }
  265. 100% {
  266. -moz-transform: translateX(0px)
  267. }
  268. }
  269. @-ms-keyframes preloader_3_before {
  270. 0% {
  271. -ms-transform: translateX(0px) rotate(0deg)
  272. }
  273. 50% {
  274. -ms-transform: translateX(50px) scale(1.2) rotate(260deg);
  275. background:<?=iro_opt('preload_animation_color1'); ?>;
  276. border-radius:0px;
  277. }
  278. 100% {
  279. -ms-transform: translateX(0px) rotate(0deg)
  280. }
  281. }
  282. @-ms-keyframes preloader_3_after {
  283. 0% {
  284. -ms-transform: translateX(0px)
  285. }
  286. 50% {
  287. -ms-transform: translateX(-50px) scale(1.2) rotate(-260deg);
  288. background:<?=iro_opt('preload_animation_color2'); ?>;
  289. border-radius:0px;
  290. }
  291. 100% {
  292. -ms-transform: translateX(0px)
  293. }
  294. }
  295. @keyframes preloader_3_before {
  296. 0% {
  297. transform: translateX(0px) rotate(0deg)
  298. }
  299. 50% {
  300. transform: translateX(50px) scale(1.2) rotate(260deg);
  301. background:<?=iro_opt('preload_animation_color1'); ?>;
  302. border-radius:0px;
  303. }
  304. 100% {
  305. transform: translateX(0px) rotate(0deg)
  306. }
  307. }
  308. @keyframes preloader_3_after {
  309. 0% {
  310. transform: translateX(0px)
  311. }
  312. 50% {
  313. transform: translateX(-50px) scale(1.2) rotate(-260deg);
  314. background:<?=iro_opt('preload_animation_color2'); ?>;
  315. border-radius:0px;
  316. }
  317. 100% {
  318. transform: translateX(0px)
  319. }
  320. }
  321. <?php endif; ?>
  322. /*深色模式*/
  323. /*可变项目*/
  324. /*深色模式控件透明度*/
  325. body.dark .header-info,
  326. body.dark .top-social img
  327. {color:#fff;background:rgba(51,51,51,<?=iro_opt('theme_darkmode_widget_transparency'); ?>);}
  328. body.dark .the-feature.from_left_and_right .info
  329. {background-color: rgba(51,51,51,<?=iro_opt('theme_darkmode_widget_transparency'); ?>);}
  330. body.dark .yya,
  331. body.dark .widget-area,
  332. body.dark .skin-menu,
  333. body.dark input[type=submit]
  334. {background-color:rgba(38,38,38,<?=iro_opt('theme_darkmode_widget_transparency'); ?>) !important;}
  335. /*深色模式自定义颜色*/
  336. body.dark .headertop-down i
  337. {color: <?=iro_opt('drop_down_arrow_dark_color'); ?> !important;}
  338. /*深色模式图像亮度*/
  339. body.dark img,
  340. body.dark .highlight-wrap,
  341. body.dark iframe,
  342. body.dark .entry-content .aplayer,
  343. body.dark .post-thumb video
  344. {filter:brightness(<?=iro_opt('theme_darkmode_img_bright'); ?>);}
  345. @media (max-width: 1200px){
  346. body.dark .site-top .lower nav.navbar ul
  347. {background: rgba(255,255,255,0);}
  348. }
  349. /*字体*/
  350. <?php if (iro_opt('reference_exter_font', 'true')): ?>
  351. @font-face {
  352. font-family: '<?=iro_opt('exter_font_name'); ?>';
  353. src : url('<?=iro_opt('exter_font_link'); ?>');
  354. }
  355. <?php endif; ?>
  356. .serif{
  357. font-family:<?=iro_opt('global_default_font'); ?> !important ;
  358. font-size: <?=iro_opt('global_font_size'); ?>px;
  359. }
  360. body{
  361. font-family:<?=iro_opt('global_font_2'); ?> !important;
  362. font-size: <?=iro_opt('global_font_size'); ?>px;
  363. }
  364. h1.main-title,h1.fes-title{
  365. font-family:<?=iro_opt('area_title_font'); ?>;
  366. }
  367. .header-info p{
  368. font-family:<?=iro_opt('signature_font'); ?> !important;
  369. font-size: <?=iro_opt('signature_font_size'); ?>px;
  370. }
  371. .cbp_tmtimeline > li .cbp_tmlabel {
  372. font-family:<?=iro_opt('shuoshuo_font'); ?> !important;
  373. }
  374. .post-list-thumb .post-title h3{
  375. font-size: <?=iro_opt('post_title_font_size'); ?>px !important;
  376. }
  377. .post-meta, .post-meta a{
  378. font-size: <?=iro_opt('post_date_font_size'); ?>px !important;
  379. }
  380. .pattern-center h1.cat-title,
  381. .pattern-center h1.entry-title {
  382. font-size: <?=iro_opt('page_temp_title_font_size'); ?>px ;
  383. }
  384. .pattern-center-sakura h1.cat-title,
  385. .pattern-center-sakura h1.entry-title {
  386. font-size: <?=iro_opt('page_temp_title_font_size'); ?>px !important;
  387. }
  388. .single-center .single-header h1.entry-title {
  389. font-size: <?=iro_opt('article_title_font_size'); ?>px ;
  390. }
  391. /*鼠标*/
  392. body{
  393. cursor: url(<?=iro_opt('cursor_nor'); ?>), auto;
  394. }
  395. .headertop-down i,
  396. .faa-parent.animated-hover:hover>.faa-spin,
  397. .faa-spin.animated,
  398. .faa-spin.animated-hover:hover,
  399. i.iconfont.js-toggle-search.iconsearch,
  400. #waifu #live2d,
  401. .aplayer svg,
  402. .aplayer.aplayer-narrow .aplayer-body,
  403. .aplayer.aplayer-narrow .aplayer-pic,
  404. #emotion-toggle,
  405. .emoji-item,
  406. .emotion-box,
  407. .emotion-item,
  408. .on-hover,
  409. .tieba-container span,
  410. #moblieGoTop,
  411. #changskin{
  412. cursor: url(<?=iro_opt('cursor_no'); ?>), auto;
  413. }
  414. a,
  415. .ins-section .ins-section-header,
  416. .font-family-controls button,
  417. .menu-list li,.ins-section .ins-search-item,
  418. .ins-section .ins-search-item .ins-search-preview{
  419. cursor: url(<?=iro_opt('cursor_ayu'); ?>), auto;
  420. }
  421. p,
  422. .highlight-wrap code,
  423. .highlight-wrap,
  424. .hljs-ln-code .hljs-ln-line{
  425. cursor: url(<?=iro_opt('cursor_text'); ?>), auto;
  426. }
  427. a:active{
  428. cursor: url(<?=iro_opt('cursor_work'); ?>), alias;
  429. }
  430. /*背景类*/
  431. .comment-respond textarea {
  432. background-image: url(<?=iro_opt('comment_area_image'); ?>);
  433. }
  434. .search-form.is-visible{
  435. background-image: url(<?=iro_opt('search_area_background'); ?>);
  436. }
  437. .site-footer {
  438. background-color: rgba(255, 255, 255,<?=iro_opt('reception_background_transparency'); ?>);
  439. <?php if (iro_opt('reception_background_blur', 'false')): ?> backdrop-filter: blur(10px); <?php endif; ?>
  440. <?php if (iro_opt('reception_background_blur', 'false')): ?> -webkit-backdrop-filter: blur(10px); <?php endif; ?>
  441. }
  442. .wrapper {
  443. background-color: rgba(255, 255, 255,<?=iro_opt('reception_background_transparency'); ?>);
  444. <?php if (iro_opt('reception_background_blur', 'false')): ?> backdrop-filter: blur(10px); <?php endif; ?>
  445. <?php if (iro_opt('reception_background_blur', 'false')): ?> -webkit-backdrop-filter: blur(10px); <?php endif; ?>
  446. }
  447. /*首页圆角设置*/
  448. .header-info{
  449. border-radius: <?=iro_opt('signature_radius'); ?>px;
  450. }
  451. .focusinfo img{
  452. border-radius: <?=iro_opt('social_area_radius'); ?>px;
  453. }
  454. .focusinfo .header-tou img{
  455. border-radius: <?=iro_opt('avatar_radius'); ?>px;
  456. }
  457. /*标题横线动画*/
  458. <?php if (iro_opt('article_title_line', 'true')): ?>
  459. .single-center header.single-header .toppic-line{
  460. position:relative;bottom:0;left:0;display:block;width:100%;height:2px;background-color:#fff;animation:lineWidth 2.5s;animation-fill-mode:forwards;}
  461. @keyframes lineWidth{0%{width:0;}
  462. 100%{width:100%;}
  463. }
  464. <?php endif; ?>
  465. /*标题动画*/
  466. <?php if (iro_opt('page_title_animation', 'true')): ?>
  467. .entry-title,.single-center .entry-census a,.entry-census,.post-list p,.post-more i,.p-time,.feature{
  468. -moz-animation: fadeInUp <?=iro_opt('page_title_animation_time'); ?>s;
  469. -webkit-animation:fadeInUp <?=iro_opt('page_title_animation_time'); ?>s;
  470. animation: fadeInUp <?=iro_opt('page_title_animation_time'); ?>s;
  471. }
  472. @-moz-keyframes fadeInUp {
  473. 0% {
  474. -moz-transform: translateY(200%);
  475. transform: translateY(200%);
  476. opacity: 0
  477. }
  478. 50% {
  479. -moz-transform: translateY(200%);
  480. transform: translateY(200%);
  481. opacity: 0
  482. }
  483. 100% {
  484. -moz-transform: translateY(0%);
  485. transform: translateY(0%);
  486. opacity: 1
  487. }
  488. }
  489. @-webkit-keyframes fadeInUp {
  490. 0% {
  491. -webkit-transform: translateY(200%);
  492. transform: translateY(200%);
  493. opacity: 0
  494. }
  495. 50% {
  496. -webkit-transform: translateY(200%);
  497. transform: translateY(200%);
  498. opacity: 0
  499. }
  500. 100% {
  501. -webkit-transform: translateY(0%);
  502. transform: translateY(0%);
  503. opacity: 1
  504. }
  505. }
  506. @keyframes fadeInUp {
  507. 0% {
  508. -moz-transform: translateY(200%);
  509. -ms-transform: translateY(200%);
  510. -webkit-transform: translateY(200%);
  511. transform: translateY(200%);
  512. opacity: 0
  513. }
  514. 50% {
  515. -moz-transform: translateY(200%);
  516. -ms-transform: translateY(200%);
  517. -webkit-transform: translateY(200%);
  518. transform: translateY(200%);
  519. opacity: 0
  520. }
  521. 100% {
  522. -moz-transform: translateY(0%);
  523. -ms-transform: translateY(0%);
  524. -webkit-transform: translateY(0%);
  525. transform: translateY(0%);
  526. opacity: 1
  527. }
  528. }
  529. <?php endif; ?>
  530. /*首页封面动画*/
  531. <?php if (iro_opt('cover_animation', 'true')): ?>
  532. h1.main-title, h1.fes-title,.the-feature.from_left_and_right .info,.header-info p,.header-info,.focusinfo .header-tou img,.top-social img,.center-text{
  533. -moz-animation: fadeInDown <?=iro_opt('cover_animation_time'); ?>s;
  534. -webkit-animation:fadeInDown <?=iro_opt('cover_animation_time'); ?>s;
  535. animation: fadeInDown <?=iro_opt('cover_animation_time'); ?>s;
  536. }
  537. @-moz-keyframes fadeInDown {
  538. 0% {
  539. -moz-transform: translateY(-100%);
  540. transform: translateY(-100%);
  541. opacity: 0
  542. }
  543. 50% {
  544. -moz-transform: translateY(-100%);
  545. transform: translateY(-100%);
  546. opacity: 0
  547. }
  548. 100% {
  549. -moz-transform: translateY(0%);
  550. transform: translateY(0%);
  551. opacity: 1
  552. }
  553. }
  554. @-webkit-keyframes fadeInDown {
  555. 0% {
  556. -webkit-transform: translateY(-100%);
  557. transform: translateY(-100%);
  558. opacity: 0
  559. }
  560. 50% {
  561. -webkit-transform: translateY(-100%);
  562. transform: translateY(-100%);
  563. opacity: 0
  564. }
  565. 100% {
  566. -webkit-transform: translateY(0%);
  567. transform: translateY(0%);
  568. opacity: 1
  569. }
  570. }
  571. @keyframes fadeInDown {
  572. 0% {
  573. -moz-transform: translateY(-100%);
  574. -ms-transform: translateY(-100%);
  575. -webkit-transform: translateY(-100%);
  576. transform: translateY(-100%);
  577. opacity: 0
  578. }
  579. 50% {
  580. -moz-transform: translateY(-100%);
  581. -ms-transform: translateY(-100%);
  582. -webkit-transform: translateY(-100%);
  583. transform: translateY(-100%);
  584. opacity: 0
  585. }
  586. 100% {
  587. -moz-transform: translateY(0%);
  588. -ms-transform: translateY(0%);
  589. -webkit-transform: translateY(0%);
  590. transform: translateY(0%);
  591. opacity: 1
  592. }
  593. }
  594. <?php endif; ?>
  595. /*导航菜单动画*/
  596. <?php if (iro_opt('nav_menu_animation', 'true')): ?>
  597. .site-top ul {
  598. -moz-animation: fadeInLeft <?=iro_opt('nav_menu_animation_time'); ?>s;
  599. -webkit-animation:fadeInLeft <?=iro_opt('nav_menu_animation_time'); ?>s;
  600. animation: fadeInLeft <?=iro_opt('nav_menu_animation_time'); ?>s;
  601. }
  602. @-moz-keyframes fadeInLeft {
  603. 0% {
  604. -moz-transform: translateX(100%);
  605. transform: translateX(100%);
  606. opacity: 0
  607. }
  608. 50% {
  609. -moz-transform: translateX(100%);
  610. transform: translateX(100%);
  611. opacity: 0
  612. }
  613. 100% {
  614. -moz-transform: translateX(0%);
  615. transform: translateX(0%);
  616. opacity: 1
  617. }
  618. }
  619. @-webkit-keyframes fadeInLeft {
  620. 0% {
  621. -webkit-transform: translateX(100%);
  622. transform: translateX(100%);
  623. opacity: 0
  624. }
  625. 50% {
  626. -webkit-transform: translateX(100%);
  627. transform: translateX(100%);
  628. opacity: 0
  629. }
  630. 100% {
  631. -webkit-transform: translateX(0%);
  632. transform: translateX(0%);
  633. opacity: 1
  634. }
  635. }
  636. @keyframes fadeInLeft {
  637. 0% {
  638. -moz-transform: translateX(100%);
  639. -ms-transform: translateX(100%);
  640. -webkit-transform: translateX(100%);
  641. transform: translateX(100%);
  642. opacity: 0
  643. }
  644. 50% {
  645. -moz-transform: translateX(100%);
  646. -ms-transform: translateX(100%);
  647. -webkit-transform: translateX(100%);
  648. transform: translateX(100%);
  649. opacity: 0
  650. }
  651. 100% {
  652. -moz-transform: translateX(0%);
  653. -ms-transform: translateX(0%);
  654. -webkit-transform: translateX(0%);
  655. transform: translateX(0%);
  656. opacity: 1
  657. }
  658. }
  659. <?php endif; ?>
  660. /*其他*/
  661. .widget-area .sakura_widget{
  662. background-image: url(<?=iro_opt('sakura_widget_background', ''); ?>);
  663. }
  664. .headertop{
  665. border-radius: 0 0 <?=iro_opt('cover_radius', ''); ?>px <?=iro_opt('cover_radius', ''); ?>px;
  666. }
  667. <?php if (!iro_opt('article_lincenses', 'true')): ?>
  668. .post-footer {
  669. display:none;
  670. }
  671. <?php endif; ?>
  672. <?php if (!iro_opt('nav_menu_user_avatar', 'true')): ?>
  673. .header-user-avatar{
  674. display:none;
  675. }
  676. <?php endif; ?>
  677. <?php if (!iro_opt('drop_down_arrow_mobile', 'true')): ?>
  678. @media (max-width: 860px) {
  679. .headertop-down {
  680. display: none
  681. }
  682. }
  683. <?php endif; ?>
  684. <?php if (!iro_opt('post_icon_more', 'true')): ?>
  685. .float-content i {
  686. display: none;
  687. }
  688. <?php endif; ?>
  689. <?php if (!iro_opt('social_area', 'true')): ?>
  690. .top-social_v2,.top-social{
  691. display: none;
  692. }
  693. <?php endif; ?>
  694. <?php if(iro_opt('nav_menu_icon_size') == 'large'){ ?>
  695. i.iconfont.js-toggle-search.iconsearch {
  696. font-size: 25px;
  697. }
  698. .lower li ul {
  699. right: -13px;
  700. }
  701. #show-nav .line {
  702. width: 28px;
  703. margin-left: -15px;
  704. }
  705. #show-nav {
  706. width: 30px;
  707. height: 33px;
  708. }
  709. <?php }else if(iro_opt('nav_menu_search_size') == 'standard'){ ?>
  710. <?php } ?>
  711. <?php if(iro_opt('friend_link_align') == 'right'){ ?>
  712. span.sitename {
  713. margin: 0px;
  714. }
  715. .linkdes {
  716. margin: 0px;
  717. }
  718. li.link-item {
  719. text-align: right;
  720. }
  721. .links ul li img{
  722. float:none;
  723. }
  724. <?php }else if(iro_opt('friend_link_align') == 'center'){ ?>
  725. span.sitename {
  726. margin: 0px;
  727. }
  728. .linkdes {
  729. margin: 0px;
  730. }
  731. li.link-item {
  732. text-align: center;
  733. }
  734. .links ul li img{
  735. float:none;
  736. }
  737. <?php } ?>
  738. <?php if(iro_opt('post_list_image_align') == 'left'){ ?>
  739. .post-list-thumb .post-content-wrap {
  740. float: left;
  741. padding-left: 30px;
  742. padding-right: 0;
  743. text-align: right;
  744. margin: 20px 10px 10px 0
  745. }
  746. .post-list-thumb .post-thumb {
  747. float: left
  748. }
  749. .post-list-thumb .post-thumb a {
  750. border-radius: 10px 0 0 10px
  751. }
  752. <?php }else if(iro_opt('post_list_image_align') == 'alternate'){ ?>
  753. .post-list-thumb:nth-child(2n) .post-content-wrap {
  754. float: left;
  755. padding-left: 30px;
  756. padding-right: 0;
  757. text-align: right;
  758. margin: 20px 10px 10px 0
  759. }
  760. .post-list-thumb:nth-child(2n) .post-thumb {
  761. float: left
  762. }
  763. .post-list-thumb:nth-child(2n) .post-thumb a {
  764. border-radius: 10px 0 0 10px
  765. }
  766. <?php } ?>
  767. <?php if(iro_opt('page_style') == 'sakurairo'){ ?>
  768. .pattern-center::after {
  769. display:none;
  770. }
  771. .pattern-center-blank {
  772. display:none;
  773. }
  774. <?php }else if(iro_opt('page_style') == 'sakura'){ ?>
  775. .pattern-center {
  776. position: relative;
  777. top: 0;
  778. left: 0;
  779. width: 100%;
  780. border-radius: 0px;
  781. overflow: hidden;
  782. }
  783. <?php } ?>
  784. <?php if(iro_opt('nav_menu_style') == 'sakurairo'){ ?>
  785. .yya {
  786. position: fixed;
  787. -webkit-transition: all 1s ease !important;
  788. transition: all 1s ease !important;
  789. width:<?=iro_opt('nav_menu_shrink_animation', ''); ?>% ;
  790. left:calc(97.5% - <?=iro_opt('nav_menu_shrink_animation', ''); ?>%);
  791. box-shadow: 0 1px 40px -8px rgba(255, 255, 255, .4);
  792. border-radius: <?=iro_opt('nav_menu_radius', ''); ?>px !important;
  793. }
  794. .site-title img {
  795. margin-left: 10px;
  796. }
  797. .site-header {
  798. border-radius: <?=iro_opt('nav_menu_radius', ''); ?>px !important;
  799. }
  800. .header-user-menu {
  801. border-radius: <?=iro_opt('nav_menu_secondary_radius', ''); ?>px !important;
  802. }
  803. .lower li ul {
  804. border-radius: <?=iro_opt('nav_menu_secondary_radius', ''); ?>px !important;
  805. }
  806. @media (max-width:860px) {
  807. .openNav .icon {
  808. left: 5vw;
  809. }
  810. .site-header {
  811. width: 100%;
  812. height: 60px;
  813. top: 0;
  814. left: 0;
  815. background: 0 0;
  816. position: fixed;
  817. border-radius: 0 !important;
  818. }
  819. .yya {
  820. border-radius: 0 !important;
  821. }
  822. }
  823. <?php }if(iro_opt('nav_menu_style') == 'sakura'){ ?>
  824. .site-header {
  825. width: 100%;
  826. height: 75px;
  827. top: 0;
  828. left: 0;
  829. background: 0 0;
  830. -webkit-transition: all .4s ease;
  831. transition: all .4s ease;
  832. position: fixed;
  833. z-index: 999;
  834. border-radius: 0px;
  835. }
  836. @media (max-width:860px) {
  837. .site-header {
  838. height: 60px;
  839. }
  840. }
  841. <?php } ?>
  842. <?php if (!iro_opt('nav_menu_secondary_arrow', 'true')): ?>
  843. .header-user-menu::before {
  844. display: none;
  845. }
  846. .lower li ul::before {
  847. display: none;
  848. }
  849. <?php endif; ?>
  850. <?php if (!iro_opt('shuoshuo_arrow', 'true')): ?>
  851. .cbp_tmtimeline > li:nth-child(odd) .cbp_tmlabel:after {
  852. display: none;
  853. }
  854. .cbp_tmtimeline > li .cbp_tmlabel:after {
  855. display: none;
  856. }
  857. <?php endif; ?>
  858. <?php if (iro_opt('exhibition_area_compat', 'true')): ?>
  859. .the-feature.from_left_and_right {
  860. position: relative;
  861. border-radius: <?=iro_opt('exhibition_radius', ''); ?>px;
  862. height: 160px;
  863. width: 258px;
  864. margin: 6px 6px 0 6px;
  865. }
  866. .the-feature img {
  867. height: 160px;
  868. width: 258px;
  869. }
  870. <?php endif; ?>
  871. <?php if(iro_opt('bulletin_board_text_align') == 'center'){ ?>
  872. .notice {
  873. text-align: center;
  874. }
  875. <?php }if(iro_opt('bulletin_board_text_align') == 'right'){ ?>
  876. .notice {
  877. text-align: right;
  878. }
  879. <?php } ?>
  880. <?php if(iro_opt('area_title_text_align') == 'center'){ ?>
  881. h1.fes-title,
  882. h1.main-title {
  883. text-align: center;
  884. }
  885. <?php }if(iro_opt('area_title_text_align') == 'right'){ ?>
  886. h1.fes-title,
  887. h1.main-title {
  888. text-align: right;
  889. }
  890. <?php } ?>
  891. <?php if(iro_opt('bulletin_board_style') == 'picture'){ ?>
  892. .notice {
  893. background-image:url(<?=iro_opt('bulletin_board_bg', ''); ?>);
  894. background-repeat: round;
  895. border: none;
  896. box-shadow: 1px 1px 3px rgba(0, 0, 0, .3);
  897. }
  898. <?php }if(iro_opt('bulletin_board_style') == 'pure'){ ?>
  899. .notice {
  900. background: #fbfbfb50;
  901. }
  902. <?php }
  903. $nav_menu_blur=iro_opt('nav_menu_blur','0');
  904. if($nav_menu_blur != '0'){
  905. ?>
  906. .yya{
  907. backdrop-filter: blur(<?=$nav_menu_blur?>px);
  908. -webkit-backdrop-filter: blur(<?=$nav_menu_blur?>px);
  909. }
  910. <?php
  911. }
  912. ?>
  913. <?php
  914. if(iro_opt('cover_half_screen_curve',true)){
  915. ?>
  916. .headertop-bar::after {
  917. content: '';
  918. width: 150%;
  919. height: 4.375rem;
  920. background: #fff;
  921. left: -25%;
  922. bottom: -2.875rem;
  923. border-radius: 100%;
  924. position: absolute;
  925. z-index: 4;
  926. }
  927. <?php
  928. }
  929. ?>
  930. body{
  931. background-size:<?=iro_opt(('reception_background_size'),'auto')
  932. ?>;
  933. }
  934. #video-add{
  935. background-image: url(<?=iro_opt('vision_resource_basepath', 'https://s.nmxc.ltd/sakurairo_vision/@2.5/')?>basic/add.png);
  936. }
  937. body.dark .post-footer {
  938. background-image: url(<?=iro_opt('vision_resource_basepath', 'https://s.nmxc.ltd/sakurairo_vision/@2.5/')?>basic/creativecommons-dark.png);
  939. }
  940. @media (max-width:860px) {
  941. .headertop.filter-dot::before {
  942. background-image: url(<?=iro_opt('vision_resource_basepath', 'https://s.nmxc.ltd/sakurairo_vision/@2.5/')?>basic/grid.png);
  943. }
  944. }
  945. .post-footer{background-image: url(<?=iro_opt('vision_resource_basepath', 'https://s.nmxc.ltd/sakurairo_vision/@2.5/')?>basic/creativecommons-light.png);}
  946. .headertop.filter-grid::before {
  947. background-image: url(<?=iro_opt('vision_resource_basepath', 'https://s.nmxc.ltd/sakurairo_vision/@2.5/')?>basic/grid.png);
  948. }
  949. .headertop.filter-dot::before {
  950. background-image: url(<?=iro_opt('vision_resource_basepath', 'https://s.nmxc.ltd/sakurairo_vision/@2.5/')?>basic/dot.gif);
  951. }
  952. .loadvideo,.video-play {
  953. background-image: url(<?=iro_opt('vision_resource_basepath', 'https://s.nmxc.ltd/sakurairo_vision/@2.5/')?>basic/play.png);
  954. }
  955. .video-pause {
  956. background-image: url(<?=iro_opt('vision_resource_basepath', 'https://s.nmxc.ltd/sakurairo_vision/@2.5/')?>basic/stop.png);
  957. }
  958. #loading-comments {
  959. background-image: url(<?=iro_opt('vision_resource_basepath', 'https://s.nmxc.ltd/sakurairo_vision/@2.5/')?>load_svg/ball.svg);
  960. }
  961. <?php if (iro_opt('wave_effects', 'true')): ?>
  962. #banner_wave_1 {
  963. background: url(<?=iro_opt('vision_resource_basepath', 'https://s.nmxc.ltd/sakurairo_vision/@2.5/')?>basic/wave1.png) repeat-x;
  964. }
  965. #banner_wave_2 {
  966. background: url(<?=iro_opt('vision_resource_basepath', 'https://s.nmxc.ltd/sakurairo_vision/@2.5/')?>basic/wave2.png) repeat-x;
  967. }
  968. <?php endif; ?>
  969. </style>
  970. <?php }
  971. add_action('wp_head', 'customizer_css');