Hugging Face's logo

Spaces:
XMMR12
/
how-to-make-offline-model-make-online-model-easily
Running

App Files Community
XMMR12 commited on
Commit
04d137a
·
verified ·
1 Parent(s): 628ab99

updated for better visual

Browse files
Files changed (1) hide show
  1. index.html +42 -19
index.html CHANGED
@@ -1,3 +1,6 @@
 
 
 
1
  <!DOCTYPE html>
2
  <html lang="en">
3
  <head>
@@ -10,13 +13,11 @@
10
  padding: 0;
11
  box-sizing: border-box;
12
  }
13
-
14
  .container {
15
  display: flex;
16
  flex-wrap: wrap;
17
  min-height: 100vh;
18
  }
19
-
20
  .split-section {
21
  flex: 1 1 50%;
22
  padding: 2rem;
@@ -24,37 +25,59 @@
24
  align-items: center;
25
  justify-content: center;
26
  }
27
-
28
  .left-section {
29
  background-color: #f0f0f0;
30
  }
31
-
32
  .right-section {
33
  background-color: #e0e0e0;
34
  }
35
-
36
  .content {
37
  max-width: 600px;
38
  }
39
-
40
  @media (max-width: 768px) {
41
  .split-section {
42
  flex-basis: 100%;
43
  min-height: 50vh;
44
  }
45
  }
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
46
  </style>
47
  </head>
48
  <body>
49
  <div class="container">
50
  <div class="split-section left-section">
51
- <div class="content">
52
- <h2>Offline "smolagents" usage example:</h2>
53
- <p>from smolagents import CodeAgent, TransformersModel,DuckDuckGoSearchTool</p>
54
- <p>model_path = 'usr/Qwen3-4B-Instruct' #or 'C:/model/Qwen3-4B-Instruct' #(Path to model files usually .safetensors)</p>
55
- <p>model = TransformersModel(model_id=model_path,max_new_tokens=4096,device_map="auto")</p>
56
- <p>agent = CodeAgent(tools=[DuckDuckGoSearchTool()], model=model) #offline #uses TransformersModel</p>
57
- <p>agent.run("Is it good today?")</p>
 
 
 
 
58
  </div>
59
  </div>
60
 
@@ -64,12 +87,12 @@
64
 
65
 
66
  <div class="split-section right-section">
67
- <div class="content">
68
- <h2>Online "smolagents" usage example:</h2>
69
- <p>from smolagents import CodeAgent, HfApiModel,DuckDuckGoSearchTool</p>
70
- <p>model_path = 'huihui-ai/Qwen3-4B-abliterated' #HFspace online</p>
71
- <p>agent = CodeAgent(tools=[DuckDuckGoSearchTool()], model=HfApiModel(model_path)) #online</p>
72
- <p>agent.run("Is it good today?")</p>
73
  </div>
74
  </div>
75
  </div>
 
1
+
2
+ </style>
3
+
4
  <!DOCTYPE html>
5
  <html lang="en">
6
  <head>
 
13
  padding: 0;
14
  box-sizing: border-box;
15
  }
 
16
  .container {
17
  display: flex;
18
  flex-wrap: wrap;
19
  min-height: 100vh;
20
  }
 
21
  .split-section {
22
  flex: 1 1 50%;
23
  padding: 2rem;
 
25
  align-items: center;
26
  justify-content: center;
27
  }
 
28
  .left-section {
29
  background-color: #f0f0f0;
30
  }
 
31
  .right-section {
32
  background-color: #e0e0e0;
33
  }
 
34
  .content {
35
  max-width: 600px;
36
  }
 
37
  @media (max-width: 768px) {
38
  .split-section {
39
  flex-basis: 100%;
40
  min-height: 50vh;
41
  }
42
  }
43
+
44
+ .code {
45
+ display: inline;
46
+ background-color: #f3f4f6;
47
+ color: #dc2626;
48
+ padding: 0.2em 0.4em;
49
+ border-radius: 4px;
50
+ border: 1px solid #e5e7eb;
51
+ font-family: "SFMono-Regular", Consolas, "Liberation Mono", Menlo, monospace;
52
+ font-size: 0.9em;
53
+ line-height: 1.5;
54
+ vertical-align: baseline;
55
+ }
56
+
57
+ /* Color variations */
58
+ .code.blue { color: #2563eb; background-color: #dbeafe; border-color: #bfdbfe; }
59
+ .code.green { color: #059669; background-color: #d1fae5; border-color: #a7f3d0; }
60
+ .code.purple { color: #7c3aed; background-color: #ede9fe; border-color: #ddd6fe; }
61
+ .code.yellow { color: #8a6600; background-color: #fff7d1; border-color: #ece2a8; }
62
+ .code.orange { color: #b33c00; background-color: #ffe8d9; border-color: #ffd0b8; }
63
+ .code.teal { color: #006d6d; background-color: #d4f3f3; border-color: #a8e0e0; }
64
+ .code.pink { color: #9d174d; background-color: #fce7f3; border-color: #fbcfe8; }
65
  </style>
66
  </head>
67
  <body>
68
  <div class="container">
69
  <div class="split-section left-section">
70
+ <div class="content code yellow">
71
+ <h2 class="">Offline "smolagents" usage example:</h2><br>
72
+ <code class="code green">from smolagents import CodeAgent,</code><code class="code yellow">TransformersModel,</code><code class="code green">DuckDuckGoSearchTool</code><br><br>
73
+ <code class="code green">model_path = </code><code class="code yellow">'usr/Qwen3-4B' #or 'C:/model/Qwen3-4B'</code> <code class="code orange">#(Path to model files usually .safetensors)</code><br><br>
74
+ <code class="code purple">model = TransformersModel(
75
+ model_id=model_path,
76
+ max_new_tokens=4096,
77
+ device_map="auto"
78
+ )</code><br><br>
79
+ <code class="code green">agent = CodeAgent(tools=[DuckDuckGoSearchTool()], model=</code><code class="code purple">model</code><code class="code green">)</code><br><br>
80
+ <code class="code green">agent.run("Is it good today?")</code>
81
  </div>
82
  </div>
83
 
 
87
 
88
 
89
  <div class="split-section right-section">
90
+ <div class="content code yellow">
91
+ <h2>Online "smolagents" usage example:</h2><br>
92
+ <code class="code green">from smolagents import CodeAgent, </code><code class="code yellow">HfApiModel,</code><code class="code green">DuckDuckGoSearchTool</code><br><br>
93
+ <code class="code green">model_path = </code><code class="code yellow">'Qwen/Qwen3-4B'</code><code class="code orange">#(Path to model space)</code><br><br>
94
+ <code class="code green">agent = CodeAgent(tools=[DuckDuckGoSearchTool()], model=</code><code class="code purple">HfApiModel(model_path)</code><code class="code green">)</code><br><br>
95
+ <code class="code green">agent.run("Is it good today?")</code>
96
  </div>
97
  </div>
98
  </div>