Skip to content

Commit 9d65a74

Browse files
James-9696James-9696
authored
Merge branch 'dev' into fix-header-data
2 parents 866be50 + a1717d4 commit 9d65a74

File tree

28 files changed

+5692
-2242
lines changed

28 files changed

+5692
-2242
lines changed

‎genui-sdk‎

‎packages/common/src/components/header.vue‎

Lines changed: 220 additions & 58 deletions
Original file line numberDiff line numberDiff line change
@@ -516,7 +516,7 @@ const toggleTheme = (event: MouseEvent) => {
516516
517517
.dropdown-100 {
518518
width: 100%;
519-
margin-left: 296px;
519+
margin-left: 269px;
520520
}
521521
522522
// flex-center
@@ -547,57 +547,7 @@ const toggleTheme = (event: MouseEvent) => {
547547
548548
.hand {
549549
cursor: pointer;
550-
}
551-
552-
@media screen and (max-width: 1890px) {
553-
.opentiny-design-header {
554-
display: grid;
555-
grid-template-columns: 1fr auto; // 两列：左侧内容 + 右侧nav-right
556-
grid-template-rows: auto auto; // 两行
557-
align-items: center;
558-
559-
.nav-left {
560-
margin-top: 16px;
561-
grid-column: 1; // 第1列
562-
grid-row: 1; // 第1行
563-
}
564-
565-
.nav-center {
566-
grid-column: 1 / -1; // 跨越所有列
567-
grid-row: 2; // 第2行
568-
margin-left: 0 !important; // 移除原来的左边距
569-
flex-wrap: wrap; // 允许内部换行
570-
margin: 16px 0; // 上下间距10px
571-
}
572-
573-
.nav-right {
574-
margin-top: 16px;
575-
grid-column: 2; // 第2列
576-
grid-row: 1; // 第1行
577-
margin-left: 0; // 移除auto margin
578-
.top-menu {
579-
.dropdown-menu {
580-
.dropdown-content-title {
581-
margin: 10px 0 0 112px;
582-
}
583-
.dropdown-100 {
584-
margin-left: 96px;
585-
}
586-
}
587-
}
588-
}
589-
}
590-
}
591-
592-
@media screen and (min-width: 1855px) {
593-
.opentiny-design-header {
594-
display: flex;
595-
justify-content: space-between;
596-
align-items: center;
597-
--top-height: 64px;
598-
height: var(--top-height);
599-
}
600-
}
550+
}
601551
602552
.opentiny-design-header {
603553
top: 0;
@@ -608,6 +558,7 @@ const toggleTheme = (event: MouseEvent) => {
608558
padding: 0 32px;
609559
background-color: #fff;
610560
border-bottom: 1px solid rgba(0, 0, 0, 0.1);
561+
height: 64px;
611562
612563
// 通用样式
613564
font-family: PingFangSC;
@@ -616,8 +567,8 @@ const toggleTheme = (event: MouseEvent) => {
616567
font-weight: 400;
617568
transition: all 0.3s;
618569
* {
619-
box-sizing: border-box;
620-
}
570+
box-sizing: border-box;
571+
}
621572
622573
& {
623574
.app-logo {
@@ -720,7 +671,6 @@ const toggleTheme = (event: MouseEvent) => {
720671
721672
722673
& .active {
723-
// border-bottom: 2px solid #000;
724674
.dropdown-menu {
725675
max-height: 290px;
726676
}
@@ -737,7 +687,6 @@ const toggleTheme = (event: MouseEvent) => {
737687
// 下拉面板 默认撑满宽度
738688
.dropdown-menu {
739689
display: flex;
740-
justify-content: center;
741690
position: absolute;
742691
left: 0;
743692
top: 64px;
@@ -754,12 +703,12 @@ const toggleTheme = (event: MouseEvent) => {
754703
font-size: 16px;
755704
font-weight: 400;
756705
line-height: 14px;
757-
margin: 60px 0 0 312px;
706+
margin: 16px 0 0 285px;
758707
}
759708
760709
.dropdown-content {
761710
width: auto;
762-
padding: 32px 0;
711+
padding: 16px 0;
763712
flex-wrap: wrap;
764713
justify-content: flex-start;
765714
gap: 24px;
@@ -963,6 +912,219 @@ const toggleTheme = (event: MouseEvent) => {
963912
964913
}
965914
}
915+
916+
@media screen and (max-width: 1720px) {
917+
.opentiny-design-header {
918+
display: grid;
919+
grid-template-columns: 1fr auto; // 两列：左侧内容 + 右侧nav-right
920+
grid-template-rows: auto auto; // 两行
921+
align-items: center;
922+
923+
.nav-left {
924+
margin-top: 16px;
925+
margin-right: 64px;
926+
grid-column: 1; // 第1列
927+
grid-row: 1; // 第1行
928+
}
929+
930+
.nav-center {
931+
grid-column: 1 / -1; // 跨越所有列
932+
grid-row: 2; // 第2行
933+
margin-left: 0 !important; // 移除原来的左边距
934+
flex-wrap: wrap; // 允许内部换行
935+
margin: 16px 0; // 上下间距10px
936+
}
937+
938+
.nav-right {
939+
margin-top: 16px;
940+
grid-column: 2; // 第2列
941+
grid-row: 1; // 第1行
942+
margin-left: 0; // 移除auto margin
943+
.top-menu {
944+
.dropdown-menu {
945+
.dropdown-content-title {
946+
margin: 16px 0 0 112px;
947+
}
948+
.dropdown-100 {
949+
margin-left: 96px;
950+
}
951+
}
952+
}
953+
}
954+
}
955+
}
956+
957+
@media (min-width: 1721px) and (max-width: 1854px) {
958+
.opentiny-design-header .nav-center {
959+
margin-left: 70px;
960+
grid-row: 1;
961+
}
962+
.opentiny-design-header {
963+
display: grid;
964+
align-items: center;
965+
.nav-left, .nav-right {
966+
grid-row: 1; // 第1行
967+
}
968+
}
969+
}
970+
971+
@media (min-width: 1740px) and (max-width: 1750px) {
972+
.opentiny-design-header .nav-right .dropdown-menu .dropdown-content-title {
973+
margin-left: 290px;
974+
}
975+
.dropdown-100 {
976+
margin-left: 275px;
977+
}
978+
}
979+
980+
@media (min-width: 1751px) and (max-width: 1760px) {
981+
.opentiny-design-header .nav-right .dropdown-menu .dropdown-content-title {
982+
margin-left: 295px;
983+
}
984+
.dropdown-100 {
985+
margin-left: 279px;
986+
}
987+
}
988+
989+
@media (min-width: 1761px) and (max-width: 1770px) {
990+
.opentiny-design-header .nav-right .dropdown-menu .dropdown-content-title {
991+
margin-left: 297px;
992+
}
993+
.dropdown-100 {
994+
margin-left: 282px;
995+
}
996+
}
997+
998+
@media (min-width: 1771px) and (max-width: 1780px) {
999+
.opentiny-design-header .nav-right .dropdown-menu .dropdown-content-title {
1000+
margin-left: 301px;
1001+
}
1002+
.dropdown-100 {
1003+
margin-left: 286px;
1004+
}
1005+
}
1006+
1007+
@media (min-width: 1781px) and (max-width: 1790px) {
1008+
.opentiny-design-header .nav-right .dropdown-menu .dropdown-content-title {
1009+
margin-left: 304px;
1010+
}
1011+
.dropdown-100 {
1012+
margin-left: 289px;
1013+
}
1014+
}
1015+
1016+
@media (min-width: 1791px) and (max-width: 1800px) {
1017+
.opentiny-design-header .nav-right .dropdown-menu .dropdown-content-title {
1018+
margin-left: 308px;
1019+
}
1020+
.dropdown-100 {
1021+
margin-left: 293px;
1022+
}
1023+
}
1024+
1025+
@media (min-width: 1801px) and (max-width: 1812px) {
1026+
.opentiny-design-header .nav-right .dropdown-menu .dropdown-content-title {
1027+
margin-left: 311px;
1028+
}
1029+
.dropdown-100 {
1030+
margin-left: 295px;
1031+
}
1032+
}
1033+
1034+
@media (min-width: 1813px) and (max-width: 1825px) {
1035+
.opentiny-design-header .nav-right .dropdown-menu .dropdown-content-title {
1036+
margin-left: 316px;
1037+
}
1038+
.dropdown-100 {
1039+
margin-left: 300px;
1040+
}
1041+
}
1042+
1043+
@media (min-width: 1826px) and (max-width: 1840px) {
1044+
.opentiny-design-header .nav-right .dropdown-menu .dropdown-content-title {
1045+
margin-left: 320px;
1046+
}
1047+
.dropdown-100 {
1048+
margin-left: 304px;
1049+
}
1050+
}
1051+
1052+
@media (min-width: 1841px) and (max-width: 1849px) {
1053+
.opentiny-design-header .nav-right .dropdown-menu .dropdown-content-title {
1054+
margin-left: 323px;
1055+
}
1056+
.dropdown-100 {
1057+
margin-left: 307px;
1058+
}
1059+
}
1060+
1061+
@media (min-width: 1850px) and (max-width: 1854px) {
1062+
.opentiny-design-header .nav-right .dropdown-menu .dropdown-content-title {
1063+
margin-left: 326px;
1064+
}
1065+
.dropdown-100 {
1066+
margin-left: 310px;
1067+
}
1068+
}
1069+
1070+
@media (min-width: 1855px) {
1071+
.opentiny-design-header .nav-right .dropdown-menu .dropdown-content-title {
1072+
margin-left: 310px;
1073+
}
1074+
.dropdown-100 {
1075+
margin-left: 295px;
1076+
}
1077+
}
1078+
1079+
@media (min-width: 990px) and (max-width: 1090px) {
1080+
.opentiny-design-header .nav-center .top-menu {
1081+
margin-right: 28px;
1082+
}
1083+
}
1084+
1085+
@media (min-width: 821px) and (max-width: 910px) {
1086+
.opentiny-design-header .nav-center .top-menu {
1087+
margin-right: 24px;
1088+
}
1089+
}
1090+
1091+
@media screen and (max-width: 1150px) {
1092+
.opentiny-design-header .nav-right .dropdown-menu .dropdown-content {
1093+
gap: 0;
1094+
}
1095+
}
1096+
1097+
@media (min-width: 985px) and (max-width: 1050px) {
1098+
.opentiny-design-header .nav-right .top-menu .dropdown-menu {
1099+
.dropdown-100 {
1100+
margin-left: 40px;
1101+
}
1102+
.dropdown-content-title {
1103+
margin: 10px 0 0 56px;
1104+
}
1105+
}
1106+
}
1107+
1108+
@media (min-width: 960px) and (max-width: 984px) {
1109+
.opentiny-design-header .nav-right .top-menu .dropdown-menu {
1110+
.dropdown-100 {
1111+
margin-left: 20px;
1112+
}
1113+
.dropdown-content-title {
1114+
margin: 10px 0 0 36px;
1115+
}
1116+
}
1117+
}
1118+
1119+
@media screen and (min-width: 1855px) {
1120+
.opentiny-design-header {
1121+
display: flex;
1122+
justify-content: space-between;
1123+
align-items: center;
1124+
--top-height: 64px;
1125+
height: var(--top-height);
1126+
}
1127+
}
9661128
</style>
9671129

9681130
<style lang="less">

‎packages/common/src/config/header.ts‎

Lines changed: 8 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -42,42 +42,42 @@ const menuItems = [
4242
},
4343
{
4444
name: 'TinyRobot',
45-
url: '/tiny-robot',
45+
url: `${basePath}tiny-robot`,
4646
children: [],
4747
logo: tinyRobot,
4848
desc: '智能助手',
4949
hide: false,
5050
github: 'https://github.com/opentiny/tiny-robot',
51-
isUnderline: createIsUnderline('/tiny-robot')
51+
isUnderline: createIsUnderline(`${basePath}tiny-robot`)
5252
},
5353
{
5454
name: 'NEXT-SDKs',
5555
desc: '开发套件',
56-
url: '/next-sdk',
56+
url: `${basePath}next-sdk`,
5757
logo: tinySdks,
5858
hide: false,
5959
github: 'https://github.com/opentiny/next-sdk',
6060
children: [],
61-
isUnderline: createIsUnderline('/next-sdk')
61+
isUnderline: createIsUnderline(`${basePath}next-sdk`)
6262
},
6363
{
6464
name: 'GenUI-SDK',
6565
desc: '生成式UI',
66-
url: '/genui-sdk',
66+
url: `${basePath}genui-sdk`,
6767
logo: GenuiSdk,
6868
hide: false,
6969
github: 'https://github.com/opentiny/genui-sdk',
7070
children: [],
71-
isUnderline: createIsUnderline('/genui-sdk')
71+
isUnderline: createIsUnderline(`${basePath}genui-sdk`)
7272
},
7373
{
7474
name: 'AI-Extension',
7575
desc: 'AI 浏览器扩展插件',
76-
url: '/ai-extension',
76+
url: `${basePath}ai-extension`,
7777
logo: tinyAi,
7878
hide: false,
7979
github: 'https://github.com/opentiny/tiny-robot',
80-
isUnderline: createIsUnderline('/ai-extension')
80+
isUnderline: createIsUnderline(`${basePath}ai-extension`)
8181
},
8282
{
8383
type: 'other',

0 commit comments

Comments
 (0)