Network Vendor Command Comparison
/* ── Intro ── */
.intro {
margin-bottom: 30px;
padding: 20px;
background: #f8f9fa;
border-left: 5px solid #667eea;
border-radius: 6px;
}
.intro p {
margin: 10px 0;
color: #495057;
line-height: 1.6;
}
/* ── Stat cards ── */
.stats {
display: flex;
gap: 20px;
margin-bottom: 30px;
flex-wrap: wrap;
}
.stat-card {
flex: 1;
min-width: 150px;
padding: 20px;
background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
color: white;
border-radius: 8px;
box-shadow: 0 2px 4px rgba(0,0,0,0.1);
}
.stat-label {
font-size: 14px;
opacity: 0.9;
margin-bottom: 5px;
}
.stat-value {
font-size: 32px;
font-weight: bold;
}
/* ── Vendor selector ── */
.vendor-section {
margin-bottom: 24px;
padding: 20px;
background: white;
border: 1px solid #e0e0e0;
border-radius: 8px;
box-shadow: 0 2px 4px rgba(0,0,0,0.05);
}
.vendor-section-label {
display: block;
margin-bottom: 12px;
font-weight: 600;
color: #333;
}
.vendor-grid {
display: flex;
flex-wrap: wrap;
gap: 10px;
}
.vendor-card {
cursor: pointer;
border: 2px solid #667eea;
border-radius: 6px;
padding: 10px 16px;
background: white;
color: #667eea;
font-size: 13px;
font-weight: 600;
text-align: center;
user-select: none;
transition: all 0.2s ease;
min-width: 120px;
}
.vendor-card .vsub {
font-size: 11px;
font-weight: 400;
opacity: 0.8;
margin-top: 2px;
}
.vendor-card:hover:not(.vc-disabled) {
background: #f0f0ff;
}
.vendor-card.vc-selected {
background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
color: white;
border-color: transparent;
box-shadow: 0 2px 6px rgba(102,126,234,0.35);
}
.vendor-card.vc-selected .vsub {
opacity: 0.9;
}
.vendor-card.vc-disabled {
opacity: 0.35;
pointer-events: none;
}
.vendor-hint {
margin-top: 10px;
font-size: 12px;
color: #6c757d;
}
/* ── Search section ── */
.search-section {
margin-bottom: 20px;
padding: 20px;
background: white;
border: 1px solid #e0e0e0;
border-radius: 8px;
box-shadow: 0 2px 4px rgba(0,0,0,0.05);
}
.search-row {
display: flex;
gap: 12px;
align-items: center;
flex-wrap: wrap;
}
.search-label {
display: block;
margin-bottom: 10px;
font-weight: 600;
color: #333;
}
#vcSearchInput {
flex: 1;
min-width: 200px;
padding: 12px 15px;
font-size: 16px;
border: 2px solid #ced4da;
border-radius: 6px;
transition: all 0.3s ease;
}
#vcSearchInput:focus {
outline: none;
border-color: #667eea;
box-shadow: 0 0 0 3px rgba(102, 126, 234, 0.1);
}
/* ── Category pills ── */
.category-pills {
display: flex;
flex-wrap: wrap;
gap: 6px;
margin-top: 14px;
}
.pill {
cursor: pointer;
padding: 6px 14px;
border-radius: 20px;
font-size: 13px;
border: 1px solid #ced4da;
background: white;
color: #495057;
transition: all 0.2s ease;
user-select: none;
}
.pill:hover {
border-color: #667eea;
color: #667eea;
}
.pill.pill-active {
background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
color: white;
border-color: transparent;
}
/* ── Table container ── */
.table-container {
background: white;
border: 1px solid #e0e0e0;
border-radius: 8px;
overflow: hidden;
box-shadow: 0 2px 4px rgba(0,0,0,0.05);
}
#compareTable {
width: 100%;
border-collapse: collapse;
table-layout: fixed;
}
#compareTable thead {
background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
color: white;
position: sticky;
top: 0;
z-index: 10;
}
#compareTable th {
padding: 15px 12px;
text-align: left;
font-weight: 600;
font-size: 13px;
text-transform: uppercase;
letter-spacing: 0.5px;
word-break: break-word;
}
#compareTable th.th-function {
width: 18%;
}
#compareTable td {
padding: 12px;
border-bottom: 1px solid #e9ecef;
color: #495057;
vertical-align: top;
word-break: break-word;
}
/* Category group header row */
#compareTable tr.cat-row td {
background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
color: white;
font-weight: 600;
font-size: 13px;
text-transform: uppercase;
letter-spacing: 0.5px;
padding: 8px 12px;
}
/* Function name column */
.fn-name {
font-weight: 600;
color: #333;
font-size: 13px;
}
.fn-desc {
font-size: 11px;
color: #6c757d;
margin-top: 3px;
line-height: 1.4;
}
/* Cell states */
.cell-verified {
background: white;
}
.cell-unverified {
background: #fffde7;
}
.cell-nodata {
background: repeating-linear-gradient(
45deg,
#f8f8f8,
#f8f8f8 5px,
#efefef 5px,
#efefef 10px
);
color: #aaa;
font-style: italic;
font-size: 12px;
text-align: center;
vertical-align: middle !important;
}
/* Command text */
.cmd-text {
font-family: 'Courier New', Courier, monospace;
font-size: 12px;
white-space: pre-wrap;
word-break: break-all;
line-height: 1.5;
margin: 0;
}
.cell-unverified .cmd-text {
color: #5a3e00;
}
/* Verify badge */
.verify-badge {
display: inline-block;
background: #ff9800;
color: white;
font-size: 10px;
font-weight: 700;
padding: 1px 6px;
border-radius: 3px;
margin-bottom: 5px;
letter-spacing: 0.3px;
}
/* Copy button */
.copy-btn {
display: inline-block;
margin-top: 6px;
padding: 2px 8px;
font-size: 11px;
background: #f8f9fa;
border: 1px solid #dee2e6;
border-radius: 3px;
cursor: pointer;
color: #495057;
transition: all 0.15s;
}
.copy-btn:hover {
background: #667eea;
color: white;
border-color: #667eea;
}
/* Info tooltip — pure CSS */
.info-icon {
display: inline-block;
cursor: help;
color: #667eea;
font-size: 13px;
margin-left: 4px;
position: relative;
}
.info-icon::after {
content: attr(data-tip);
display: none;
position: absolute;
bottom: 125%;
left: 0;
background: #333;
color: white;
font-size: 12px;
line-height: 1.5;
padding: 8px 12px;
border-radius: 4px;
white-space: normal;
min-width: 200px;
max-width: 300px;
z-index: 100;
pointer-events: none;
}
.info-icon:hover::after {
display: block;
}
/* Row hover */
#compareTable tbody tr:not(.cat-row):hover td {
background: #f8f9fa !important;
transition: background 0.2s ease;
}
/* Loading / empty */
.loading {
text-align: center;
padding: 40px;
color: #6c757d;
}
.loading-spinner {
display: inline-block;
width: 40px;
height: 40px;
border: 4px solid #f3f3f3;
border-top: 4px solid #667eea;
border-radius: 50%;
animation: spin 1s linear infinite;
}
@keyframes spin {
0% { transform: rotate(0deg); }
100% { transform: rotate(360deg); }
}
.error {
padding: 20px;
background: #f8d7da;
color: #721c24;
border: 1px solid #f5c6cb;
border-radius: 6px;
margin: 20px 0;
}
.no-results {
padding: 40px;
text-align: center;
color: #6c757d;
font-size: 16px;
}
/* Mobile */
@media (max-width: 768px) {
.stats {
flex-direction: column;
}
.stat-card {
min-width: 100%;
}
.vendor-card {
min-width: 90px;
font-size: 12px;
padding: 8px 10px;
}
#compareTable {
font-size: 12px;
}
#compareTable th,
#compareTable td {
padding: 8px;
}
.cmd-text {
font-size: 11px;
}
}
اعدادوشمار
وینڈر سلیکٹر
تلاش + زمرہ فلٹر
میز
نیٹ ورک وینڈر CLI کمانڈ کا موازنہ
سسٹم، انٹرفیس، وی ایل اے این، ایس ٹی پی، او ایس پی ایف، بی جی پی، اور بی جی پی ای وی پی این زمروں میں ان کے سی ایل آئی کمانڈز کا شانہ بشانہ موازنہ کرنے کے لیے 4 تک وینڈرز کو منتخب کریں۔ نتائج کو محدود کرنے کے لیے سرچ باکس اور زمرہ کے فلٹرز کا استعمال کریں۔
سیلز کو نشان زد کیا گیا۔⚠ تصدیق کریں۔پیداوار میں استعمال کرنے سے پہلے موجودہ وینڈر دستاویزات کے خلاف توثیق کی جانی چاہئے۔ گرے سیل اس وینڈر کے لیے دستیاب ڈیٹا کی نشاندہی نہیں کرتے۔
کل افعال
-
فلٹر شدہ نتائج
-
وینڈرز کا انتخاب کیا گیا۔
2
|
کمانڈ ڈیٹا لوڈ ہو رہا ہے... |