$cache[$key] = empty($arr) ? NULL : $arr; return $cache[$key]; } // 门户 获取需要在频道显示的栏目主题数据 function portal_channel_thread($fid) { global $forumlist; if (empty($fid)) return NULL; $orderby = array('tid' => 1); $page = 1; // 遍历所有在频道显示内容的栏目 $category_forumlist = channel_category($fid); $arrlist = array(); $forum_tids = array(); $tidlist = array(); if ($category_forumlist) { foreach ($category_forumlist as &$_forum) { // 频道显示数据 $arrlist['list'][$_forum['fid']] = array( 'fid' => $_forum['fid'], 'name' => $_forum['name'], 'rank' => $_forum['rank'], 'type' => $_forum['type'], 'url' => $_forum['url'], 'channel_new' => $_forum['channel_new'], ); $forum_thread = thread_tid__find(array('fid' => $_forum['fid']), $orderby, $page, $_forum['channel_new'], 'tid', array('tid')); // 最新信息按栏目分组 foreach ($forum_thread as $key => $_thread) { $forum_tids[$key] = $_thread; } unset($forum_thread); } $tidlist += $forum_tids; } unset($category_forumlist); // 获取属性对应的tid集合 list($flaglist, $flagtids) = flag_thread_by_fid($fid); empty($flagtids) || $tidlist += $flagtids; unset($flagtids); // 频道置顶 $stickylist = sticky_list_thread($fid); empty($stickylist) || $tidlist += $stickylist; // 在这之前合并所有二维数组 tid值为键/array('tid值' => tid值) $tidarr = arrlist_values($tidlist, 'tid'); // 在这之前使用$tidarr = array_merge($tidarr, $arr)前合并所有一维数组 tid/array(1,2,3) if (empty($tidarr)) { $arrlist['list'] = isset($arrlist['list']) ? array_multisort_key($arrlist['list'], 'rank', FALSE, 'fid') : array(); return $arrlist; } $tidarr = array_unique($tidarr); $pagesize = count($tidarr); // 遍历获取的所有tid主题 $threadlist = well_thread_find_asc($tidarr, $pagesize); // 遍历时为升序，翻转为降序 $threadlist = array_reverse($threadlist); foreach ($threadlist as &$_thread) { // 各栏目最新内容 isset($forum_tids[$_thread['tid']]) AND $arrlist['list'][$_thread['fid']]['news'][$_thread['tid']] = $_thread; // 全站置顶内容 isset($stickylist[$_thread['tid']]) AND $arrlist['sticky'][$_thread['tid']] = $_thread; // 首页属性主题 if (!empty($flaglist)) { foreach ($flaglist as $key => $val) { if (isset($val['tids']) && in_array($_thread['tid'], $val['tids'])) { $arrlist['flaglist'][$key][array_search($_thread['tid'], $val['tids'])] = $_thread; ksort($arrlist['flaglist'][$key]); $arrlist['flag'][$_thread['tid']] = $_thread; } } } } unset($threadlist); if (isset($arrlist['sticky'])) { $i = 0; foreach ($arrlist['sticky'] as &$val) { ++$i; $val['i'] = $i; } } if (isset($arrlist['flag'])) { $i = 0; foreach ($arrlist['flag'] as &$val) { ++$i; $val['i'] = $i; } } if (isset($arrlist['flaglist'])) { foreach ($arrlist['flaglist'] as &$val) { $i = 0; foreach ($val as &$v) { ++$i; $v['i'] = $i; } } } isset($arrlist['list']) AND $arrlist['list'] = array_multisort_key($arrlist['list'], 'rank', FALSE, 'fid'); return $arrlist; } ?>javascript - Material-Ui theme customization: hover on contained button - Stack Overflow

科技改变生活-雨落星辰 - 所有的伟大,都源于一个勇敢的开始

    最新消息：雨落星辰是一个专注网站SEO优化、网站SEO诊断、搜索引擎研究、网络营销推广、网站策划运营及站长类的自媒体原创博客
    你的位置： 首页>programmer>javascript - Material-Ui theme customization: hover on contained button - Stack Overflow

    javascript - Material-Ui theme customization: hover on contained button - Stack Overflow

    programmeradmin0浏览0评论

    So I'm trying to configure a theme for Material-Ui on my React app. In the app I use two different type of buttons, contained and outlined. The problem is the hover effect on the contained button (the outlined works fine) and will default to a grey hover effect.

    overrides: {
 MuiButton: {
  contained: {
   backgroundColor: palette.primary.main,
   color: palette.primary.contrastText,
   "&:hover": {
     backgroundColor: palette.primary.active,
   },
  },
  outlined: {
    color: palette.primary.main,
    "&:hover": {
      backgroundColor: palette.primary.active,
    },
  },
 }
}

    outlined = working
    contained = not working

    This is from the element inspector, where my color is the one with a strike through
    background-color:
    #e0e0e0.MuiButton-contained:hover
    rgba(23, 0, 255, 0.3).MuiButton-contained:hover

    Anyone got any idea what's wrong?

    So I'm trying to configure a theme for Material-Ui on my React app. In the app I use two different type of buttons, contained and outlined. The problem is the hover effect on the contained button (the outlined works fine) and will default to a grey hover effect.

    overrides: {
 MuiButton: {
  contained: {
   backgroundColor: palette.primary.main,
   color: palette.primary.contrastText,
   "&:hover": {
     backgroundColor: palette.primary.active,
   },
  },
  outlined: {
    color: palette.primary.main,
    "&:hover": {
      backgroundColor: palette.primary.active,
    },
  },
 }
}

    outlined = working
    contained = not working

    This is from the element inspector, where my color is the one with a strike through
    background-color:
    #e0e0e0.MuiButton-contained:hover
    rgba(23, 0, 255, 0.3).MuiButton-contained:hover

    Anyone got any idea what's wrong?

    • javascript
    • reactjs
    • material-ui
    Share Improve this question asked Jun 30, 2020 at 15:08 CedervallCedervall 1,9294 gold badges17 silver badges22 bronze badges
    Add a comment  | 

    2 Answers 2

    Reset to default 9

    You can try adding root, so something like:

    overrides: {
 MuiButton: {
  root: {
   "&:hover": {
     backgroundColor: palette.primary.active,
   },
  }
 }
}

    By default, the hover color (the background, for contained; the border, for outlined) will be palette.primary.dark. It could be these conflicting setup might cause some issues, try setting it there.

    与本文相关的文章

    发布评论

    评论列表(0)

    1. 暂无评论