Posted in bootstrap
135
12:38 pm, October 13, 2021
 

site update incoming before and after

dark mode saves state as well, but still flashes light a bit, so need to modify the light background so that the flash is not as blinding.

still cant see the text on light mode

new card theme

dark mode version

before

made the tites more subtle, and larger, so they are also not as blinding, they still work on light mode as well.

added the dots but they dont do anything yet

maybe should add some functions to them.

add dots to your card

simple code so far

.dot {
  height:18px;
  width:18px;
  border-radius:40px;
  background:#000;
  float:left;
  margin-right:5px;
  margin-top:4px;
  box-shadow:0px 1px 2px rgba(0,0,0,0.3);
  border:1px solid rgba(0,0,0,0.3);
}
.dot-red {
  background:#ff6054;
}
<div class='col col-lg-2'>
  <div class='dots'>
    <div class='dot dot-red'></div>
    <div class='dot dot-orange'></div>
    <div class='dot dot-green'></div>
  </div>
</div>

changed the bootstrap to the latest but that seemed to break the dropdown.

dark mode method

https://github.com/vinorodrigues/bootstrap-dark-5/blob/main/docs/bootstrap-nightshade.md

had to swap back to old bootstrap js to fix the drop downs.

View Statistics
This Week
46
This Month
202
This Year
1611

No Items Found.

Add Comment
Type in a Nick Name here
 
Other Items in bootstrap
Search Articles
Search Articles by entering your search text above.
Welcome

This is my test area for webdev. I keep a collection of code here, mostly for my reference. Also if i find a good link, i usually add it here and then forget about it. more...

You could also follow me on twitter. I have a couple of youtube channels if you want to see some video related content. RuneScape 3, Minecraft and also a coding channel here Web Dev.

If you found something useful or like my work, you can buy me a coffee here. Mmm Coffee. ☕

❤️👩‍💻🎮

🪦 2000 - 16 Oct 2022 - Boots
Random Quote

You come to understand that most people are neither for you nor against you, they are thinking about themselves. You learn that no matter how hard you try to please, some people in this world are not going to love you, a lesson that is at first troubling and then really quite relaxing.” ​


John W. Gardner
Random CSS Property

translate3d()

The translate3d() CSS function repositions an element in 3D space. Its result is a <transform-function> data type.
translate3d() css reference