gabriel/interverse
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity

Simple style changes

Browse source
This commit is contained in:
Gabriel 2022-01-26 04:20:24 -05:00
parent c4950e7369
commit 046b710479
3 changed files with 13 additions and 30 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

5
Client/index.html
View file

@ -12,13 +12,14 @@
<img x-bind:src="Alpine.store('data')['image']"> <img x-bind:src="Alpine.store('data')['image']">
<h1 x-text="Alpine.store('data')['name']"></h1> <h1 x-text="Alpine.store('data')['name']"></h1>
</div> </div>
<hr>
<h2>Content:</h2> <h2>Content:</h2>
<div id="interverse-resources"> <div id="interverse-resources">
<template x-for="resource in Alpine.store('data')['resources']"> <template x-for="resource in Alpine.store('data')['resources']">
<a x-bind:href="resource['location']"> <a x-bind:href="resource['location']">
<div class="interverse-resource"> <div class="interverse-resource">
<template x-if="resource['icon'] !=''">
<img class="interverse-resource-icon" x-bind:src="resource['icon']"> <img class="interverse-resource-icon" x-bind:src="resource['icon']">
</template>
<h2 x-text="resource['label']"></h2> <h2 x-text="resource['label']"></h2>
<p x-text="resource['description']"></p> <p x-text="resource['description']"></p>
</div> </div>
@ -32,7 +33,9 @@
<template x-if="Alpine.store(connection)['version'] >=0"> <template x-if="Alpine.store(connection)['version'] >=0">
<div x-on:click="initialize(connection+'/.well-known/interverse')"> <div x-on:click="initialize(connection+'/.well-known/interverse')">
<h3 x-text="Alpine.store(connection)['name']"></h3> <h3 x-text="Alpine.store(connection)['name']"></h3>
<template x-if="Alpine.store(connection)['image']!=''">
<img x-bind:src="Alpine.store(connection)['image']"> <img x-bind:src="Alpine.store(connection)['image']">
</template>
</div> </div>
</template> </template>

32
Client/theme.css
View file

@ -1,4 +1,3 @@
body{ body{
--theme-primary-color:white; --theme-primary-color:white;
--theme-secondary-color:black; --theme-secondary-color:black;
@ -8,7 +7,7 @@ body{
margin:0; margin:0;
display:flex; display:flex;
flex-direction: column; flex-direction: column;
font-size:185%; font-size:100%;
} }
@media screen and (min-width:1000px) { @media screen and (min-width:1000px) {
@ -17,28 +16,9 @@ body{
} }
} }
table { img {
border-spacing:0; max-width:15rem;
} }
th,td {
padding:0.5rem;
border:2px solid var(--theme-secondary-color);
}
a{
color:var(--theme-secondary-color)
}
a {
text-decoration: none;
}
.inververse{ .inververse{
display:flex; display:flex;
flex-direction: row; flex-direction: row;
@ -54,14 +34,15 @@ a {
} }
#interverse-resources{ #interverse-resources{
justify-content: space-evenly;
flex-wrap: wrap; flex-wrap: wrap;
display:flex; display:flex;
flex-direction: row; flex-direction: row;
} }
.interverse-resource{ .interverse-resource{
padding:2rem;
} }
.interverse-resource-icon{ .interverse-resource-icon{
height:3rem; height:3rem;
width:3rem; width:3rem;
@ -70,13 +51,12 @@ a {
display:flex; display:flex;
flex-wrap: wrap; flex-wrap: wrap;
flex-direction: row; flex-direction: row;
justify-content: space-evenly;
align-items: flex-start; align-items: flex-start;
} }
.interverse-connection{ .interverse-connection{
width:fit-content; width:fit-content;
border: 1px solid var(--theme-secondary-color); border: 1px solid var(--theme-secondary-color);
padding:0.5rem; padding:1rem;
margin:0.25rem; margin:0.25rem;
} }

2
Docs/index.html
View file

@ -10,7 +10,7 @@
<div> <div>
<h2>What is the interverse?</h2> <h2>What is the interverse?</h2>
<p> <p>
Interverse is a <a href="https://web0.small-web.org/">web0</a> search engine powered by trust and relationships. <br> <a href="/Interverse">Interverse</a> is a <a href="https://web0.small-web.org/">web0</a> search engine powered by trust and relationships. <br>
</p> </p>
<h2>What are the Benefits?</h2> <h2>What are the Benefits?</h2>