Create reader.py

reader.py

@@ -0,0 +1,147 @@
+import os
+from yattag import Doc
+
+## --------------------------------- ###
+###          creating html           ###
+### -------------------------------- ###
+def get_article(acc, feats):
+  
+  title = 'Potential Buyer Fit Analysis'
+  description = 'How Well Does a Partner with the Selected Characteristics Fit?'
+  
+  # use yattag library to generate html
+  doc, tag, text, line = Doc().ttl()
+  
+  # create html for accuracy and feature weight
+  with tag('div'):
+    with tag('div', klass='model-container'):
+      with tag('div', klass='box model-div'):
+        line('h2', "Model Accuracy", klass='acc-feat')
+        line('p', acc, klass='num')
+      with tag('div', klass='box model-div'):
+        line('h2', "Feature Weight", klass='acc-feat')
+        line('p', "1. " + feats[0], klass='num')
+        line('p', "2. " + feats[1], klass='num')
+        line('p', "3. " + feats[2], klass='num')
+        line('p', "4. " + feats[3], klass='num')
+      
+  css = '''
+  .component {
+    margin-bottom: 20px;
+  }
+  
+  .panel-button {
+    background-color: #7f7f7f !important;
+    border: solid 1px #7f7f7f !important;
+    color: #FFFFFF !important;
+    margin: 5px;
+    box-shadow: 0px 9px 0px #2a2b2b !important;
+    transition: all .2s ease-out 0s !important;
+  }
+  
+  .panel-button:hover {
+    box-shadow: 0 5px #00AEAB;
+    transform: translateY(5px);
+  }
+  
+  .submit {
+    background-color: #dd2184 !important;
+    border: solid 1px #dd2184 !important;
+    box-shadow: 0px 9px 0px #c14c89 !important;
+  }
+  
+  .radio-item {
+    transition: margin-top 0.3s ease, box-shadow 0.3s ease;
+    transition: background-color 0.3s, color 0.3s;
+    background-color: #c9e7fb !important;
+    border: solid 1px #c9e7fb;
+    margin: 5px;
+    box-shadow: 0px 9px 0px #66bbf4;
+    white-space: normal !important;
+    gap: 2px !important;
+  }
+  
+  .selected {
+    transition: margin-top 0.2s ease, box-shadow 0.2s ease;
+    margin-top:9px;
+    margin: 5px !important;
+    box-shadow: 0px 9px 0px #3482c5 !important;
+    border: solid 1px #7db9eb !important;
+    background-color: #7db9eb !important;
+  }
+  
+  .panel-header {
+    background-color: #37aae0;
+    color: #FFFFFF !important;
+    padding: 5px !important;
+  }
+  
+  .radio-item:hover {
+    background-color: #7db9eb !important;
+    border: solid 1px #7db9eb;
+    box-shadow: 0px 9px 0px #3482c5 !important;
+    color: #FFFFFF;
+  }
+  '''
+
+  css += '''
+  .panel {
+    background-image: url("https://imageio.forbes.com/specials-images/imageserve/5ed6636cdd5d320006caf841/The-Blackout-Tuesday-movement-is-causing-Instagram-feeds-to-turn-black-/960x0.jpg?fit=bounds&format=jpg&width=960");
+    background-size: 650px 400px !important;
+    background-position: center;
+    background-repeat: no-repeat;
+  }
+  
+  .output-text {
+    border-radius: 20px;
+    text-align: center;
+  }
+  
+  .duration {
+    visibility: hidden !important;
+  }
+  
+  .box {
+    background-color: #7f7f7f !important;
+    margin: 10px;
+    padding: 5px;
+  }
+  
+  .acc-feat {
+    color: #FFFFFF !important;
+  }
+  
+  .num {
+    margin-top: 3px;
+    margin-left: 10%;
+    margin-right: 3%;
+    padding: 5px;
+    border-radius: 15px;
+    background-color: #FFFFFF !important;
+    text-align: right;
+  }
+  
+  .description {
+    text-align: center;
+  }
+  
+  .model-container {
+    display: flex;
+    justify-content: space-around !important;
+  }
+  
+  .model-div {
+    width: 40%;
+  }
+  
+  .flex-wrap {
+    flex-wrap: nowrap !important;
+  }
+  '''
+  
+  return {
+    'article': doc.getvalue(),
+    'css': css,
+    'title': title,
+    'description': description,
+  }