Upgrade Alias-Agent to 0.2.0 (#51)

Upgrade Alias-Agent to 0.2.0

---------

Co-authored-by: ZiTao-Li <zitao.l@alibaba-inc.com>
Co-authored-by: xieyxclack <yuexiang.xyx@alibaba-inc.com>
Co-authored-by: Zexi Li <tomleeze@qq.com>
Co-authored-by: SSSuperDan <dlaura2218@gmail.com>
Co-authored-by: lalaliat <78087788+lalaliat@users.noreply.github.com>
Co-authored-by: jinli.yl <jinli.yl@alibaba-inc.com>
Co-authored-by: Dengjiaji <dengjiaji.djj@alibaba-inc.com>
Co-authored-by: 于南 <zengtianjing.ztj@alibaba-inc.com>
Co-authored-by: JustinDing <166603159+sleepy-bird-world@users.noreply.github.com>
Co-authored-by: y1y5 <269557841@qq.com>
Co-authored-by: 柳佚 <yly287738@alibaba-inc.com>
Co-authored-by: LiangguiWeng <347185100@qq.com>
Co-authored-by: 潜星 <zhijian.mzj@alibaba-inc.com>
Co-authored-by: StCarmen <1106135234@qq.com>
Co-authored-by: LuYi <yilu_2000@outlook.com>
Co-authored-by: 刺葳 <ciwei.cy@alibaba-inc.com>

alias/frontend/src/components/Viewer/styles.ts

@@ -0,0 +1,256 @@
+// src/viewers/styles.ts
+
+export const COMMON_STYLES = `
+    body {
+        font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
+        color: #333;
+        line-height: 1.6;
+        padding: 30px;
+        max-width: 900px;
+        margin: 0 auto;
+        background-color: #ffffff;
+    }
+
+    /* Markdown heading styles */
+    h1, h2, h3, h4, h5, h6 {
+        position: relative;
+        margin-top: 1.5rem;
+        margin-bottom: 1rem;
+        font-weight: bold;
+        line-height: 1.4;
+        cursor: text;
+        color: #2c3e50;
+    }
+
+    h1 {
+        font-size: 2.25em;
+        border-bottom: 1px solid #eceff1;
+        padding-bottom: 0.3em;
+    }
+
+    h2 {
+        font-size: 1.75em;
+        border-bottom: 1px solid #eceff1;
+        padding-bottom: 0.3em;
+    }
+
+    h3 {
+        font-size: 1.5em;
+    }
+
+    h4 {
+        font-size: 1.25em;
+    }
+
+    h5 {
+        font-size: 1em;
+    }
+
+    h6 {
+        font-size: 1em;
+        color: #777;
+    }
+
+    /* Code block styles */
+    pre {
+        background-color: #f8f8f8;
+        border-radius: 3px;
+        padding: 10px;
+        font-size: 0.9em;
+        line-height: 1.5;
+        overflow-x: auto;
+        border: 1px solid #e9e9e9;
+    }
+
+    code {
+        font-family: 'Cascadia Code', 'Fira Code', Consolas, 'Courier New', monospace;
+        background-color: rgba(0,0,0,0.05);
+        padding: 0.2em 0.4em;
+        margin: 0;
+        border-radius: 3px;
+        font-size: 85%;
+    }
+
+    pre code {
+        background-color: transparent;
+        padding: 0;
+        margin: 0;
+        border-radius: 0;
+        font-size: 100%;
+    }
+
+    /* Table styles */
+    table {
+        border-collapse: collapse;
+        width: 100%;
+        margin-bottom: 1.5em;
+        display: block;
+        overflow-x: auto;
+    }
+
+    table tr {
+        background-color: #fff;
+        border-top: 1px solid #c6cbd1;
+    }
+
+    table tr:nth-child(2n) {
+        background-color: #f6f8fa;
+    }
+
+    table th,
+    table td {
+        padding: 10px 15px;
+        border: 1px solid #dfe2e5;
+    }
+
+    table th {
+        font-weight: bold;
+        background-color: #f0f0f0;
+        text-align: left;
+    }
+
+    /* Blockquote styles */
+    blockquote {
+        border-left: 4px solid #dfe2e5;
+        padding: 0 15px;
+        color: #777;
+        margin: 0;
+    }
+
+    /* List styles */
+    ul, ol {
+        padding-left: 30px;
+        margin-top: 0;
+        margin-bottom: 16px;
+    }
+
+    /* Link styles */
+    a {
+        color: #0366d6;
+        text-decoration: none;
+    }
+
+    a:hover {
+        text-decoration: underline;
+    }
+
+    /* Horizontal line */
+    hr {
+        border: 0;
+        height: 1px;
+        background-color: #e1e4e8;
+        margin: 16px 0;
+    }
+
+    /* Additional styles for inline code and code blocks */
+    .highlight {
+        background-color: #f8f8f8;
+        border-radius: 3px;
+    }
+
+    .linenos {
+        background-color: #f0f0f0;
+        padding-right: 10px;
+        text-align: right;
+        color: #999;
+    }
+
+    /* Image styles */
+    img {
+        max-width: 100%;
+        height: auto;
+        display: block;
+        margin: 1em 0;
+    }
+
+    /* Paragraph styles */
+    p {
+        margin-top: 0;
+        margin-bottom: 16px;
+    }
+
+    /* Emphasis styles */
+    em {
+        font-style: italic;
+    }
+
+    strong {
+        font-weight: bold;
+    }
+
+    /* Strikethrough styles */
+    del {
+        text-decoration: line-through;
+    }
+
+    /* Superscript and subscript */
+    sup, sub {
+        font-size: 75%;
+        line-height: 0;
+        position: relative;
+        vertical-align: baseline;
+    }
+
+    sup {
+        top: -0.5em;
+    }
+
+    sub {
+        bottom: -0.25em;
+    }
+
+    /* Keyboard input styles */
+    kbd {
+        background-color: #fafbfc;
+        border: 1px solid #d1d5da;
+        border-bottom-color: #c6cbd1;
+        border-radius: 3px;
+        box-shadow: inset 0 -1px 0 #c6cbd1;
+        color: #444d56;
+        display: inline-block;
+        font-size: 11px;
+        line-height: 10px;
+        padding: 3px 5px;
+        vertical-align: middle;
+    }
+
+    /* Text selection styles */
+    ::selection {
+        background: #b3d4fc;
+        text-shadow: none;
+    }
+
+    /* Scrollbar styles */
+    ::-webkit-scrollbar {
+        width: 8px;
+        height: 8px;
+    }
+
+    ::-webkit-scrollbar-track {
+        background: #f1f1f1;
+        border-radius: 4px;
+    }
+
+    ::-webkit-scrollbar-thumb {
+        background: #c1c1c1;
+        border-radius: 4px;
+    }
+
+    ::-webkit-scrollbar-thumb:hover {
+        background: #a8a8a8;
+    }
+`;
+
+export const HIGHLIGHT_STYLES = {
+  tomorrow: {
+    "hljs-comment": {
+      color: "#999999",
+    },
+    "hljs-keyword": {
+      color: "#cc99cd",
+    },
+    "hljs-string": {
+      color: "#7ec699",
+    },
+  },
+};