Begin implementing additional query settings

This commit is contained in:
Mark Veidemanis 2022-08-03 07:20:30 +01:00
parent 90f547e77f
commit 8b7fef59c5
Signed by: m
GPG Key ID: 5ACFCEED46C0904F
2 changed files with 43 additions and 4 deletions

View File

@ -10,7 +10,9 @@
<link rel="shortcut icon" href="{% static 'favicon.ico' %}"> <link rel="shortcut icon" href="{% static 'favicon.ico' %}">
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bulma@0.9.4/css/bulma.min.css"> <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bulma@0.9.4/css/bulma.min.css">
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@creativebulma/bulma-tooltip@1.2.0/dist/bulma-tooltip.min.css"> <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@creativebulma/bulma-tooltip@1.2.0/dist/bulma-tooltip.min.css">
<link rel="stylesheet" href="https://site-assets.fontawesome.com/releases/v6.1.1/css/all.css" /> <link rel="stylesheet" href="https://site-assets.fontawesome.com/releases/v6.1.1/css/all.css">
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bulma-slider@2.0.5/dist/css/bulma-slider.min.css">
<script src="https://cdn.jsdelivr.net/npm/bulma-slider@2.0.5/dist/js/bulma-slider.min.js"></script>
<script src="https://unpkg.com/htmx.org@1.8.0" integrity="sha384-cZuAZ+ZbwkNRnrKi05G/fjBX+azI9DNOkNYysZ0I/X5ZFgsmMiBXgDZof30F5ofc" crossorigin="anonymous"></script> <script src="https://unpkg.com/htmx.org@1.8.0" integrity="sha384-cZuAZ+ZbwkNRnrKi05G/fjBX+azI9DNOkNYysZ0I/X5ZFgsmMiBXgDZof30F5ofc" crossorigin="anonymous"></script>
<script src="https://unpkg.com/htmx.org@1.8.0/dist/ext/remove-me.js"></script> <script src="https://unpkg.com/htmx.org@1.8.0/dist/ext/remove-me.js"></script>
<script src="https://unpkg.com/hyperscript.org@0.9.7"></script> <script src="https://unpkg.com/hyperscript.org@0.9.7"></script>
@ -46,6 +48,9 @@
white-space: -o-pre-wrap; /* Opera 7 */ white-space: -o-pre-wrap; /* Opera 7 */
word-wrap: break-word; /* IE */ word-wrap: break-word; /* IE */
} }
.slider-output {
width: 4rem !important;
}
</style> </style>
</head> </head>
<body> <body>

View File

@ -32,7 +32,7 @@
<div class="column is-2"> <div class="column is-2">
<div <div
_="on click toggle .is-hidden on #options" _="on click toggle .is-hidden on #options"
class="button is-light has-text-link is-centered"> class="button is-light has-text-link is-right">
Options Options
</div> </div>
</div> </div>
@ -41,8 +41,8 @@
<div id="options" class="columns is-hidden"> <div id="options" class="columns is-hidden">
<div class="column"> <div class="column">
<div class="field has-addons"> <div class="field has-addons">
<div class="control is-expanded has-icons-left"> <div class="control has-icons-left">
<span class="select is-fullwidth"> <span class="select">
<select name="size"> <select name="size">
{% for size in sizes %} {% for size in sizes %}
<option value="{{ size }}">{{ size }}</option> <option value="{{ size }}">{{ size }}</option>
@ -60,6 +60,40 @@
</p> </p>
</div> </div>
</div> </div>
<div class="column">
<div class="field has-addons">
<div class="control has-icons-left">
<span class="select">
<select name="source">
<option value="irc">IRC</option>
<option value="dis">Discord</option>
</select>
<span class="icon is-small is-left">
<i class="fas fa-magnifying-glass"></i>
</span>
</span>
</div>
<p class="control">
<a class="button is-static">
source
</a>
</p>
</div>
</div>
<div class="column">
<div class="field has-addons">
<div class="control">
<input id="sliderWithValue" class="slider has-output-tooltip is-fullwidth" min="-1" max="1" value="0" step="0.05" type="range">
<output for="sliderWithValue" class="slider-output">0</output>
<script>bulmaSlider.attach();</script>
</div>
<p class="control">
<a class="button is-static">
sentiment
</a>
</p>
</div>
</div>
</div> </div>
<div class="is-hidden"></div> <div class="is-hidden"></div>
</form> </form>