diff --git a/src/views/portal/course/qualityCourse.vue b/src/views/portal/course/qualityCourse.vue index a97d7e44..f867145a 100644 --- a/src/views/portal/course/qualityCourse.vue +++ b/src/views/portal/course/qualityCourse.vue @@ -144,20 +144,26 @@
-
-
- 全部 -
- -
-
- {{tag.tagName}} +
+
+
+ 全部 +
+
+
+ {{tag.tagName}} +
-
@@ -1647,29 +1653,29 @@ export default { } // 导航 -.topNav { - display: flex; - margin-bottom: 20px; - - .nav { - display: flex; - align-items: center; - - .option-item { - position: relative; - - .nav-bottbor { - position: absolute; - top: 130%; - left: 0; - width: 100%; - height: 4px; - background: #387DF7; - border-radius: 5px; - } - } - } -} +//.topNav { +// display: flex; +// margin-bottom: 20px; +// +// .nav { +// display: flex; +// align-items: center; +// +// .option-item { +// position: relative; +// +// .nav-bottbor { +// position: absolute; +// top: 130%; +// left: 0; +// width: 100%; +// height: 4px; +// background: #387DF7; +// border-radius: 5px; +// } +// } +// } +//} .u-class { ::v-deep .el-dialog { @@ -2353,11 +2359,11 @@ export default { align-items: center; padding-top: 2px; } -.search-div.nav { - display: block; - width: 100%; - clear: both; -} +//.search-div.nav { +// display: block; +// width: 100%; +// clear: both; +//} .search-item-type { line-height: 25px; padding-right: 10px; @@ -2365,14 +2371,14 @@ export default { white-space: nowrap; } -.option-item { - font-family: "Menlo", "苹方-简" !important; - color: #3d3d3d; - display: inline-block; - font-size: 14px; - margin: 0px 15px; - cursor: pointer -} +//.option-item { +// font-family: "Menlo", "苹方-简" !important; +// color: #3d3d3d; +// display: inline-block; +// font-size: 14px; +// margin: 0px 15px; +// cursor: pointer +//} .option-border { width: 2px; @@ -2382,6 +2388,63 @@ export default { background: #666; } +.topNav { + display: flex; + margin-bottom: 20px; + height: auto; + min-height: 80px; + align-items: center; + + .nav { + display: flex; + align-items: center; + + .option-item { + position: relative; + margin: 0 15px; + cursor: pointer; + + .nav-bottbor { + position: absolute; + top: 100%; + left: 0; + width: 100%; + height: 4px; + background: #387DF7; + border-radius: 5px; + } + } + } +} + +.search-div.nav { + display: block; + width: 100%; + clear: both; +} + +.option-item { + margin: 0px 5px; +} + +.fieldbox { + display: flex; + white-space: nowrap; + flex-wrap: wrap; + + div { + margin: 0 15px; + display: inline-block; + font-size: 14px; + line-height: 25px; + font-weight: 500; + } + + .fieldactive { + color: #387DF7; + } +} + .option-active { color: #387DF7; } @@ -2421,88 +2484,23 @@ export default { background-color: transparent !important; } -.fieldbox { - - display: flex; - white-space: nowrap; - flex-wrap: wrap; - - div { - margin: 0 15px; - display: inline-block; - font-size: 14px; - line-height: 25px; - //color: #3d3d3d; - font-weight: 500; - } - - .fieldactive { - color: #387DF7; - } -} - - -/* 新增样式 */ -.tags-navigation-container { - display: flex; - align-items: center; - flex-wrap: nowrap; - gap: 0; - width: 100%; -} - -.all-tag { - flex-shrink: 0; - margin-right: 15px; - padding: 6px 12px; - border-radius: 4px; - background: #f5f7fa; - transition: all 0.3s ease; - border: 1px solid #e8e8e8; -} - -.hot-tags-wrapper { - display: flex; - flex-wrap: wrap; - align-items: center; - gap: 8px; - flex: 1; -} - -.tag-item { - padding: 6px 12px; - border-radius: 4px; - background: #f5f7fa; - transition: all 0.3s ease; - white-space: nowrap; - border: 1px solid #e8e8e8; -} - -.option-active { - background: #387DF7 !important; - color: white !important; - border-color: #387DF7 !important; -} - -.option-item { - cursor: pointer; - font-size: 14px; - color: #3d3d3d; - font-weight: 500; - display: inline-flex; - align-items: center; - height: 32px; -} - -.option-item:hover { - background: #e8f4ff; - color: #387DF7; -} - -/* 确保原有样式不受影响 */ -.search-div.nav { - display: block; - width: 100%; - clear: both; -} +//.fieldbox { +// +// display: flex; +// white-space: nowrap; +// flex-wrap: wrap; +// +// div { +// margin: 0 15px; +// display: inline-block; +// font-size: 14px; +// line-height: 25px; +// //color: #3d3d3d; +// font-weight: 500; +// } +// +// .fieldactive { +// color: #387DF7; +// } +//}